Go back

How we Designed a Mindfulness Application in 3 Weeks

In one of our latest blog articles, we explained the steps of our UX design process in our 2021 practical guidebook. In this article, we explore how those broad steps apply in practice with an example of a Minimum Viable Product we delivered in a short amount of time.Last month we designed a mindfulness application in 3 weeks and delivered a pixel-perfect Minimum Viable Product (MVP) while still having fun working on it.This article will break down our process step by step in detail while also showing our achievements.

MVP mindfulness app 1

STEP 1: CREATE A ROADMAP FOR THE PROJECT AND GET EVERYONE ON BOARD

MVP mindfulness app 2

With only 3 weeks to design a mindfulness application, we needed to make a thorough plan.Therefore, the first step of this process is creating a roadmap detailing every step we have to take and deadlines.Then, before officially starting the research step, we make sure the client is clear about the roadmap and that all the calendar invitations for main events were sent.

STEP 2: START UNDERSTANDING BY CONDUCTING USER RESEARCH

MVP mindfulness app 3

Firstly, we looked into existing research done by our client, including user interviews. It was helpful to understand the context, needs, and frustrations of our target audience.Afterward, we analyzed 8 competitors from the mindfulness market. This analysis gives us a clear understanding of the market status quo and the common features offered by competitors.

STEP 3: CREATE PERSONAS AS A RESULT OF THE RESEARCH

MVP mindfulness app 4

After the research step, we can better visualize our target audience.To help us further with this process, we created personas. It was a great way to summarize the learnings from our user research. The personas also help the rest of the team to establish empathy with the target group.

STEP 4: GENERATE A LARGE NUMBER OF IDEAS

MVP mindfulness app 5

Once we identified the target audience, we started generating ideas. We held two 4-hour workshops with our team and the client strictly aimed at generating ideas. We used the brainwriting method where ideas build on top of each other to end up with a large amount of input.

STEP 5: CREATE THE GRAND STORY - CONCEPT OF THE APP

BY DRAWING ON PAPER/WHITEBOARD

MVP mindfulness app 6

Once we gathered a large pool of ideas, it was time to create a concept for our application.Low-cost drawing is a great way to experiment with ideas while not getting too attached to those that don’t work.

STEP 6: SCOPE AND DEFINE MINIMUM VIABLE PRODUCT (MVP)

UPDATE PROJECT ROADMAP WHEN NECESSARY

MVP mindfulness app 7

Our drawings from step 5 illustrate the total experience of the app. They help us to have a complete picture of the app's full potential as well as define the first version of it.Some people call it Minimum Viable Product (MVP). We like to call it Minimum Lovable Experience (MLE).We use the term MLE to emphasize a whole experience (MLE) rather than a set of features (MVP).

STEP 7: PROTOTYPE EACH PAGE DIGITALLY

MVP mindfulness app 8

When the concept was finally done, we started to transform it into digital mid-fidelity prototypes.This step was the most time-consuming part of the design process as we refined the functionality, defined the layouts, and designed each page.

STEP 8: CREATE A DESIGN SYSTEM

MVP Design System

Once we were confident with the prototypes, it was time to design them in perfect pixels. But before, we created a design system.This step is especially vital if you’re working on a complex product. The design system helps to eliminate inconsistency in the design and arrive at a cohesive visual language.

STEP 9: THEN DESIGN EACH WIREFRAME IN PERFECT PIXELS

MVP Design Perfect Pixels

After we created our design system, we could efficiently work on designing each wireframe in perfect pixels.

STEP 10: CONDUCT USABILITY TESTING WITH USERS

MVP usability testing

We then conducted 7 remote usability tests of 40 minutes each. We gave our participants 12 tasks to perform and observed their behavior and overall experience.

STEP 11: ANALYZE RESULTS AND PREPARE A REPORT

MVP analyzing

After conducting the usability tests, we re-watched the testing recordings and analyzed the results. We scored each task by the criteria of usability, content, and desirability.We summarized our findings, compiled the next steps, and offered our honest impression of the results to our client.

STEP 12: IMPROVE DESIGNS BASED ON FEEDBACK AND PREPARE FOR HANDOVER

MVP improve designs

Based on the usability testing feedback, we improved the prototypes. We prepared the assets for the development team and left detailed feedback on the interface.We had a show and tell meeting with the client and handed over the designs.

SOME CLIENTS BOOK ONLY A SPRINT. SOME BOOK MULTIPLE SPRINTS

You cannot rely solely on the results of only one sprint. Iterating this design process multiple times and baking the concept will increase your chances of success.By each iteration, we evolve the concept and resolve the usability issues until we get to the point of being excited to release the product to a market. This is how we can deliver examples of pixel-perfect Minimum Viable Products that align with the expectations of our client and the target audience.

MVP Design Process

Tell us about your design process. we’d love to learn from youWant to learn more about how we work on our projects as well as our services? Check more on our website and blogOur community is open to everyone, feel free to join and learn with us: PRODUCT INNOVATION: High-velocity experimentation & MVP design