fbpx

UX/UI Design

Product goal: Digital solution for people who want to improve their physical condition

Task:

Apply an iterative, user-focused design process to generate innovative ideas that solve a complex problem.

Problem:

People who want to improve their physical condition and feel better with their body need time and motivation to start a fun, easy, affordable and interesting routine at anytime.

Solution:

Design a digital product that support and allow people to create easy daily routines or workouts to improve their physical condition.

Empathise
Define
Ideate
Prototype
Test

Empathise

Target group:
people who want to exercise more, but who—for various reasons—don’t get around to it

Find out:

Why people want to exercise

What concretely happens when they do manage to exercise

What concretely happens when something prevents them from exercising

Method
User interviews: to find out about my participants’ habits and motivations.

Define

Goal:
Develop a clear understanding of which problem I will try to solve for my potential users.

In this part of the project, I’ll analyze the results from my user interviews and probes to define which problem I want to address.

Task:

Affinity Diagram
Analyze and identify the major themes in my data

Empathy Map
Find out how my participants think, feel, talk and act regarding physical exercise

Point of View
Crystallize and synthesize the user needs

How Might We
Define the design challenge(s) I’m going to work on for the remainder of the project

Ideate

Goal:
Generate ideas and whittle them down to one amazing idea which can help my participants exercise more.

In this part of the project, I’ll ideate possible solutions to my “how might we” questions.

Task:

Worst Possible Idea
5 minutes and write down as many worst possible ideas/answers to my HMW questions

Challenge Assumptions
To push my self to think outside the box and consider problems in a new way

Prototype & Test

Goal:
Develop an early app prototype which I can test on users.

To develop the idea, I’ll use two different prototyping methods in this exercise to turn the ​idea into concrete solution and address different aspects of the design.

Task:

Storyboard
to flesh out how the users are going to experience the product at different touchpoints

Paper Prototype
to create the user interface design for the app

Prototype

Storyboard:

to flesh out how the users are going to experience the product at different touchpoints.

I used Storytelling to thinking about the user and the product, keeping deep interest in how someone use the product and their user journey. From what makes a user decide to download the app to what happens when they use it.

Elements of the storyline:

Main characters based on:

  1. Who users are.
  2. What motivates them to use the product.
  3. What their context of use is.

Start to map out the user journey:

  1. How will users learn about the product?
  2. How will they acquire it?
  3. What will their first experience of the product be like?
  4. What will their eventual user pattern look like?
  5. What will they gain from using the product?

Different points in the user journey:

explain what the user is doing but also why they are doing it and how they feel about it.

Prototypes:

to bring the idea into life.
I used a paper prototype to show the interaction design of the app.

Tasks:

  • Choose a common user journey for the app. Use the storyboard I’ve created to help me with this. What do the users need on the start screen? What does it look like? What will their next step be?
  • Sketch each screen the users need to perform each interaction: choose a workout type, set a workout length and press start

 

Test

Test the Storyboard:

I presented the storyboard to the participants from my empathy-building exercise. I invited them one by one and explained the storyboard idea in a neutral way and asked them what they think of it.

Questions used:

  • “Is there anything you don’t understand?”
  • “Is there anything you don’t agree with?”
  • “Is there anything that wouldn’t work for you?”
  • “Is there anything you find particularly positive or negative?”

Test Paper Prototype:

explain what the user is doing but also why they are doing it and how they feel about it.

First test:

For this test, I invited the same participants and created small tasks to perform with the paper prototype.

Moderate usability test (2 in person/other 2  remote testing via Zoom).

They created a medium-level workout session and set the time, I also showed them the sketch of the app’s home screen and ask them to press where they think they need to interact.

Gathering and Analyzing the Feedback: to get a better overview of the information and come up with ways to improve the design.

Wireframes:

Wireframes

Feedback

Time to iterate!

Thank you for having come this far. The project for the course ends in this first stage. The next stage will be an extension and follow-up to the project.

Design Thinking i’ts a non-linear process, which allows me to continue working on this project. Now, with the first usability tests and the feedback I have plenty insights and reasons to redefine the problem and start iterating.

Style Guide

Visual Design

High-Fidelity Desgin

With the visual style defined for the UI design and wireframes ready, it's time to put things together.

Test

Mobile high-fidelity protoype

For this test, I invited new participants  and created small tasks to perform with the high-fidelity prototype.

Methodologies: Moderated (2 in person/other 2  remote testing via Zoom).

Participants: 4 participants, age between the target group 30 – 60 who want to improve their physical condition.

Test objectives:

1. To know user’s first impression and observe how users navigate through the TEAMFIT app.

2. To figure out what specific difficulties users encounter when they try to complete the core task when using the app.

3. Identify any barriers or confusions that prevent users from completing their goals efficiently (create a medium-level workout session and set the time).

Task:

1. Prototype exploration

2. Create a medium-level workout session and set the time.

Result:

The test reflected how easy it was for the user to perform a given task (mission) with the prototype.

The users completed the task in less than 3 minutes.

Conclusion

Since this is a conceptual project, I couldn’t measure the impact of this app may bring but during the research and the usability testing, I just got the feedback from participants. Users shared some positive feedback about how the app could help them to improve their physical condition.

What I have learned

I have gained an understanding of the market of apps to perform online workouts. 

Organization and prioritization of strategies. After having tons of ideas from the brainstorming session, I had to step back and be realistic with the design ideas.

I have learned how important is the Storyboard on the process to understand what the user’s journey could be like. 

Last but not least, NO DATA, NO TRUTH. Yes, as clear as Nielsen Norman Group says; if we want to understand reality, we really must conduct research.

What would I have done differently?

1. I would have liked to work with a team to have different points of view.

2. I would have liked to interview more people, to have a more assorted data.

3. I wish I had more time to continue developing the project.

4. I would have liked to dig the Information Architecture to classify information in a better and clear way.

Moving forward

I would conduct another round of usability studies to validate whether the pain points users experiences have been effectively addressed.

I would go back to the feature Storyboard and explore other aspects of the social feature that could potentially be implemented in the future to provide useful insights to users.