Skin Care with Phlair

UX/UI Design Project – 2.5 Weeks
Helping a new skincare brand connect with conscious consumers through user-first design.

Project Overview

A fast-paced, client-led UX/UI sprint to design a mobile-first website prototype for Phlavours, Phor You, a small skincare startup seeking to expand beyond Instagram. Our team was responsible for crafting a user-friendly site experience from scratch—all within 2.5 weeks.

Mobile phone displaying a website for Phlavours. The website has a lavender and green color scheme, with sections about face and body oil made from natural ingredients, and a story about the company's mission in Portland, Oregon.

Type: UX/UI Design (Client-Facing Group Project)

  • Role: Interaction Designer, Research & Strategy Contributor

  • Tools: Figma, Trello, Google Forms, Zoom

  • Team: 4 Designers

  • My Focus: Prototyping, Interaction Design, User Journey Mapping, A/B Testing

The Challenge

Philicia, the founder of Phlavours, Phor You, built her brand around clean, organic skincare, but her only platform was Instagram. She needed:

  • A trust-building online presence that aligned with her brand values

  • A clear product discovery experience for first-time customers

  • A mobile-first design to reflect where most of her audience shops

Instagram profile page for phlavoursxxii with a black theme, showing posts with motivational quotes, animal print, gift items, and a woman in athletic wear.

My Role & Responsibilities

As a key contributor in this project, I:

  • Led the User Journey Mapping process based on our persona insights

  • Owned the Hi-Fi Prototype Design and all interactive Figma flows

  • Distributed and analyzed results from our user surveys and A/B testing

  • Participated in user interviews, storyboarding, and persona creation

  • Contributed to our affinity map and MoSCoW prioritization

My goal was to ensure the final design felt intuitive, genuine, and reflected the user’s desire for transparency and simplicity.

Mobile wireframe design of an e-commerce skincare website called Phlavours, Phor You. The layout includes pages such as homepage, product collection, product details, about us, and menu navigation. The pages feature images of skincare products, informational text about the brand and products, reviews, key benefits, ingredients, and a call-to-action button to add items to the cart.

Meet Samantha

As part of our early process, we developed a user persona grounded in our research and interviews. This helped us stay aligned with the user’s needs and pain points before moving into design exploration.

Name: Samantha

  • Age: 32

  • Values: Natural ingredients, environmental conscientiousness, trustworthy branding

  • Goals: Find gentle skincare products that work for sensitive skin

  • Frustrations: Lack of transparency, product overload, distrust of marketing claims

A woman with curly black hair and jewelry is leaning on a balcony railing with her eyes closed, overlooking a cityscape at dusk with blurred city lights in the background.

Samantha’s Journey

  • Samantha discovers Phlavours via Instagram

  • She seeks ingredient transparency and brand values

  • She evaluates credibility through the website's design and messaging

  • She decides to explore products, impressed she completes a purchase

A woman with curly hair wearing an orange shirt is seen in four illustrations. In the first, she is holding a smartphone displaying the Instagram logo. In the second, she is thinking with her hand on her chin, near a potted plant and framed artwork. In the third, she is looking at a tablet with the heading 'PHLAVOURS' and an image of a mountain. In the fourth, she is viewing a laptop screen showing medication bottles and a plus sign.

The Process

We used a streamlined Double Diamond approach:

Diagram illustrating a four-step design thinking process with two parallel paths: Empathy (What and Why) and Prototype (When and Where). The empathy path includes mapping involved, insights into people's experiences, identifying themes, and understanding causal influences. The prototype path involves seeking feedback, rapid testing, refining the business model, and measuring impact. The process flows through stages: Discover, Define, Design, and Deliver.

Discover

  • Conducted user interviews with skincare buyers to understand frustrations

  • Launched survey via Google Forms; analyzed 30+ responses

  • Built an affinity map and defined key frustrations: trust, ingredient clarity, and brand ethos

Define

  • Developed primary persona, Samantha, based on user patterns

  • Outlined her journey: searching, researching, and comparing skincare

  • Defined key user needs: visual trust cues, ingredient transparency, and sustainability

Design

  • Sketched initial concepts, moved to low-fi wireframes and mid-fi flows

  • Led transition into Hi-Fi prototyping in Figma and built clickable site prototype

  • Incorporated A/B testing to refine product page layout and menu structure

Deliver

  • Presented full mobile-first prototype to client

  • Received strong validation from the founder

The Solution

To meet the needs of both Samantha and Philicia the final mobile prototype emphasized:

  • A clean, confidence-inspiring homepage with immediate brand value messaging

  • Easy-to-skim product and ingredient transparency

  • Bold yet elegant visuals using animal print accents from the founder’s vision

  • Clear CTAs that balanced information with user trust

Check Out The Prototype
Two smartphones displaying a website called Phlavour, with a purple and green themed design. The left phone shows the homepage with text about natural oils and a "Shop Products" button. The right phone shows the 'About Us' page with a photo of a woman and a section titled "Meet the Founder".

Outcome & Reflection

Two speech bubbles with quotes on a light green leopard print background. The larger, purple speech bubble contains a quote from Philicia Robinson praising the user-friendly information presentation. The smaller, lavender bubble contains another quote from Philicia Robinson complimenting the website's color scheme and animal prints.

  • The founder was thrilled and plans to develop the site using our designs

  • I strengthened skills in interaction design, cross-functional collaboration, and rapid prototyping under pressure

  • If expanded further, I would explore motion design for richer micro-interactions and conduct usability testing post-launch

Return To Portfolio