Beam
Promoting daily sun protection through reminders, accountability, and positive reinforcement.
Project Specifications
My Role: UI & UX Design
Timeline: 2 Weeks
Tools: Figma, Google Docs, Google Forms, Zoom
Problem Statement
People skip or forget to apply and reapply sunscreen throughout the day.
Background
The Skincare industry is a thriving market that continues to grow every year. With beauty and skincare influencers sharing their knowledge on platforms like YouTube and TikTok, consumers have access to skincare information more than ever. Recently, there has been a shift in the demand of skincare from the older population to a significantly younger audience. People are beginning to use skin care younger and younger as a preventative measure against signs of aging instead of finding treatments at an older age. Despite knowing the effects of sun damage, most people still overlook the importance of applying sunscreen daily.
“People who use sunscreen with an SPF of 15 or higher daily show 24 percent less skin aging than those who do not use sunscreen daily.”
— Skin Cancer Foundation
Research
Competitive Analysis
I analyzed apps that tracked habits and patterns such as Flo, Clue, and MyFitnessPal. I noticed how detailed Flo and Clue were. Users can input not only the duration of their menstrual cycle but also any other symptoms they experience. MyFitnessPal users can input their meals through barcode and image scanning which expedites the food logging process for the user.
User Surveys
Insights Learned
☀️ Most users have at least a basic skincare routine, so they must care about the wellness of their skin to a certain extent.
☀️ Even if people use sunscreen they still forget to apply and reapply it daily — users could benefit from being reminded and being held accountable to build a strong habit
☀️ Users think that notifications would be a helpful reminder but they don’t want to it to be a long process, so logging their sunscreen activity needs to be a quick and simple flow.
Empathize
User Persona
Storyboard
Empathy Map
Ideation & Design
Beam Task Flow
Sketches
Iteration to Increase User Accessibility
Originally the task flow asked the user to scan the barcode of the sunscreen bottle, however after looking at a few of my own sunscreen bottles I noticed that not all of them had a barcode. So I changed the flow to simply just ask the user to take a photo of the bottle label instead. In addition, if the label could not be recognized by the app, the user is still able to log their sunscreen application to hold themselves accountable and keep track of their history.
Notification LoFi
Welcome Screen LoFi
Camera LoFi
Detection LoFi
Confirmation LoFi
Homescreen LoFi
Welcome Screen HiFi
Notification HiFi
Camera HiFi
Detection HiFi
Confirmation HiFi
Homescreen HiFi
Final Prototype
Flow 1: User’s sunscreen is detected and logged
Flow 2: User’s sunscreen is not detected and logged
Testing
Testing Objectives
📝 user will successfully scan their sunscreen and log the application
📝 observe how user interacts and navigates through the minimum viable product
📝 identify any successes and confusion the user may experience
📝 would the user use this app?
Results Summary
⭐ 5/5 users successfully logged their sunscreen application
⭐ positive feedback on interface, layout, color scheme, and font
⭐ navigation was easy
⭐ process to log sunscreen application was quick and simple
“I do put on sunscreen at the start of my day but I usually don’t reapply, so it’s great to be reminded to reapply sunscreen. The timer in the app and getting notifications would be useful for me.”
Next Steps
📝 I wanted to focus on the main scanning and logging process for this case study, but if I were to continue working on this project I would go more in depth into the other features on the home screen.
📝 From the surveys, a lot of users were eager to learn more about sun care and skin care. So I wanted to include those features in the home screen like seeing a fun fact about sunscreens and highlighting a sunscreen they might not have seen or used before to encourage education about skincare and sun protection.
📝 I would add the user’s location on the home screen so the user is aware of how the app knows how long they have been exposed to the sun and how the UV index progresses throughout the day
📝 I would make more wireframes and prototypes, conduct more research, continue to get feedback from testing, and make design changes based on feedback