Back to Portfolio
Hero Image

Problem Statement

Required a user-friendly above-the-fold layout for quick scanning of image gallery and key product information.

Needed a clearer and more prominent presentation of the ingredient list as the most critical information.

Product page had to remain informative yet concise, avoiding excessive text.

Interactivity across the website needed improvement to create a more engaging and modern user experience.

Problem visual

The Approach

Approach Image

Replaced the image carousel with a structured image gallery for faster scanning and improved visual clarity above the fold.

Introduced dedicated testimonials and FAQ sections to build trust and reduce decision friction.

Designed a strong USP banner to clearly communicate product value at first glance.

Developed an interactive ingredient section to highlight key components without overwhelming users with dense text.

Added a comparison chart to simplify decision-making and showcase product differentiation effectively.

My Role

Design Strategy Problem Solution Information Architecture Empathy Mapping Usability Testing User Flow Mapping Prototyping Wireframes Competitive Analysis Visual Design User Research User Personas

Designing Thinking Process

Research

User Research
Entrant Analysis

›››

Define

User Persons Goal Statement
User Journey Map

›››

Ideate

Brainstorming, Card Sorting
User Flow

›››

Design

Paper Wireframes
Visual Design, Prototype

›››

Test

Check Usability
A/B Testing

Project Timeline

UX Design Timeline

UX Design

High-Fidelity Wireframes

High-Fidelity Wireframes

UX Design

Typography & Colors

Font Used

Helvetica
Helvetica Neue
Helvetica Bold — Headlines & emphasis
Helvetica Medium — Sub-headings, labels
Helvetica Light — Body copy & captions

Color Used

Primary
#4C8A2F
Secondary
#E8F3E0
Text Dark
#1A1A1A
Text Muted
#888888
BG Cream
#F7F5EF

Visual Design

Visual Design UI Visual Design UI
product product
Thank You

Thank you for your time ☺️

A UX/UI Case Study crafted with research, empathy & design thinking.

Next: Create Room →

View Case Study