Looks Finder
Concept and design the first M·A·C Cosmetics Digital Looks Destination.
Creative Concepting • Design Direction • UI Design • Content Strategy • Prototyping
OVERVIEW
The goal of this project was to establish M·A·C as THE destination for make-up looks.
They wanted to offer an always-on, curated and fully immersive breadth of looks – from global, equity-building looks seen at the fashion runway, to hyper-local, data-inspired and consumer-centric looks from the street-way.
PROCESS
We began by mapping out the user journey through multiple brainstorming and affinity mapping sessions.
We sketched out the journey we wanted users to experience while shopping through the various looks and identified meaningful content modules for each part of the journey
WIREFRAMES
With the user journey as a guide, multiple options were sketched out for consideration and refined into wireframes.
Since there would be different ways in which content was received for each look, we wireframed out multiple options for scenarios where we would have a large selection of imagery, videos and gifs for each look to a scaled down scenario where we would just have a single image.
EXPLORATION
Having a roadmap for content, multiple variations of ways to organize and design each part of the experience were explored.
We explored options to browse through different levels of looks, step-by-step tutorial variations, multiple iterations of the artist commerce page as well as navigation and filters for the product.
REFINING
Since this destination is meant to live as an evergreen library of looks, we used a masonry type grid to display all the looks.
Additionally since content is meant to be scalable and would grow over time, this approach resonated the most as well with business partners and engineers.
THE EXPERIENCE
The team wanted to organize the library of looks into three distinct categories that would serve as an initial navigation guide for the users.
Users can easily scroll up and down through the different categories or click on the the navigation tabs at the top to jump to sections of the page.
BROWSE & BUY
We wanted to allow users to buy the look in one click.
The interface allows users to seamlessly browse through looks and explore further to buy individual products, see similar looks that other users created or learn more about the artist.
LOOK TUTORIALS
Users can easily carousel through alternate images of the look to reveal tutorials.
This gives the brand the flexibility to adapt the design to multiple ranges of additional content that would be received for various looks.
SEARCH &
FILTERING
We wanted to make sure the range of looks can be filtered and searched effectively.
We also wanted to make sure that key trends and suggestions are being called out when users are inputing information in the search field to help guide them to what they are looking for.
TEAM
Jeffrey Blum | Executive Director
Rachel Felsinger | Associate Design Director