Role

Research, Wireframing

FULL Team

Art Director - Pawel Sokalski

Designer - Olivia Obin

COMPANY

Fancy Pants Group

Programs & Timeline

Omnigraffle & Photoshop

Fall-Winter 2014, full project


OVERVIEW

Gearing up for the launch of the Matte + Poreless foundation, which was a new line in the FIT me! brand, Maybelline tasked Fancy Pants Group to create a responsive interactive tool to recommend to users which FIT me! foundation was best for their skin tone and type. After answering a series of 5 questions, a FIT me! foundation was recommended to the user based off of their selections.

CHALLENGE

The challenge was to build brand engagement and awareness as the FIT me! foundation line was relaunched. The responsive interactive tool was to give the foundation line credibility by providing expert recommendations to the user. These recommendations aimed to make the user feel confident and help build brand loyalty. The tool was to live in the FIT me! brand page on Maybelline's website.

may_challenge.png

RESEARCH

Because this was a makeup recommendation tool, we researched similar tools online that made recommendations to users on specific types of makeup to buy, ranging from other foundations to eyeshadow colors. Interested in how these other tools handled questions and the reveal, we analyzed the step-by-step question process and how end results were presented. We used this research as a foundational resource when building our own task flows and logic charts.

PRODUCTION

Using the research as a foundation, we found that showing the user their process through the experience was vital to let them know how many questions they have to answer to avoid frustration and encourage completion. Keeping a clean design with minimal elements on screen, this made the questions and products the main focus, while preventing distractions to the user. By keeping the questions visual and short, this made the quiz format more fluid with quick answer selection and a direct route to the end goal of giving the user their final results. I put together two different wireframe layouts using Omnigraffle for the client to review.

After 2 client round reviews of wires and moving onto the design phase, I worked closely with the designers to help them with layout and logic changes as the quiz evolved according to the client's needs.

SOLUTION

Due to timelines and evolving client needs, the interface continued to grow past the wireframing stage through design and development. I worked closely with the designers to make sure all elements were user friendly, including clearly displaying which questions were completed and able for the user to go back to change their selection. This was my first "big" project at Fancy Pants Group as a UX team of one, and we, along with the client, were happy with the results!

may_desktop_all.001.jpg
may_mobile_design1.png