Zen Pet is an innovative self-care app that utilizes a virtual pet to promote healthy mental health practices, such as stress and anxiety reduction, self-care improvement, and bonding with a virtual pet.

The primary target audience for Zen Pet is college students and young professionals who are seeking ways to manage their mental health concerns effectively.

Project duration:

January 2023 - February 2023

Zen Pet

Project overview

The problem:

Nearly one in five U.S. adults live with a mental illness (52.9 million in 2020) [1]. We identified that users with mental illnesses have trouble completing tasks and are not motivated or enthusiastic about their life.

The goal:

Design an app that combats mental health by providing educational resources and practices for self care and providing a safe and inclusive community for individuals with mental illnesses.

My role:

Lead UX designer, Lead UX researcher, Visuals, Interactions

My responsibilities:

Conducting interviews and user research, paper and digital wireframes, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, iterating on designs and responsive designs, information architecture.

User Research

I conducted extensive research on mental health issues and illnesses in the United States before developing interview questions that were used in user research. Through these interviews, I found that many users felt like they were struggling with mental illness but didn't have access to professional resources such as therapy or were overwhelmed by the process of seeking help. Additionally, many users felt isolated in their experiences and wished for a supportive community.

With these insights, I developed an app that provides educational resources and practices for self-care, as well as a safe and inclusive community for individuals with mental illnesses. The app also includes a friendly virtual pet that encourages users to access resources they might not have otherwise considered.

Problem statement:

Norman is a working software engineer who needs motivation and positive encouragement because they want to achieve their goals and become the best version of themself

Problem statement:

Mary is a working college student who needs extra help with self-care and friendly encouragement because they want to deal with their overwhelming emotions from their everyday life.

Competitive Audit

An audit of a few competitor’s products provided direction on gaps and opportunities to address with this self-care virtual pet app.

View the competitive audit here

View the audit report here

Design

Wireframing - App

Ideation

To address the needs and gaps identified in the competitive audit, I conducted an ideation process to generate ideas for an app that would provide effective solutions for users. With a focus on self-care, motivation, and community building, I began to brainstorm ways to create an engaging and supportive experience.

Through this process, I considered the user's desire for easy access to mental health resources and the importance of creating a safe space where individuals could openly discuss their mental health struggles. I also thought about the user's need for motivation and encouragement, and how a virtual pet or friendly character could provide that extra push towards self-care practices.

Paper wireframes

By sketching wireframes, it allowed me to experiment with different design concepts and layouts without investing too much time and resources into the project. It also helped to identify any potential issues or problems early on in the design process before moving onto the digital wireframing stage. Additionally, it was important to keep the overall flow of the website in mind during this stage to ensure that the user journey was seamless and intuitive.

Digital wireframes

With a focus on providing a safe and supportive environment, I designed the wireframes to promote self-care and encourage the user to express their thoughts and feelings. I also wanted to ensure that the user flow was intuitive and seamless, so that the user could easily navigate through the app and access the resources they needed.

To achieve this, I carefully considered the placement of each element on the screen, and how they interacted with one another. I added features that I thought would benefit the user, such as motivational quotes to inspire and encourage them, and a clear indication of where to input their thoughts. Additionally, the layout was designed to provide the user with a sense of openness and space, while still being able to access key features like the 'done' button. Overall, my goal was to create a wireframe that would help users feel supported, motivated, and empowered to take care of their mental health.

Low fidelity prototype

To ensure the usability of the design, a low-fidelity prototype was created to test the primary user flow.

The flow involved users logging in, completing self-care acts, and caring for their virtual pet.

The prototype allowed for the identification of any usability issues or concerns that needed to be addressed before the high-fidelity prototype was developed. The low-fidelity prototype was also used to gather feedback from potential users to ensure that their needs and expectations were being met. Based on the feedback received, changes were made to improve the overall user experience and to ensure that the app was meeting the needs of the target audience.

View the low-fidelity prototype here

Usability study

Study Type: Moderated Usability Study

Location: United States

Participants: 5 participants

Time: 20-30 minutes
The moderated usability study found that:

Users want a way to customize their self-care practices even more.
Users had trouble adding or removing journals and goals.
Users found the shop confusing to navigate.

Mockups & changes

Changes

Incorporating the insights gathered from the usability study, I made design changes to the high-fidelity prototype of the Zen Pet app. One of the most prominent changes was the addition of an image attachment feature, allowing users to upload photos that they feel complement their self-care practices or their pets. The mood chart was also added for each new journal or prompt that the user completes. This chart would allow users to visually track their moods over time and notice any patterns or changes that may help them with their mental health. Other design changes included improving the overall layout and typography to create a more cohesive and engaging experience for the user.

Another design change was adding customizable icons for the goals. This feature allowed users to choose from a range of icons that best represented their goals. This personalization aspect of the app helped users feel more invested and connected to their goals.

Additionally, I added a clear indicator for when a goal is completed. This feature allowed users to easily track their progress and feel a sense of accomplishment upon completing a goal. Overall, these design changes helped to make the app more user-friendly and engaging for users.

Mockups

High-fidelity prototype

The high-fidelity prototype incorporated various design changes that were suggested based on the findings of the usability study. One of the changes included adding more screens to the user flow to create a more immersive experience for the users. The additional screens helped users understand the app's features and functionalities better, making it more intuitive and engaging.

Another design change that was implemented in the high-fidelity prototype was the addition of more user-friendly features. For instance, I added a feature that enabled users to customize their pet's appearance and choose their favorite activities, making the experience more personalized and enjoyable. Additionally, I improved the navigation by including clear labels, buttons, and icons that made it easier for users to access various features within the app.

View the high-fidelity prototype here

Accessibility considerations

Used varying text sizes for hierarchy and readability.
Used landmarks, alt text, and descriptions on photos for screen readers and users using other assistive technology.
Used varying colors with different shapes and icons for a clearer call to action.

Wireframing - Website

Paper Wireframes

To ensure a smooth and user-friendly experience, paper wireframes were sketched for each screen on the website. This step was taken to ensure that the navigation, interaction, and overall flow were all carefully considered before moving on to more detailed design work. By starting with paper sketches, it allowed for quick and easy iterations and adjustments without the added time and effort of working on a digital design. The sketches were refined based on feedback and insights from usability testing and further refined in the high-fidelity prototype. This approach helped to create a more thoughtful and intentional design that ultimately better served the needs of the target users.

Sitemap

After completing the app designs, I began working on the responsive website designs. To ensure a cohesive user experience across all devices, I created a sitemap that served as a blueprint for the website's structure. The sitemap allowed me to plan out the pages and content that would be included on the website, ensuring that users could easily navigate through the website and find the information they needed.

I also took into consideration the different screen sizes and resolutions that users may access the website from. This helped me to design the website in a way that would be visually appealing and functional on various devices, from desktop computers to mobile phones. By creating a responsive design, I aimed to provide a seamless user experience regardless of the device being used.

Responsive designs

Tablet

Desktop

Mobile

Takeaways

Impact:

Users found the app to be highly beneficial for their mental health and motivation on a daily basis, and they appreciated the variety of features available to them. According to peer feedback, the app gave them a sense of control and power to combat their depression, as they felt they had a range of options to choose from.

One quote from the peer feedback was that “the amount of features makes it feel like I have the choice and power to combat my depression”

What I learned:

Through this project, I realized that addressing even small aspects of mental health and self-care can have a big impact on users. By actively listening to the needs of our target users and incorporating their feedback into the design process, we were able to create a solution that was not only feasible but also useful. This iterative approach helped us to identify and prioritize the features and functionalities that would provide the most value to our users.

Overall, this project taught me that designing for mental health requires a deep understanding of the user's needs, and that even small design changes can have a significant impact on their overall experience. By prioritizing user feedback and continuously iterating on the design, we were able to create a solution that truly addressed the needs of our target audience.

Next steps:

Conduct research on the impact and usefulness of the app in helping users feel connected, motivated, and overall have a better well being.
Add more educational features about mental awareness and self-care practices.
Provide more ways to build individual communities and sense of connection on the app.

Thank you for your time reviewing my work on Zen Pet! If you would like to see more or get in touch please contact me at:

Email: connieliu000@gmail.com

Website: https://connieliu000.wixsite.com/connie-liu

Linkedin: https://www.linkedin.com/in/liu-connie/