Build Design Systems With Penpot Components
Penpot's new component system for building scalable design systems, emphasizing designer-developer collaboration.

uxdesign.cc – User Experience Design — Medium | Vivian Ngai
In this case study I share and present the whole process I went through to create a rapid low-fidelity prototype, and show what I was able to achieve in a few short (or, long) days in my first week of UX school!
The objective of the project was to design a rapid prototype for a mobile app for one of our classmates’ needs.
I started the project conducting an open-ended, semi-structured interview — that is, I had a script for broad questions on lifestyle, interests, hobbies, goals, and frustrations to better understand her and what might help her make an aspect of her life better. As the interview went on, I picked up on some things she brought up a few times and probed further into them.
From the interview, I colour-coded and created an affinity diagram to look for trends and relationships between themes she mentioned most.
A few key values and themes that stood out:
Next, I developed a “user persona” which is based on my classmate from my interview with her:
User persona. (*identifying information modified for privacy)
I also then identified the goal and problem to be the basis of my app.
One of the big goals she identified is to meditate more so she can be less reactive to things and improve her mental health and well-being.
She already has a meditation practice, however, it’s not as regular or frequent as she’d like.
She identified the hardest part is starting. Despite trying tried different methods of starting and maintaining a habit, none of them seemed to work because there was no accountability or incentive.
With that in mind…it was clear she needed an app to help her, and others like her — that is busy people who need some accountability, incentive, to establish and maintain a regular meditation practice.
Once I had a focused goal and problem identified, I looked at a few of the top meditation apps out there to compare features, and see if there are gaps to fill that can solve my peer’s problem.
Two of the most common features amongst them:
These features of existing apps didn’t strike me as one that encourage one to start meditating, and to keep doing it. That is, meditating on one’s own to prerecorded meditations don’t provide much accountability or incentive.
Starting with my peer’s problem of feeling no accountability or incentive to start/maintain meditation, her overall valuing of a social connection/support, and gap in the current meditation app market for one that had features that are more conducive to achieving a regular meditation practice, I came up with the idea to have a live group meditation app.
The Peace Collective app is designed for those that want a regular meditation practice, but haven’t able to. This app presents various scheduled live group meditation programs you sign up for. What’s different about this app from other meditation apps is:
1) users commit to a consistent schedule > consistency creates habit;
2) social and live > meditating with others, and especially in real time creates a sense of belonging, support, and of course, accountability
I quickly created a storyboard of my user’s situation:
Next, I got to designing the user flow of the app:
User flow for a new user; signing and committing to a meditation group
User flow for an existing user; tuning into live meditation session
The features I included that would encourage commitment and accountability were:
Features:
The user flow and features were integrated into some rough (very rough) rounds of user interface (UI) sketches.
Once the user interface sketches were refined a bit more, they were turned into a low-fidelity clickable prototype on POP.
Here’s the clickable lo-fi prototype. (Keep in mind that it’s still a very early version so not a lot is clickable, but demonstrates the user flow and experience. Click on the screen to see where to click to the next screen)
Selected screens in hi-fi
I conducted usability testing on my peers and friends (including the one that this was designed for). I wanted to test the flow and interface to see if it made sense, was missing anything, had too much stuff, and if it was easy to accomplish the big goals of committing and meditating.
The two main scenarios of this app, and what was tested were:
scenario 1
You’ve just downloaded the Peace Collective app. Find and commit yourself to a meditation program and add it to Google calendar.
scenario 2
You’ve just received a push notification that your scheduled mediation session is starting. Check in with your fellow meditators before the session starts, and go through to complete your session.
Overall, users found the interface quite clear and simple to accomplish the goals. For the most part it was clear what pages were. I noticed that it took some users a bit longer to understand what the Profile & Set-up page was, however, this may have been them not reading/noticing the screen title at the top (or my bad handwriting in the prototype!).
The user that I designed it for really liked the countdown so she can wrap up what she may be doing (which I hadn’t thought of — I was just thinking it would create some excitement or urgency). She also liked the feature where you can just see the number of other meditators to have a sense of belonging (without sacrificing privacy). She was a put confused when the meditation starts if its streaming her camera or the facilitator (but again, this was a limitation with the prototype not labeled).
Another suggestion was to be able to add more exit points, however, I wanted to keep it focused and linear so users would commit.
Overall, I’ve learned a lot about how so many various components came together. Starting from a very open direction (design an app), to narrowing in to creating an app prototype that solves a peer’s problem (meditating more). Despite how it’s ideally presented — a liner process — I’ve seen how it’s more like a zig-zag between phases. Research informed planning, but then required more research, and lots of different versions of the user flow and screen sketches came before the prototype…which of course was then tested by peers and revised based on feedback. Based on the tight turnaround time though, and it being my first time going through the UX design process — I’ve learned a lot by doing and was excited to see it all come together!
Rapid Prototyping of a Meditation App was originally published in uxdesign.cc on Medium, where people are continuing the conversation by highlighting and responding to this story.
AI-driven updates, curated by humans and hand-edited for the Prototypr community