Roles: User Research, UX/UI Design, Development
Tools: Figma, Optimal Workshop, Usability Hub, Miro
Client: CareerFoundry UX Project
Team: Myself (designer, researcher), Jordan Skedgwell and Tien-Ling Yeh (mentor)
Timeline of One Year
Sophia is a well-being portal designed for busy working professionals. It provides easy access to verified health resources, mindfulness practices, and mood tracking through daily journal entries. Our goal was to encourage a more holistic approach to health, and we achieved this through competitive analysis, user interviews, prototyping, and early visual design.
Although we created an early mockup, further testing and design iterations would be needed in a real-life setting to ensure that all business requirements are met and the product meets user needs. With Sophia, we aim to help busy professionals prioritize their well-being and achieve a healthier, more balanced life.
Many young professionals struggle to balance work and life, leading to an increasing concern for their mental and emotional well-being. To address this, we developed Sophia, a centralized hub for accessing verified health resources, practicing mindfulness, and tracking mood through daily journal entries. Through user interviews and testing, we identified users’ needs and designed a responsive health portal that grows and changes with them. Sophia allows users to journal, learn, and meditate all in one convenient location.
Exploring the problem
Before anything, we needed to better understand users’ potential problems and frustrations. From this, we would be able to start thinking about a clearly defined Problem Statement that would define the design and scope of Sophia.
Users feel unmotivated and uninspired to track well being and mood
Access to quality educational resources is hard to find and verify
Privacy and security concerns when putting personal health information in writing on a platform
Journaling may be seen as a chore or time-consuming
Lack of free time in the day to use an app/portal for self-care
Incentivize tracking well-being and mood through gamification or financial rewards
Include a catalog of vetted educational resources with guest appearances/authoring from members of the medical community
Ensure app and portal security from the start, encrypt all user data and offer an option to export data
Embed a journal function or use voice-to-text to make journaling more accessible and less time-consuming
Offer different timeframes for journaling and provide prompts to help users get started
"Busy young professionals need a tool to balance work and life, manage stress and improve well-being
We will know this to be true when we see at least a 15% reduction in the number of work-related burnout and sick leave, and a 20% increase in net productivity for those using Sophia within a workplace setting.
For individuals, we will know this to be true when we see at least a 20% increase in user-reported happiness after having used the app consistently for two weeks."
Design Process - Double Diamond
Throughout this project, we followed the Double Diamond design approach to structure the design process and create a solution that would be useful for users in the development of Sophia.
User Personas, Flows, and Journey Maps
Prototyping and User Testing
Refined Mockup and Prototype
In order to understand the current scope of the health and well being market, we analysed and created SWOT profiles on four competitor products.
From these SWOT profiles, we found that competitors such as Headspace and Calm were most successful due to their branding and polished end user experience. However, the subscription cost is comparatively high compared to other rival products.
To gain a greater understanding of the above problems, we conducted user interviews to obtain data. These interviews meant we could better understand our target audience and their needs.
In these interviews, the key objective was to understand what was important for participants and what they looked for in a product such as Sophia.
Albert (26) - full-time university student Sally (23) - part-time barista, full-time university student Rick (23) - full-time QA engineer and software developer
Some key findings from these interviews were:
The importance of free time and structured time
Having an online-first approach
Quality user experience over everything
Looking at a holistic approach to health that encompasses everything related to physical and mental well being
With a greater understanding of users’ frustrations, goals, and needs, user personas could be created to help refine who Sophia is for. Three personas and corresponding user journeys and flows were created based on the data collected.
As we move further along in the design process, these personas can help serve as touch points to refer back to, ensuring that development is kept to meet the needs of the users and only necessary features are included.
Alan is a full-time university student studying a Bachelor of Arts at the University of Auckland.
Him and his girlfriend both try to maintain a healthy balanced lifestyle through regular exercise and good nutrition, but have struggled with keeping a social life in balance with university.
Being a full-time student with little money, Alan rarely seeks paid healthcare services and will look up most answers online.
Waiching is a recent university graduate working as a full-time software developer for a local startup in Christchurch.
She is a highly driven individual who is always looking for ways of improving herself, both for her ability to work and personal well being as well.
With performance reviews coming up soon, Waiching wants to be in the best state of productivity and performance possible.
Jill is a full-time CFO at an engineering firm. She has recently gotten engaged with her long-time boyfriend and wants to work on her overall well being before the wedding.
Long hours and demands of her job have meant that Jill’s mental health has struggled over the past few years, and with the help of her fiancée she wants to try get this back on track.
When creating user journeys, it was important to think about the state of mind of our personas. There might be times where our users are tired, frustrated and stressed from the outset due to their busy lifestyles, and are going to Sophia to find some sense of calm. This means that it is especially important that pain points are reduced, and that their journey to complete a task is as smooth as possible.
After discovering the main features of Sophia, user flows were created to understand the steps our personas would follow to reach their goals.
The information architecture of Sophia was determined through a closed card sort, conducted on Optimal Workshop. 19 cards were presented to 5 participants from the target audience based in New Zealand, who were asked to group the cards into 7 categories.
The Library cards were grouped together with high agreement, except for a few outliers who grouped “Listen later” differently.
SOS options were the most clearly defined category with universal agreement among participants.
However, there was a lack of consensus on the placement of cards within the Daily Journal, Time Sheet and Modules categories, leading to greater disagreement and spread among participants.
From the card sort exercise, it was clear that users prefer universal and commonly used words for describing features and menus.
With user flows defined, initial designs were created as low-fidelity paper wireframes.
Guided meditation mobile flow
These paper wireframes then led to the creation of mid-fidelity prototypes in Figma.
Using and adapting existing design systems, such as the Polaris Design System by Shopify, is a great way to bring consistency to a project and make development faster. By building on an established foundation, the design team can focus on customising and tailoring the system to meet the specific needs of the project, rather than starting from scratch. This approach also saves time and effort by avoiding the need to reinvent the wheel for every new project.
In the case of Sophia, Tien-Ling recommended to adopt Polaris as a foundation and adapt it to create a simple and cohesive design for the portal. As a result, the ability to switch views was abandoned in order to keep the design in line with Polaris.
With a high-fidelity prototype up and running, it was time to test this new design through usability testing.
Prior to conducting the tests, a plan and script was written to ensure a consistent testing process between the different users. Participants were recruited through personal and professional contacts.
The testing was moderated, taking place over a week from April 30th to May 6, 2022. Two tests were taken remotely via Google Meet, with the remaining four done in-person at their place of residence.
All responses were gathered and collated into a Rainbow Spreadsheet, which can be accessed here.
Participants appreciated the effort taken to meet them in-person at places that were most comfortable for them. In turn, they were more willing to take their time and give indepth feedback during testing. In future rounds of usability testing, we will continue to attempt to run all tests in the environment that is most comfortable and convenient for the participant.
Based on the responses and feedback, six key issues were identified and ranked according to the Nielsen Scale.
Issue 1: Unable to delete past journal entries (High Severity)
Evidence: 2 participants noted a lack of delete option upon creating a journal entry
Suggested change: Design and implement a delete button
Issue 2: Lack of colour and illustrations make the portal feel cold (Low Severity)
Evidence: 4 participants remarked on the lack of colour and illustrations in Sophia, making it feel “cold” and “clinical” particularly in the Mindfulness Center
Suggested change: Begin adding colour accents and illustrations throughout Sophia
Issue 3: Lack of progress display and personalisation on Dashboard (Medium Severity)
Evidence: 2 participants commented on adding a section in the Dashboard to show different metrics and user progress on Sophia
Suggested change: Design and implement a progress section at the top of the Dashboard
Issue 4: Lack of recommendations for users (Low Severity)
Evidence: 2 participants suggested that having a recommended section would help personalise the Portal and support new users who weren’t sure what they were looking for
Suggested change: Design and implement a recommendations section for users, which could be algorithmically generated and personalised
Issue 5: Users struggle to find music on Sophia (Medium Severity)
Evidence: One participant had great difficulty in finding music within the Mindfulness Center, having to look through screens multiple times
Suggested change: Either clearly label music within the Mindfulness Center, or implement a standalone screen/area for this
Issue 6: Lack of descriptions of what each screen was for (Medium Severity)
Evidence: 2 participants noted that it would be nice to include a text description at the top of different screens that explain the purpose of it, specifically The Library
Suggested change: Add description of The Library below main title, move to add this onto other screens as well for clarity
To set guidelines for future iterations of Sophia, a style guide/design language system was created.
The guide establishes a set of design principles, patterns, and UI components that will be used to create consistent experiences across all platforms and future versions.
Sophia’s UI and structure have undergone significant changes in the past few months, making it essential to conduct another round of user testing and feedback. User research and testing have been critical to the iterative development process.
Jordan noted that in order to ensure Sophia’s commercial viability, more attention should be given to its monetisation strategy. This may involve thinking beyond subscription models and paywalls for material on Sophia.
Testing on the same target demographic would help identify gaps and ensure the product is fulfilling its mission statement. A tentative timeline for testing would be competitor analysis and research on monetization options (1-2 days), designing all screens (2-3 days), usability testing and A/B tests (1-2 weeks), implementing feedback (3-4 days), follow-up testing (1 week), and wrapping up remaining issues (2-3 days).
While this was a bootcamp task, real-world projects come with real-world challenges. Here are three examples of potential obstacles that could arise during a project like Sophia, and how I would tackle them:
Inappropriate content included
To avoid including subpar material in the app’s library, I would prioritize quality over quantity by having all content vetted by reputable industry experts.
A lack of stakeholder engagement
To avoid the risk of designing a product without understanding user needs, I would make user research and testing central to the design process and use it to justify and measure the product’s effectiveness.
Skipping the research
In an effort to cut costs and time, user research can often be axed in favour of moving directly into designing and developing. Because research helps to de-risk design solutions, the danger of removing this is that there is no clear way of knowing users want this product, if they will use it, and if they will be able to use it.
In the case of Sophia, I would avoid this by arguing the importance of this as evidence to both justify as well as measure the effectiveness of the product, particularly in the case of the journalling feature, and make user research and testing central to the design process.