Project Overview
SoCast Digital is providing a premier, integrated content management (Website and Mobile App solutions) and digital advertising platform for broadcasters. SoCast’s integrated suite of products help Radio brands to connect with listeners digitally and deliver value to advertising partners. Identified through client feedback, an upgrade to the SoCast Weather Widget was one of the highly requested enhancements for client websites. So the widget's revamp became my project in Q2-Q3 2022, embarking on a journey to transform the widget into a tool that not only delivers accurate weather forecasts but also serves as a new revenue stream for our clients.
Problem Statement:
The Weather Widget's shortcomings were multifaceted:
- Inaccuracy in local weather data.
- A void in sponsorship and advertising opportunities.
- Low client awareness of the widget's existence.
- A lack of customizable data options.
- Outdated design aesthetics.
Our goal was clear: to revamp the widget in a way that not only catered to the diverse needs of our clients but also opened up avenues for advertising and sponsorship, thereby driving website traffic and engagement.
Design Process
Research Process
Our approach was grounded in comprehensive research, beginning with a competitor analysis that shed light on the landscape of digital weather solutions. Insights from platforms like the National Weather Service and AccuWeather informed our strategy, revealing the importance of accuracy, customization, and user engagement in weather forecasting.
Parallelly, interviews and surveys with our clients illuminated their core needs and desires. The feedback was unanimous: the need for detailed, customizable weather forecasts was paramount. This led us to prioritize severe weather alerts and customizable forecast details in our redesign.
Solution and Wireframes
Based on the research and client need for more customizable layouts and varied weather data, we decided to divided the widget design into 4 separate widgets/parts that could be added, edited or removed on the page by clients based on their needs. The 4 customizable components included: Current Condition, Long-term (Daily) Forecast, Short-term (Hourly) Forecast, & Weather Alerts. Each component was designed to be not just responsive but also customizable, allowing clients to tailor the widget to their unique audience needs.
UI Designs
Once the design solutions and wireframes were finalized, I moved on to design the final high-fidelity screens in Sketch. The designs (for both Front-End and Back-End) had to follow the existing SoCast Design systems (colour, typography, spacing,...) to maintain design consistency. New weather-related icons and visuals that matched the existing design system were also added. I also followed Material Design and iOS Style Guide for high-fidelity designs and for various screen sizes.
