Te Arawa FM - Serving their rohe with korero, panui and waiata

Client: Te Arawa Media — Te Arawa FM & The Heat FM
Location: Rotorua, Aotearoa New Zealand
Services: Web design, web development, SEO, live streaming integration

Te Arawa Media is a Māori media organisation serving the Te Arawa rohe from the heart of Rotorua. They operate two beloved radio stations — Te Arawa FM, broadcasting te reo Māori and the stories of the iwi, and The Heat FM, a contemporary music station reaching audiences from Rotorua to Tauranga, Taupō, and beyond.

When they came to us at Haurawhiti, they had two thriving stations and a community that loved them — but no digital home that matched the energy and mana of what they were building on the airwaves.

What the Client Needed

Te Arawa Media came to us with a clear challenge: their audience was growing, but there was no central website where people could listen live, read the latest news, watch videos, and find out what the stations were about — all in one place.

They needed a website that would:

• Reflect the identity of both stations without one overshadowing the other
• Allow listeners to tune in live directly from the browser, on any device
• Keep content fresh automatically — news and videos updated without requiring someone to manually post to the site every day
• Work flawlessly on mobile — the majority of their audience browses on their phones
• Honour te reo Māori as a first-class language, not an afterthought
• Look and feel premium — something the stations and the rohe would be proud of

What We Delivered

A Full-Stack Website Built for Media

We built a fast, modern website using Next.js and React — the same technology stack used by major media companies worldwide. This gives Te Arawa Media a platform that is quick to load, easy to scale, and ready to grow with the organisation.

Live Radio Streaming — Right in the Browser

Listeners can now tune into Te Arawa FM or The Heat FM without leaving the website. The audio player sits in the navigation bar at the top of every page, so you never lose your stream as you browse stories or watch videos. Switching between stations is instant.

The Audio Visualiser

One of the signature features of the site is the animated audio visualiser on the home page hero banner — a row of bars that pulse and move in response to the live audio signal. When the stream is playing, the bars react in real time using the Web Audio API. When no audio is playing, they animate gently on their own, keeping the page feeling alive. This was built entirely from scratch using browser-native technology — no third-party plugins required.

A Living News Feed

Rather than asking the Te Arawa Media team to manually update the website with news articles, we connected the site directly to Aukaha News — the region's leading Māori news publisher. Articles update automatically, meaning the website is always current without any extra work from the client.

Latest Videos — Automatically

The same principle applies to video content. The site pulls in the latest videos from the Aukaha News YouTube channel automatically, displaying them in a polished video section with a featured player on desktop and a pop-up modal on mobile and tablet.

Bilingual — English and Te Reo Māori

Every page, every section, every label on the site is available in both English and Te Reo Māori. Visitors switch between the two languages using a simple toggle in the header and footer. The chosen language is remembered as they move through the site. This was a non-negotiable part of the brief — and one we were proud to execute with care.

A Hero Banner That Turns Heads

The top of the home page features a full-screen video background playing footage from the rohe, two switchable station slides with logos, FM frequencies, and social media links, and the live play button — all layered on top of the visualiser. It makes an immediate impression.

Search Engine Optimisation (SEO)

Every page was built with search engines in mind. The site includes proper metadata, Open Graph tags for social sharing previews, a dynamic sitemap, a robots file, and canonical URLs — giving Te Arawa Media the best possible foundation for being found on Google.

Mobile-First, Accessible, and Fast

The entire website was designed and built mobile-first. The navigation collapses into a drawer on small screens, videos open in a pop-up modal rather than navigating away, and the audio player adapts gracefully to any screen size. We also ensured the site meets accessibility standards — screen reader support, keyboard navigation, and reduced-motion support for users who need it.

Google Analytics Ready

The site is wired up and ready for Google Analytics 4, allowing the team to track visitors, page views, and content performance as soon as they connect their account.

The Result

Te Arawa Media now has a digital home that matches the quality and identity of what they broadcast on the airwaves. Their audience can listen live, read the latest news, watch videos, find out about the team, and connect on social — all in one place, on any device, in English or te reo Māori.

It's a platform built to grow with them.

Frequently Asked Questions

1. What technology did you use to build the website?

The website is built with Next.js and React — a modern, industry-standard tech stack used by major media companies around the world. It's fast, reliable, and easy to maintain and scale. We also used TypeScript for code reliability and Tailwind CSS for the design system.

2. How does the live radio streaming work on the website?

We integrated the live Icecast audio streams for both Te Arawa FM and The Heat FM directly into the website using the browser's native HTML audio capabilities and the Web Audio API. The player sits persistently in the navigation bar so listeners never lose their stream as they browse. The animated visualiser reacts to the live audio signal in real time.

3. How is the content kept up to date without someone manually updating the site?

We connected the website to two external data sources: the Aukaha News WordPress API for articles, and the YouTube Data API for videos. Both refresh automatically — news every five minutes, videos on each page load. This means the website always reflects the latest content without any manual work from the Te Arawa Media team.

4. Why did you choose to make the site bilingual from the ground up?

For a Māori media organisation like Te Arawa Media, te reo Māori isn't a feature — it's core to who they are. We built the bilingual system into the foundation of the site from day one, rather than adding it later as a translation layer. Every piece of text, label, and heading has an English and a Te Reo Māori version, toggled instantly with a single button. It was one of the most meaningful parts of the project for our team.

5. What would it take to add new features or update content on the site in the future?

The site was built with maintainability in mind. Content that changes regularly — like news and videos — updates automatically. Content like team members, contact details, or station frequencies can be updated with straightforward code changes. For larger feature additions — a podcast section, an events calendar, a full CMS — the architecture is ready to accommodate them. We're happy to continue working with Te Arawa Media as their digital needs grow.