FLIP - Design Sprint

UX/UI

Due to the lockdown and consecutive threaten of new variants our habits have evolve to a more indoor living. This is why searching for better habits and healthier routines has become a mayor priority for most of us. We’ve all planned - or at least try unsuccessfully- to became a better version of ourselves.

But, how many of us have gone further than 2 days routine? who is still maintaining at least three of all the things we scheduled once?

Taking this into account, my colleges and I decided to create an app to motivate people to keep doing those things they planned for more than 21 days.

Collecting data

Firstly, we decided to ask ourselves some sprint questions. These help us understand what the user needed, what could actually motivate the user to maintain the habit.

We used Miro to post all the questions as we were reading about habits and users opinions online. Here you can see some of the questions we found:

Understanding users needs

An Sprint Design Process was used to find the better answer. All the process was made in Spanish. I will post examples but English translation would be placed below.

  • A profile section where private info would be placed. This section could be related to motivational suggestions and data for the user, plus its own personal information.

  • The main section where all the challenges were shown as a dashboard. All the process through which the user would go until the peak of the objective was reached: where to start, how to become a pro in this challenge. This part of the app could be public and could be shared among friends.

  • Another although less important section could have news or blogs about the challenges to dig deeper into the habit. Experts on the field could lead and guide the progress of the user. This option could be considered to be only for members.

After collecting all the questions we realized that we had a lot of different topics going on together, so we grouped them all in sections.

After having the overall sections we applied the HMW (How Might We?) technique. This way we proposed several paths we might develop to make the app easier to the user. After this process we got some functionalities that provided good solutions.

Moreover, we contacted an expert who gave us a better approach to the subject. Firstly, we didn’t show him what we had not to condition his answers. The interview with him reached the following conclusions:

  • The app had to be challenging and fun. Gamification was needed.

  • As a consequence of the interaction with the app, the users would be given several rewards. Some examples could be: motivational messages, friends likes, ranking of value (several levels to be achieved, discounts for the paid sections of the app…) and so on.

  • We kept this sentence in mind from the expert “people need to understand the purpose of each challenge”.

  • Not all habits had to be physical, they could be mental too. Thinking before doing. So, an explanation of benefits and a good plan had to be given to users.

Mixing ideas from the expert and from HMW gave us these profiles:

Sketching

Once we had prepared the beginners set up, it was the moment to elaborate a visual idea of the app. Firstly, we did a benchmark to see how other apps where performing in the field and how their UI was made. Here we can see some competitors and a quick review of what we liked and didn’t like about them.

This way we started visualizing what the general UI of the app could be. This was the moment to start creating some sketches. We initiated the design process by doing the cool game called CRAZY8. 8 ideas for the app in 8 minutes, handmade.

Some ideas were clearer after this step, now it came the part of creating the wireframe. We used Whimsical app which gives you an easier and already made tool-kit to elaborate quick LO-FI prototypes. These are the main ideas. Favourite functionalities and components were spotted with this pink circle and stars were given to the best idea, the one that had to be mandatory to develop.

Before starting to think about the HI-FI prototype we elaborated an Storyboard. We wanted to know if the wireframe had right usability in real life events. We imagined stories and environments where our app would be used. Contextualizing helped us to create a good prototype and to present the product to users.

Prototyping

Thanks to this process, we could develop the prototype of FLIP: the app that helps you succeed in your plans, motivating to erase toxic habits and encouraging to maintain good routines over time.

Some of the main functionalities FLIP includes are:

  • Being able to enumerate the habits the user wants to change.

  • A section for each habit with its ups and downs, something similar to a dashboard. Every habit dashboard can be shared to friends.

  • A section where the user can see people facing the same challenge. Parameters that the user can share in this section would be: times you are beating the toxic habit per day/week, dashboard over time and, of course, comments.

Here are some examples of the UI:

Test with users

Users are the main ingredient for this recipe so, after all the work we had done, we needed their feedback. We conducted then a usability test.

We used Maze app where several user journeys needed to be completed. Some tasks were asked to be accomplished by users.

Some other items were questions about NPS and recommendations to friends or their opinion. Some other flows where asked to be completed as well.

Here you can see two examples. First of all, a heatmap showing where users clicked as they interacted with the screen. Secondly, a table with the paths the users followed, misclicks or if they succeeded in completing their tasks.

If you want to see the original study, you can check on my Medium account:

Posted study on Medium.

Previous
Previous

Wanda - Bipi's Design System

Next
Next

SUSCRITO