Skip to content

Weatherzone Site Redesign

A UX/UI PROJECT

Client:

Weatherzone

Customer Problem:

An aging UI and navigation hindered customer experience and usability

Business Challenge:

Redesign a popular weather site in a hyper-competitive industry, while balancing the detailed interests of weather enthusiasts with casual ‘lifestyle’ users

My Role:

Use a templated approach to improve the UX and visual design of a 50+ page website

Client: Weatherzone

Customer Problem: An aging UI and navigation hindered customer experience and usability

Business Challenge: Redesign a popular weather site in a hyper-competitive industry, while balancing the detailed interests of weather enthusiasts with casual ‘lifestyle’ users

My Role: Use a templated approach to improve the UX and visual design of a 50+ page website

Discovery

As I was new to the weather industry, I conducted a disocvery to understand the industry, the business, and users to produce a report to discuss with the business as a means of validating and adding to the insight.

Business, Product, and industry analysis

– Site Heuristics test
– In-person discussions with stakeholders (Marketing, meteorologists, management)
– Competitor site review: insightful as to where the business sits in relation to the industry, and also idea generating for what the client can focus on, emulate and/or do better
– Brand review: I reviewed the existing brand document to understand how we were portraying ourselves, and how to translate brand keywords into product features
– Product review: as Weatherzone has numerous products in various user-scenarios, I reviewed and produced a ‘Product Map’ as point of discussion about how our users use which products, on which devices at different times. This holistic view had not been done before and helped identify focus points of the home page redesign, as well as generated ideas on our other products.

User research

– Review of previous user feedback
– Analytics and heatmaps
– Online-Survey – utilising access to our 3million unique users/month, reviewing 6000+ individual responses in conjunction with stats into Usability, Design, Layout, Content and Dept. specific data
– Refined existing user profiles
– Identified/validated new ideas – one example was the idea within the company that users would love a customisable home page, which would require a lot of development. From my survey, I could validate the interest in this was in fact minimal and users were more interested in other factors such as quality of graphics and content.

Ideation

Team ideation

Using the competitor review from my initial report, I created an “Idea Wall’, sticking up screen shots of UX elements that were interesting, and high-lighting what was worth discussing. This acted a great point of discussion for other stake-holders, which also helped generate sharing of ideas, and became a source of reference over the whole course of the project.

In conjunction with the ideation, I ran a session with the Head of Product to identify and regroup UX elements and review the overall site IA.

User testing wireframes

Scripting

I scripted the tests, combining both qualitative and quantitative methods. I set both definitive tasks and allow for contextual inquiry based on the users behaviours during a ‘free-use’ session. I set the same tasks across all ten users, as well as user-specific tasks.

Testing rounds

For the first round of testing, I recruited users from each of the main ROI profiles, and tested these users focusing on three main areas:
– First impressions
– User-specific scenarios
– Site navigation
– Competitor comparison

After iterating on the testing results, I then worked with a third-party tester for unbiased testing, for which I observed the testing via video to take my own notes.

Findings report

From this testing, I produced a report that included:
– Usability problems
– Persona-specific differences
– Summary of findings with recommendations

Wireframing

Based on the initial research, I started developing wireframes for the new page, exploring different approaches to the redesign. I reviewed these regularly with the Head of Product to evolve the conecpts quickly. Once finalised, we developed these into working prototypes for testing.

Visual design and testing

Visual design

Based on the testing insights and competitor/UI research, I designed the following:
– Home Page and key pages redesign
– Reusable site-wide element designs

3rd Party user testing

I then worked with a third-party tester for unbiased testing, for which I observed the testing via video to take my own notes.

Findings report

From this testing, I produced a report that included:
– Usability problems
– Persona-specific differences
– Summary of findings with recommendations

Development support

To support the development team, I provided:
– Guides for integrating the reusable content across the 50+ pages
– Style and Usability guides
– UX support during development

Outcomes

The site launched to a good reception, from weather enthusiasts and lifestyle users alike, and excited a new generation of users with enhanced visualisation, video, and content.

“Awesome work … a better user experience … ultimately this has secured a new long term deal with significant revenue attached.”
Mat Pearce, Weatherzone Manager