Get Ready with me
UI, Interaction, Animation
A lot of the videos in the fashion / beauty community on Youtube are makeup tutorials and “get ready with me videos”. Here I have designed an interface intended to be used on a mirror for the user to interact with in the morning as part of their daily routine. Follow along with a “beauty guru” from a youtube tutorial, and have an interactive user guide connected with the video to help step-by-step.
UI Design Elements
Upon approaching the mirror it will light up and greet the user, clock & weather will be active in the corner
User will then check their calendar for the day to see what sort of look they need to be getting ready for
User pulls up youtube tutorial panel of saved looks, and look for appropriate video to follow along with for their planned day’s activity (some options to show: job interview, night out, daily, natural, glam, party, etc.)
Once a makeup Style is selected a scrolling list of videos will appear for the user to make their selection
As video is loading and playing through the ads, it will tell the user what tools and products they will need for the tutorial, you can scan and store a list of what products you have so if you don’t have the exact same product as the one used in the tutorial, it will tell you what product you already own that is closest.
As the user is following along with the tutorial, the interface will highlight/preview the specific areas of the face they need to apply the various products to. (not pictured above)
At the end of the application the interface will ask the user if they’d like to take a selfie and post to instagram
Color, Typography, & Iconography
Clean, Minimal & Modern; Very millennial, blush pinks & white. Pulling a lot of inspiration from the “beauty vlogger” aesthetic
Due to the interface being on a mirror, much of it is low-opacity, so the user can still see themselves through all of the elements