Carlissa Arrow
Thanks for viewing my portfolio. If you have any questions or concerns please contact me.
:D
Hap App
Flourish Labs saught out MADE students to revamp their “Hap” app, a companion to their Peer support service that connects young people to empathetic peers. Users check-in up to four times a day for six different categories to track their mental health information and transform their lives.
Tools:
User Interaction Design
Figma
Data Visualization
Special Thanks to Obi Felton, X, Moonshot alum
Link to Figma Workspace
Flourish Labs’ Challenge
Users need to understand the visual language of the check-in process and the data dashboard in order to increase check-in frequency and quickly understand their mental health data results. It is extremely difficult for the Flourish Labs team to visualize these data points in a visually appealing and digestable manner.
My Solution
a “Tinder-style” check in process and Google Calender Data Visualization mixed with biophilic elements
Iteration & Prototyping
Inspired by music’s ability to sooth and calm our
senses, I initially sought out data visualization that resembled music features that were familiar to music listeners. Through the ideation process, I created several flower-based visualizations because I believed the circular and growing nature of petals could represent more than
two different data points collected by users, such as category, percentage of completion of each category, and the quality of response for that category.
MVP 1
In order to validate my ideas, I created dummy data and generated an Alluvial Diagram , best for correlations and proportions. Each line represents a question from the Check-in. I wanted users to see what category each question was from by color, view and compare status based on where the line drew from “not at all” to “very much”. This was not a well-received visualiztion, it was not intuitive to people to understad information top-down. However, people responded well to the beauty and “flow” so I continued to iterate on that.
In order to validate my ideas, I created dummy data and generated an Alluvial Diagram , best for correlations and proportions. Each line represents a question from the Check-in. I wanted users to see what category each question was from by color, view and compare status based on where the line drew from “not at all” to “very much”. This was not a well-received visualiztion, it was not intuitive to people to understad information top-down. However, people responded well to the beauty and “flow” so I continued to iterate on that.
Final Prototype
The final version was a fresh take on Google’s Calender chart and Tinder’s Swipe UI. (Swipe to View Screens)
Since diffent types of inforamtion (Mood, Physical, Social, ect) needed to be viewed in different formats, such as by day, month, and year, I assumed that a calendar format may be best suited. Again, I created dummy data and generated a Bumbchart, flipped it vertically so it could be read left-to-right, and aligned it to each day in the calendar. I layered each categories bumbchart on top of each other so users can compare thier status simultaneously but also easly remove what categories they do not want to view.
To address the bias and limitations in the Check-In process I assumed the “swipe” interaction would be more familiar to this generation of users and creates an intutive way to “reject” an answer without adding more elements to the screen. Lastly, the Home Dashboard implemented the floral inspired petals which depict the categories and statues of each category for the user. The ultimate goal was to make the Home Dashboard more personable and intuitive for a young generation of users. This redesign was well-received by thte Flourish Labs team.