Say hello to Rayo!
Rayo, an aggregator app, that consolidates Bauer Media's Radio stations, including Kiss FM, Magic, Karrang, and Greatest Hits. The goal was to provide users with an effortless way to access the entire family of brands. My team and I were tasked with transforming the initial framework provided by an agency into a fully accessible and user-friendly app and website.
Problem Statement
​
​
While the app's foundation was in place, some user journeys were incomplete, and accessibility had been overlooked. The app required the implementation of new features and adjustments to some of the existing ones. On the web side, there were additional challenges, with the first stage involving the reskinning of an existing website to match Rayo's branding temporarily, whilst a bigger vision was being ideated.
My Role
Initially focusing on the app, I contributed to projects like implementing a user-friendly onboarding journey where users could favourite their local stations, providing the marketing team with easy-to-use templates to make high-quality imagery for the app that worked amongst the interface at all screen sizes and introducing push notifications. Transitioning to the web, I collaborated on the reskin and website redesign, focusing on user journeys, creating design system components, competitor analysis, and user testing through prototypes. I also played a big part in creating the Rayo design system and introducing Variables into the system when Figma announced the release.
Notification screens
Organising and thematising key insights from user interviews and testing helped the application of findings to the design process. Encouraging each team member who attended the sessions to formulate their individual thoughts and takeaways, and then discussing these findings during breakdown sessions was an extremely effective method for analysing the results.
After identifying the key themes from the user base, we collaborated in a workshop to populate the initial design, which we had tested, with post-it notes to pinpoint the problem areas. This was a good time in the design process to present these findings to the broader team such as product and development and engage in discussions about the potential technical implications of implementing these changes.
Challenges and Solutions
App Challenges:
​
Overcoming challenges included translating third-party concepts into reality, working within the technical limitations whilst creating smooth user journeys, future-proofing features, and rectifying accessibility oversights.
My approach involved iterative tweaks, clear sprint-based planning, and continuous consideration of future features and accessibility.
Web Challenges:
​
Reviving an outdated website posed challenges in designing within limitations and seamlessly transitioning between reskin and new product designs. We also had to make the app and web seem like an ecosystem whilst having different requirements and limitations between the two
My approach was to take a holistic view, making sure the new product had clarity with the app whilst being able to stand on its own as a web product. I did this by drawing inspiration from other audio brands, testing concepts with current and potential users, and adapting based on learnings.
A particular challenge in the web ideation was to create for the homepage a new component that was absent in the app. This component would allow users to directly access information promoted on the radio, such as competitions, without occupying excessive screen space or diverting attention from the audio. The challenge was to design a component that seamlessly integrated with the existing app aesthetics while still standing out. To address this, I developed a card carousel featuring a visually appealing design and containing cards for all competitions. User testing yielded very positive feedback, with users citing this feature as a primary motivation for logging in.
Collaboration
Successful product development relied on extensive collaboration across teams and within the design team. Close partnerships with product teams, stakeholders, and marketing ensured alignment with business needs and messaging. Working closely with developers was crucial to realising the product vision.
Results and Impact
The app's beta version received a positive reception, and an upcoming release promises additional features and updates. The web project is currently implementing the reskin.
The future version has undergone extensive user testing with highly favourable results, setting the stage for a successful future version.
V1 Web, reskinning planet radio
V2 Web, full redesign
Web testing prototype
Reflection
Working on Rayo has been an educational experience. Tackling the challenge of transforming Bauer Media's Radio stations into a cohesive app showed the importance of thorough analysis. From addressing incomplete user journeys to enhancing accessibility, my role in designing a user-friendly onboarding journey and contributing to high-quality imagery creation for the app provided valuable insights and learnings that I had not faced before. Working on Rayo was like a rollercoaster of challenges and victories and has made a huge impact on the company and bringing its digital presence forward.