Matthias
UX researcher

modo.

Heuristic Evaluation and Redesign

Image alt tag

modo- a research-based redesign of an experience

This project was part of my UX design Bootcamp at BrainStation.

Length: 1 week

Role: UX designer & researcher, UI designer

Tools used: Figma, Sketch, InVision, Adobe, pen and paper, brain and creativity

Platform: Agnostic (iOS was used)

Team: Arden, Emery, and me

Research methods: Heuristic Evaluation

Challenge to solve: Make a heuristic evaluation and redesign to improve the most severe findings.

Constraints: stay on brand identity, be minimalist

Vision: create an improved car booking experience

1) Heuristic Evaluation-
or how to review your existing design
We chose to apply six of the ten dimensions.

We chose to apply six of the ten dimensions.

1) heuristic evaluation

To prepare for our heuristic evaluation of the modo app on iOS, we gathered the information of the ten different evaluation dimensions and the severity ratings scale. This information was gathered from the Nielsen and Norman website.

2) Heuristic Evaluation- applied
Driven by people, not profits.
modo
Brand identity: modo

Brand identity: modo

Brand Identity

After evaluating the booking process on the app, we made a brand catalog to be able to redesign the app.

To be able to redesign, we substracted font, iconography, colours, buttons, and fields, and bars. The principle used here was that of Atomic Design by Brad Frost.

Atomic Design is a methodology to create a design system or rearrange one, as we did in this case. It is split into three main components: Fundamentals (atoms), Components (molecules), and Patterns (organisms).

Example of extraction of elements

Example of extraction of elements

Recreating UI

Once we defined the brand identity, we extracted the different elements of the UI components and translated them into our new design.

  • We followed a light design as it was originally thought.

  • The redesign was done in iOS but the app is agnostic

  • The new design will improve user experience overall and make the booking process faster

3) Redesigned Booking flow
4) What I learned from this experience

An amazing tool to evaluate design

My main learning outcomes are the understanding of the heuristic dimensions and how to apply them not only on existing design but also when designing.

  • Best is to have the 10 dimensions applied when designing UI

  • If confronted with usability issues: evaluate your design to improve

  • Heuristics are a great tool to keep the user in mind all way long.

It was also amazing to work in a team to evaluate an app and how each designer looks different on function and design but through the tool of heuristics is able to quantify the issues with the design.