Wisco Radio - Website Redesign
OVERVIEW
role: UX I UI Designer & illustrator
Duration: 2 weeks
CLIENT
Wisco Radio is a radio station based in Mount Horeb, Wisconsin that broadcasts high school athletic events over the Internet to listeners around the world through live streaming, videos, and radio.
CHALLENGE
The company goal is to provide high quality sports broadcast and production for their large listening base in Mount Horeb, Wisconsin and around the globe. The challenge is to redesign the current website in line with the new logo and in a clean and modern look.
SOLUTION
I redesigned the website and responsive mobile by reorganizing the information architecture through user testing, user interviews, and competitive analysis on direct and indirect competitors.
PLATFORM
Desktop
Responsive mobile
TOOLS
Sketch
Invision
Paper & Pen
DELIVERABLES
User Research
Competitive Analysis
Paper Sketches
Wireframes
Usability Testing
Prototype
RESEARCH - CURRENT WISCO WEBSITE
The clients main concern was needing an exciting UI to match its redesigned logo. They also wanted to add new features to the UI including a career page and a twitter feed for its users. My first step in any redesign project is to first understand the clients needs with conjunction to exploring the existing designs limitations.
KEY-FINDINGS
None of the CTA in the main navigation initially worked.
The footer was not consistent on every page.
The website was responsive, however text is long scrolling, and there were multiple ads through the page.
COMPETITIVE ANALYSIS
When redesigning I believe in beautiful UI and best practices. The client provided 4 websites that they loved for UI inspiration. These websites ranged from music stations to video service solutions. I compared and drew inspiration from these websites but redesigned the UI in a way that would work for a sports radio station. Separately, I researched the best high school sports websites to get an idea of how other websites organize their information architect and promote their athletic teams.
4 Indirect for UI inspiration
3 Direct for Best Practices
UI MOOD BOARD
The “Timeline” inspired a a clean, modern, and visually appealing way to replace the current lengthy bullet point design on the about page.
Per the client the “watch live now” CTA needs to be the first and most visually engaging component when the user enters the website. I compared having a visually engaging button or visually engaging background for the homepage.
The current scheduling design is just a calendar. I loved the way the music website displays music in a decade timeline and found this to be a visually inspiring way to display upcoming events.
The Client needed new icons to display its broadcasting, video, and streaming capabilities.
Blog organization for podcast, videos, and articles.
DIRECT COMPETITOR
In order to get an idea of how their competitors websites look I looked at both high school and professional sports team website to see how the content was organized.
Schools typically organize athletics by semester and by sports title.
Main page always has an engaging image of the team and latest news.
Footers have contact information for the school and team.
All websites contain latest news and upcoming events.
DESIGNING WIREFRAMES & ICONS
The Client requested to see a HIFI version of the homepage before proceeding to redesigning the entire UI. I started with paper sketches of the homepage and sketches of the icons.
The client responded option B of the homepage but liked the scheduling layout of option A.
For the ICONS winners are marked in blue.
With the clients approval in direction of the UI, I went back and conducted a timed boxing exercise where I sketched out as many of the remaining frames as possible. I took the best concepts and again provided them to my client for layout.
LOFI Usability Testing & Interviews : 5
To test my redesign I targeted users who have extensive knowledge in sports. I asked users to openly navigate the LOFI prototype design and call out any issues or concerns.
You can explore the LOFI prototype here.
KEY-FINDINGS
All users could tell it was a radio website but it was not clear to half that it was a high school radio broadcasting station.
Base on this feedback from users. The most important features are: Schedule, Listen & Watch, Sports Archive, about us, contact us, and join the team.
All users like the twitter feeds. I asked if they would like if students can post live tweet, which will pull on your page however only half of the users like the idea. If students like to engage than yes but some feel like having to filter tweets will be troublesome. I would also move the twitter feed to the homepage.
Recaps are important to the user and would love to see the blog to be reorganized by sport.