Karen Sum

Updated: September 8, 2020

Overview

Timeline: 2 weeks

Role: Evaluator, Facilitator, Maker, Asset Collector, Stitcher

Team: 4 members

Purpose: Conduct a heuristic evaluation of The Weather Network app and redesign screens

Usability Principles Rating

Severity scale from 0-4
0 - not usability problem
1 - cosmetic problem
2 - minor usability problem
3 - major usability problem
4 - usability catastrophe

Scenario

We evaluated the app based on the task flow of trying to find the weather and pollen forecast over a period of 7 days for someone travelling from Vancouver to Toronto.

Our UI constraints:

  • SF Pro Text
  • Primary brand colours
  • Original icons
Heuristics-Constraints

Home Screen

Heuristic

Aesthetic and Minimalist Design

Dialogues should not contain information which is irrelevant or rarely needed

Finding

News video content is positioned above weather information & forecast

Rating

2.4

Priority

Low

Improvement

Video content was moved further down the page

Rationale

Hourly forecast was placed higher up the page as this is more relevant to the use of the app and more regularly needed.

before-home-screen-5

Before

after-home-screen-5

After

Home Screen

Heuristic

Visibility of System Status

The system should always keep users informed about what is going on

Finding

Border colours that reflect rating scale is not obvious to user

Rating

1

Priority

Very low

Improvement

Borders on rating scale were widened and a dropdown was added

Rationale

Dropdown arrow to let users know the rating system is interactable to view a more detailed report.

before-home-screen-6

Before

after-home-screen-5

After

Home Screen

Heuristic

Flexibility & Efficiency of Use

Allow users to tailor frequent actions

Finding

Difficult to find where to add a forecast location

Rating

3

Priority

High

Improvement

Added in a ‘+’ icon at the top of the homepage

Rationale

To make it clearer to the user where they can add in a location, to tailor their cities and forecasts.

before-home-screen-7

Before

after-home-screen-5

After

Home Screen 2

Heuristic

Recognition Rather than Recall

Minimize the user’s memory load by making objects, actions and options visible.

Finding

Icons unclear for high/low weather

Rating

1.75

Priority

Low

Improvement

Larger arrows to signify high and low of the day and lighter opacity for low of the day temperature

Rationale

The high arrow was too close to the low and at a glance looked like military time instead of two separate values.

before-home-screen-1-3

Before

after-home-screen-1-3

After

Add Location

Heuristic

Flexibility & Efficiency of Use

Allow users to tailor frequent actions

Finding

‘Edit’ and ‘Add Location’ icons are very small and difficult to see

Rating

3

Priority

High

Improvement

Increased the size of ‘Edit’ and ‘Add Location’ bar

Rationale

To make it clearer and easier to use for less experienced users.

before-location-2-1

Before

after-location-2-1

After

Air Quality Report

Heuristic

Recognition Rather than Recall

Minimize the user’s memory load by making objects, actions and options visible

Finding

No visible way to exit the pop-up screen. Tapping the Air Quality report button takes user out of the app.

Rating

2.75

Priority

Moderate

Improvement

Added an “X” to exit the pop-up screen.
Included the Air Quality report in the pop-up.

Rationale

The user can read the report in the same pop-up from the home screen AND easily exit out of it.

before-home-screen-1-2

Before

after-home-screen-1-2

After

UV Report

Heuristic

User Control and Freedom

Users often choose system functions by mistake and will need a clearly marked "emergency exit" to leave the unwanted state

Finding

Exit is not obvious

Rating

4

Priority

Severe

Improvement

Added a “x” button

Rationale

More pleasant user experience to view everything within one place rather than going back and forth between app and browser. Less time consuming and frustrating.

before-home-screen-1-1

Before

after-home-screen-1-1

After

36 Hours Overview

Heuristic

Flexibility & Efficiency of Use

The system should cater to both inexperienced and experienced users

Finding

There is no definition for Evening, Night etc.

Rating

2

Priority

Low

Improvement

Added hourly breakdown for Morn, Aft, Eve, Night

Rationale

User is easily able to identify the time each period of the day begins and ends.

before-36-hour-weather-3-5

Before

after-36-hour-weather-3-5

After

36 Hours Detail

Heuristic

Match Between System and Real World

The system should speak the users' language, with words, phrases and concepts familiar to the user, rather than system-oriented terms.

Finding

The use of confusing abbreviations

Rating

1.75

Priority

Low

Improvement

Changed the term “P.O.P” to chance of rain

Rationale

“Chance of rain” denotes real world language. Information provided should be relevant and direct.

before-36-hour-weather-3-1

Before

after-36-hour-weather-3-1

After

36 Hours Detail

Heuristic

Aesthetic and Minimalist Design

Additional information not relevant to the context

Finding

Difficult to find where to add a forecast location

Rating

1.75

Priority

Low

Improvement

Removed the additional icon that also references snowfall

Rationale

The snow icon cause cognitive overload.

before-36-hour-weather-3-2

Before

after-36-hour-weather-3-1

After

Selected Works

Safe CraveBrainStation <> EY

Savey (in progress)Future of Fintech | CB Insights

MeetFox Web AppContact me to view

MeetFox WebsiteContact me to view

DewProduct Design

Figo BankBrainStation <> RBC

The Weather NetworkHeuristic Evaluation

Sign UpDay 1

CalculatorDay 4

App IconDay 5

SettingsDay 7

404Day 8

Social ShareDay 10

Want to learn more?

I am available for new opportunities or even a casual coffee chat. I would love to hear from you!

Connect with me here