My Desired Life

Mobile app design
April 2022 - February 2023

Figma, pen and paper
Objective
Help users who are living sober from substance use address sobriety-threatening challenges throughout the day and set, achieve, reflect, and act on personal goals to manage their sobriety.
Solution
My Desired Life is a self-management development tool that helps users maintain their sobriety through a goal-focused, action-based plan. Each user has access to a recovery coach who helps them tailor their plan with personalized strategies and tools oriented to their personal goal.

Questions that have guided the app's development include:
In a sobriety-threatening challenge, what do you do?
What tools are you using to stay sober?
What do you want your sobriety to look like?

Current mockups of top of home page, top of profile page, and top of coach page
My role
I work with the project lead and am currently the sole UX designer for this project. I have created paper and digital wireframes, created low and high fidelity prototypes, conducted usability studies, and iterated on designs. Additionally, I have participated in conversations with potential partners for the app's continued development and funding.
When joining the project, the project lead had a distinct vision of the end user and had developed a self-management plan that they had utilized throughout their professional career as a coach.

They asked me to join the project to help interpret their vision and material into a mobile app platform. We explored many direct and indirect competitors' services and sharpened the differentiator of their plan for users. Some of the competitors are featured below from an initial analysis, and others have since been reviewed.

Once the project lead and I narrowed down two primary problem statements for our users, I began the ideation phase with Crazy Eights.
Research
Research summary
Competitive audit
Crazy Eights
Screenshot of page from Calm appScreenshot of page from MindTools appScreenshot from page of MindShift appScreenshot of page from MyPlate appScreenshot of page from Sober Grid appScreenshot of page from Sober Buddy appScreenshot of page from StartSimple appScreenshot of page from What's Up? app
Crazy Eight sketches for Problem Statement #1

Problem statement #1: Address sobriety threatening challenges during the day

Crazy Eight sketches for Problem Statement #2

Problem statement #2: Set, achieve, reflect, and act on personal goals while maintaining sobriety

Crazy Eight sketches for the coaching feature

I also did a Crazy Eights exercise to start ideating the coaching feature.

As I continued talks with the project lead, they expressed their preferred layouts for each feature which significantly guided the designs for the wireframes and mockups.

Starting the design
Paper wireframes
Digital wireframes
Low-fidelity prototype
Usability study
Once creating a low-fidelity prototype, we invited our first group of users to a usability study. Below are examples of wireframes from the primary features and feedback from our first usability study.

During this phase of the project, we experienced scope creep and opted to build out multiple features in the design prior to development and testing. We also experienced the natural setbacks that came from that decision.

The following paper wireframes were those whose final versions were preferred and utilized in the digital wireframes and mockups.

Paper wireframe of home pagePaper wireframe of home pagePaper wireframe of home pagePaper wireframe of profile pagePaper wireframe of profile pagePaper wireframe of check-in Paper wireframe of check-in
Digital wireframes of home page, check-in questions, and entry in Podcasts section
Low-fidelity prototype
The low-fidelity prototype connected the primary user flows of completing a daily check-in, viewing a "Remind Me" cue card, and adding a new photo entry into the "Quotes" section.
Low-fidelity prototype
Screenshot of prototype mode in low fidelity design in Figma
Usability study participant quotes
"Is the app keeping a log where I can go back and see my log from my check-ins everyday?...I would use this more knowing that I'm making this representation of what my life is going through...having the strategies there, that toolbox...and right now I just have it in my generic notes app...having it in conjunction with your recovery app is better...

...That's a powerful thing to be able to go back and say, 'oh look, I've been here before, and this is what I did to get through this..."
- Participant
"All I know is my own story and how much easier it is for me to be self-accountable vs. getting that accountability from other people..."
- Participant
"It comes down to desire, how much I want that goal, and...you make time for the things you want to do...you find a way, even if you have a busy schedule..."
- Participant
"[The app's] expanding the interactivity that I have with my sobriety. It's not just staying sober; it's doing things to help me stay sober..."
- Participant
Usability study insights
During the study, users shared that the check-in feature was relatively easy to complete and found it useful. Interestingly, users who didn't generally enjoy setting goals found use with the app. Overall, the app's design during the study elicited positive reactions from the users, and they were excited to see the app's future development.

Users suggested ideas for more assistance in finding sections below the fold of the home screen, additional access points for features that felt more intuitive, and shared comments about revising the UX writing for consistency, clarity, and appropriateness in tone. Users also felt that the evening log feature needed to be more easily accessible and edited for a more intuitive user flow.

Refining the design
Color journey
Mockup review (A/B)
Mockups
High-fidelity prototype
Based on the insights from the usability study and feedback from the project lead, I started to create mockups.

We spent a good portion of time to determine our current color scheme prior to building out the rest of the user flows. Below are samples from the decision-making process.
Color journey
Originally, the project lead was clear on preferred colors (and a couple of banned colors to avoid). We centered around the first row with the mockups, highlighting a strong contrast between blues and oranges. Noticing the energetic level of the contrast, we created a second set that focused more on soft violets and blues to create a calming effect. We ultimately decided to present both sets to the user group for feedback.

Meanwhile, the project lead shared images that featured more jewel tones that we considered but ultimately moved on from (seen in the second row).
Row of colors representing first scheme utilized in mockupsRow of colors representing second scheme utilized in mockups
Set A of mockups presented to users for feedbackSet B of mockups presented to users for feedback
User feedback:  Sets A & B
We presented Set A and Set B (seen above) to the user group, who gave us their feedback about their preferences and what emotions were elicited by each set of mockups.

Most participants had negative reactions to the color in Set A, and the majority also had criticism for Set B. However, all participants preferred Set B's color scheme due to the calmer tone. Several suggested pairing the layout of Set A with a calmer color scheme similar to Set B and commented on areas that lacked cohesion between the pages.
Columns of colors representing third scheme utilized in mockups
In later discussion, the project lead shared that a sunset scheme appealed to them in terms of what feelings they wanted to evoke from their end users, so I took a step back to create a couple of schemes based off of images.

To the left, I utilized an artwork that featured muted tones to create a scheme, but it still wasn't focused enough for a mobile app design. I then started reviewing photos I had taken in residential areas to use as reference. Those schemes are shown below, along with the final color scheme we moved forward with in the design.
Final selection of color schemes based on photographs of sunsetsFinal color scheme selected to use in current mockups
Current mockups of top of home page, top of profile page, and top of coach page
High-fidelity prototype
The high-fidelity prototype includes connections to each draft feature along the footer and in each of the sections featured on the home page.
High-fidelity prototype
Screenshot of prototype mode in high fidelity design in Figma
Moving forward, I will continue to populate each feature with content generated by the project lead and will review UI elements and spacing with industry standards. I also need to add more interactivity in the prototype and document areas of interactive design for the future development team.

We also continue to get feedback from our conversations with potential partners in development, and I have listed their guiding questions below.

We are having more conversations about project scope and documentation and prioritization of different features. The project lead is refining their presentation for potential partners, and we hope to raise funds for the app's development.
Going forward
Takeaways
Feedback from industry
Feedback from industry professionals
- Who is this for?
- Is the tracking for you the administrator or for the user?
- What would define success?
- What is your MVP?
- How do you know if the plan is working for the user?
- How do your competitors measure their success?
- What metrics would users care about?
- How would you scale this product to provide it for a larger audience?
- How can you further define your user journey for yourself and for your investors?
- What are your most common use cases? What services would be provided to them and at what cost?
- Will you have your own staff of coaches, or will this be a platform for coaches with their own individual styles who will pay you a cut to utilize your platform?
- What drives your deadlines?
- What is your user acquisition plan (adding 100s-1000s at a time vs consumer-to-consumer)?
- What is visible to the admin user (e.g., coach) and to the client on the dashboard? How do the views of the pages compare between both use cases?
- Where do you want to go with your MVP?
- What other maladies are you comfortable with addressing with this app?
- What is the empirical data that shows this methodology is more effective than others? Is there data to support the assumption that you want to achieve your desired life? Does this approach work for everyone?
- Have any patients tried this prototype yet? Do we have data that demonstrates the app's stickiness?
- Who are you selling the app to? How is the ROI calculated?


Potential partners have shared that our team has grown a lot since embarking on this product's design. They wish for our success and encourage us with guiding questions and constructive comments because they each have seen the product's value to users.

They have been informative to the project lead's understanding of what the development process entails and the importance on focusing on an MVP and an effective presentation to various audiences. They have offered venues to assist (via potential product partnerships, ongoing feedback, and a static build).
Takeaways
Thank you for reviewing my work on this mobile app design!

This project was my first experience in UX design to work with a collaborator, who served as the project lead. When invited to join this project, I erred in not providing a project proposal in the beginning to outline the scope of work and project goals. We consequently experienced scope creep and at times had different expectations of our roles and working relationship. During my time with this project, I also worked with a software development company and completed a project management course - both from which I gained some valuable insights of how to help organize this project and to assist or lead future projects.

Like the project lead and like those with whom we've communicated our idea, I see the positive ripple effect that My Desired Life could have on users whether as an independent service or one partnered with other health affiliates.

I stopped work on the project in February 2023 due to conflicting views and misalignment between the lead and myself for project execution and for our project roles. The lead is seeking funding for the initial build in order to test the product at a larger scale.

I am currently refining my skills in Figma, further utilizing components and newer features of the tool (e.g., auto layout) to produce higher quality work in a more efficient timeframe (including improving my layer organization).