Media platform with seamless player experience
We implemented a media platform for the client, where the call continues uninterrupted while browsing the different contents and sub-pages of the website. The goal was to have a media site that plays both podcasts and videos and serves as a showcase for the association’s various media. This objective was achieved in good cooperation with the client.
A modern and flexible media platform built for Kansanlähetys
The aim is to have a media site that plays both podcasts and videos, acting as a showcase for the association’s various media. A media platform that provides a seamless experience for users. A media platform where playback continues uninterrupted while browsing content and sub-pages.
Starting point
The client wanted a modern and user-friendly media site that would meet their diverse needs and provide a seamless user experience. They wanted a media player that would continuously play podcast or video, allowing podcasts, YouTube videos and local audio files (up to 6000) to play in the background as the user navigated through the different sections of the site. Other needs included a search feature, easy-to-use forms and a visually appealing and youthful look that would appeal to users and make consuming media content a pleasant experience.
Result
The client got a modern and user-friendly media site. The site includes a continuous media player that allows users to enjoy podcasts, YouTube videos and thousands of local audio files as they navigate through the different sections of the site.
In addition, a search function, clear forms and a fresh new look were created. The implementation allows for smooth content management and seamless access across all environments.
Flexible and modern Web app networking solution
The end result was implemented as a headless implementation using React-based code. We used WordPress as the content management system, which allowed for easy content maintenance. We also used modern technologies such as Next.js, Typescript, Tailwind and GraphQL to ensure the speed and flexibility of the site. To import content from external sources, such as YouTube and podcast services, we integrated API connectors into the system to ensure seamless functionality.
As a web app solution
To achieve a seamless user experience while keeping the player “floating” when browsing the site, the core of the solution was a Single Page App, where we took advantage of the headless implementation.
Headless implementation in the background
- Headless implementation is a website or application structure where the front-end and the content management system (CMS, e.g. WordPress) operate as separate components.
- The website seen by the user (front-end) retrieves the necessary content from the back-end system through interfaces, but they are not tightly coupled as in traditional websites.
- This allows for greater flexibility, speed and the use of modern technologies to build the front-end.
React-based code
- React is a JavaScript library designed for creating modern and interactive user interfaces.
- With React, the front-end was implemented as a dynamic and powerful interface that can work independently and retrieve content from the back-end system.
These are the services we provided
Designing the look
- We designed and implemented a visual identity for the client that was in line with the target group and objectives of the service. We also designed the KL-media logo.
UX and UI design for the media platform
- We focused on a clear and user-friendly service, where each section is logically structured and easy to navigate.
- The user interface was designed to support the media focus of the service, and the media viewer was seamlessly integrated into the interface.
Technical design and implementation
- We carried out the technical design and implementation in a comprehensive and professional manner, focusing on a fast, flexible and user-friendly solution.
- The site was built to support both smooth content management and excellent user experience, using modern technologies and external service integrations.
Project management
- We also provided project management, which included careful preparation, close cooperation with the client and successful completion of the project on time.
- From the outset, we ensured that the client’s needs, objectives and stakeholders were taken into account to ensure that the end result would best support the business.
Visible results through branded media content, targeted digital marketing and search engine optimisation.
See other projects
The rebranding of the racket sports club
We carried out a comprehensive brand renewal that emphasises quality, timelessness and a diverse range of species.Smash is Finland's largest racquet sports club. It offers high-quality coaching, courses, events and competitions in Helsinki, Espoo and Kotka, promoting...
Kesko campaign game
The campaign game brought joy to over half a million players and left a lasting impression. Thanks to the high score list and social media sharing features, the game achieved viral popularity and retained users for a long time. Qmea implemented two campaigns for Kesko...
Radio production control system
We implemented a custom ERP solution to manage radio programmes and series and to make the everyday life of employees easier.Radio Patmos is a Christian radio station broadcast widely on Finnish radio frequencies and online, which produces a large number of high...