Designing a new approach to running

Nurvv - Designing a new approach to running

Nurvv - Designing a new approach to running

Nurvv - Designing a new approach to running

Nurvv - Designing a new approach to running

Running app screens

Nurvv had created an ambitious wearable technology giving pro and semi-pro runners guidance on technique and limiting risk of injury.

The challenge

The Nurvv Run app gave runners unrivalled insight and actionable information to help them run more effectively, however, the presentation was complicated and confusing.

Myself and a lead designer were tasked with distilling the complicated information and turning it in to a useful and easy to use experience.

All of this had to be done in two months without losing any of the rich data behind it all, while also standardising our approach to allow for scalability.

The process

Design principles

To define what success would look like and help steer decisions further down the line, I put together a set of principles.

Clean design graphic-1

Keep it simple

Eliminate any cluttered design and
over-complication.

Eliminate any cluttered design
and over-complication.

Eliminate any cluttered design and over-complication.

Optimised journeys graphic

Optimise journeys

Reduce the steps required to get the same information.

Reduce the steps required to
get the same information.

Unboxing graphic

Make it useful

Introduce tutorial and unboxing journeys

Good design emphasises the usefulness of a product
- introducing "unboxing" (tutorial and onboarding journeys).

Surf and immerse graphic

Surf & immerse

Engage with the pros and don't
overwhelm the semi-pros.

Engage with the pros and don't overwhelm the semi-pros.

Solution discovery

Goal setting and analytics sections of the app were the key problem areas. I looked at what had been created previously and mapped out task flows to analyse where problems were occurring and how they could be fixed.

In this example, the original flow for setting a goal run (left) had 18 steps. This could be easily slimmed down to 9 steps and achieve the same result. 

Original performance goal flow
New performance goal flow

Wireframing to design

Using the optimised journeys and task flows, I presented the Nurvv team with a series of wireframes which were near pixel perfect. This allowed for easy implementation of colour and interaction when signed off.

Wireframes
Designs

Useful simplicity

Running analytics

Simplicity was a guidling principle and something that had been lacking in the app previously. I took the confusing elements of the analytics journey and translated them in to an elegant experience that could be navigated easily.

Tutorial

The wearable gear was just as important as the app (if not more important), however, there had previously been a disconnect between the two as there was no direction as to what you needed to do to get started. I created a clean and clear tutorial to help guide and inform runners.

Tutorial-designs-transparent

Designing for the future

Atomic approach

Every solution and element I produced needed to be flexible and scalable for the future plans the Nurvv team had. I opted for an 'Atomic approach' where I created small independent - atomic - parts, that could be combined into larger molecular structures quickly and easily.

Nurvv Atomic design

Updated palette

Another aspect of design was the use of colour. The original colour palette needed a refresh as it didn't at its best on the app, mostly from an accessibility aspect.

Colour palette

Results

In two months we had re-designed and simplified the entire app, without losing any of the rich data that set it apart from the competition. The key achievements were:

  • Complicated and confusing aspects to the app were now a joy to use
  • A standardised design now meant that there was no room for inconsistency going forward
  • The new approach helped to secure a new round of investment