Project: Personalized app
Role: UX/UI Designer and researcher
Platform: Mobile app
Tools: Sketch, InVision, Photoshop, Illustrator, Keynote
Better Together is a personalized app, built entirely for one user.
The Challenge: The task was to create an entirely personalized app for one user. The objective was to strengthen our empathy tools, to discover, via user interviews, what app would most assist our user in their daily lives. My client (M) was looking to strengthen her connection with her husband as well as herself, instead of turning to social media to calm/distract herself. M was very clear that she didn't want any sort of hook method folded into the app.
The Solution: I created a social wellness app that would support her during times of stress. It would serve to build her wellness reserves and it would be a tool that her and her partner used together, building their connection simultaneously.
"I'd hire you because you're empathetic and careful with sensitive information. I deeply appreciate the way you handled and presented what I shared with you. You made me feel safe when otherwise I'd worry that I said too much". — Client.
The drive behind this project was to truly connect with the user and via qualitative research, discover what the client's (M) primary concern was. From that, to create a solution via a mobile app. It would be completely personalized to M and the UI would align with her style too.
After a series of interviews with my user, M shared that she needed to spend more quality time with herself and her husband. She found herself, in free time, turning towards apps that didn't leave her feeling uplifted. Each time she took a moment to be creative, meditate, eat well or be outside, any sense of overwhelm evaporated and she had more energy to continue with life's tasks. She also shared that her husband (A) often received her stress calls. When A wasn't available in that moment it would leave her feeling disconnected from herself and him. I learned the value of trust and really taking time to sit and empathize with my user. Had she in any way felt uncomfortable with me, I might have created an entirely different app, not meeting her need for connection and well-being. It was a privilege to interview M, to discover my love of user-research that could easily have been passed off as a mere modality. This project marked the birth of my true understanding of User-Centered Design.
M shares that both her and her husband, love illustration and being creative together. This informs concepts for potential features, as well as inspiration for the style guide and branding.
Walking through the user flow, it assists us in understanding M's emotional journey. It's clear that her pain point is the moment her stress rises and she's unable to reach A in that moment. The app could serve as a means to assist in calming her stress until A becomes available again.
Defining the problem statement from a core place; allows for a more fulfilling
solution for the user.
This hypothesized solution becomes the north star for the app, providing a direction for the UX process.
Story board & sketches
This methodology allows us to envision the emotional journey alongside the action steps with the app. It starts to flush out the flow to discern any pain points that may affect the user's experience of the app.
Story board & sketches
Visualizing the flow provided further iterations and features. Wellness options were added at this point as well as a wellness points system. This feature was ousted upon the next iteration as my primary user was against any hook systems. She felt prone towards them and noticed her anxiety levels increase in this frame.
This flushed out some of the previous pain-points and the app's visual hierarchy began to take shape. Headers for each page assisted with site navigation, as did the footer icons. This stage allowed me to begin user testing with other users, for a wider perspective on the app.
4 Onboarding pages were added to help users understand the function of the app. These were also built with the key feature of personalization, as the photos converted to illustrations and became the icons then featured throughout. This was a deeply meaningful addition for the client.
This stage allowed me to begin user testing with other users, for a wider perspective on the app.
The green arrows note pages and features that were updated post user-testing. Visual elements were arranged for an optimized flow, as well as navigational copy to guide users on where they were headed to, next.
Top row is low-mid fidelity
Bottom row is high- fidelity