Electronic Retail Shopping App
2022
Overview
Creative Direction, Strategy, Copywriting
Elise Cotton/ Strategy
Jon Wood/ UX Design
My Role UX & UI Design, Research,
Design System, Strategy,
Copywriting
& Analysis
Inefficient User Flows The absence of persistent, intuitive navigation makes it difficult to access key pages, disrupting the browsing experience.
Limited Engagement A lack of product ratings, community features, and lifestyle content reduces user interaction and feedback.
Note: This project was conducted in 2022, with marketing content and customer experiences based on insights from 2021.
• Integrated live-stream shopping mode for dynamic product discovery.
Marketing Perspective • Optimised homepage to match users' scrolling behaviours and preferences.
• Encouragement of product sharing and user-generated content via social media.
• Enhanced mobile interaction for a more engaging experience. • Community engagement through interest-based clubs.
• Curated lifestyle content to enrich the user experience.
Solutions
Intuitive Navigation
Streamlined Purchase Processes
Product ReviewsLive-Stream Shopping
Personalised Product Recommend
Enhanced User Flows Intuitive Navigation Streamlined Purchase Processes
Live-Stream Shopping
Enhanced User Flows Intuitive NavigationStreamlined Purchase Processes
Enhanced User Flows Streamlined Purchase Processes
Enhanced User Flows Intuitive Navigation Product Reviews Streamlined Purchase Processes Personalised Product Recommend
Enhanced User Flows Intuitive Navigation Streamlined Purchase Processes
Intuitive NavigationInspiration Engagement
Intuitive Navigation
Enhanced User Flows Intuitive Navigation Inspiration Engagement
Create clearly defined sections for categories, special offers, product entries, and ad banners to improve navigation.
Checkout Page
Provide a clear option for adding and naming multiple addresses and shop locations for easier management.More Button
Group similar functions together under clearly defined categories.
Make the review section more visually distinct to encourage exploration.
Sort and Filter
Functions Use user search behaviour to offer default filters for a personalised search experience. Priority 2 Hamburger Button
Plan to develop and clarify this function in future phases.
Stories, Buying Guides, Community, Classes & Events.
This immersive approach inspires users with lifestyle-driven content.
Forwards
2Enhancing Community Engagement Introduce interactive features like discussion forums and expert-led Q&A sessions to foster user engagement.
4Exploring AI-Driven Enhancements Implement AI-powered customer support, order assistance, personalised smart search, and predictive shopping to enhance the user experience.
A Personal Wellness Companion
Present
0
Overview
Wellio blends warm microcopy, flexible interactions, and light-touch AI insights to make daily wellness feel personal and sustainable.
My Role: UX Research · UI/Interaction · Design System · UX Writing · Strategy · Brandin
• Empathetic tone
• Adaptive, choice-based interaction paths
• Subtle AI personalisation to surface what matters
Designed to help users build habits that last.
2. Personalise tools and content based on evolving user needs
3. Support habit continuity through small, confidence-building wins
Challenge “What if a wellness app felt more like a supportive companion than a tracker?”
• Small clarity fixes boosted confidence and reduced hesitation.
• Light-touch AI surfaced what mattered without adding pressure.
• Supportive tone encouraged users to return and stay engaged.
Together, these signals point to a warmer, high-trust experience that supports long-term habit continuity.
How AI SupportsLightweight grading, summaries, and tailored suggestions enhanced understanding without cognitive load.
Potential Business ValueSupportive guidance strengthens habit retention, deepens trust, and opens opportunities for wellness partnerships.
1
the Product & User
Most tried health tracking but stopped after 1–2 months.
Overwhelming → flexible, gradual setup
Chore-like → positive tone, small wins
Impersonal → AI journaling + supportive messages
Raw data → simple insights + actions
Forget to engage → personalised nudges
Emily, 32, wants simple, reassuring wellness tools she can return to daily.
Emily needs a personalised, supportive way to track wellness because most apps feel demanding and disengaging.
2
Solutions
Enhance Efficiency
Simple logging + shortcuts
Adaptive tools + preferences
Motivation through Emotion
Friendly tone + AI suggestions
Friendly tone + AI suggestions
Well Today · Well Me · Well Know · Well Forum
A flexible structure reduces cognitive load, allowing users to explore, reflect, or connect at their own pace.
Positioning Well Today as a personalised daily hub helps users build sustainable routines.
After onboarding, users engage through three key pillars:
Reflect (Well Me), Explore (Well Know), and Connect (Well Forum).
Well Today acts as the home base, where users can pin tools or surface saved content to continue routines at any time.
User Journey Overview
2.2 Connect (Well Forum) /
2.3 Explore (Well Know)
Setting context and focus
Users start with a calm, optional onboarding that tailors their experience to personal goals and motivation.
1 Welcome
2 Choose Focus
3 Motivation
4Setup Complete
Well Today Daily personalised hub
Acts as the user’s home base: combining key tools, daily stats, and gentle encouragement to maintain routines.
5–7 Personalised Greeting · Daily Tips · Pinned Tools
8–9 Suggested Content · Community Card
Helps users see patterns and celebrate small wins through daily, weekly, and monthly summaries.
10–12 Daily Stats · Goal Progress · Learning Streaks
13 Trend Overview
2.2 Connect: Well Forum
Build light-touch connections
A safe, low-effort space for sharing reflections and learning from others’ experiences.
14–16 Prompt · Community posts · User Shares
Learn and grow through guidance
Offers bite-sized articles and AI-suggested reads based on each user’s habits and goals.
17 Today’s Fresh
18–19 Article View · Topic Feed
20–21 In-Depth Focus · Save / React
Capture what matters easily
Users can log meals, health data, and moods through flexible methods: typing, selection, or quick photo scan.
22 Add Breakfast
23 Nutrition Breakdown
24 Health Data Log
25 Photo Record
26 Saved Items
Illustration, photography, and type treatments convey Wellio’s encouraging, joyful tone of voice.
The visual system builds an approachable, notebook-inspired world that helps users feel supported and in control of their wellness journey.
A flexible, mobile-first UI library translating brand values into clear and consistent interaction design.
View Full Design System
3
& Iteration
5 remote participants tested the low-fidelity prototype.
Key tasks: logging breakfast, adding favourites, viewing stats, and exploring content.
Findings and insights directly informed the high-fidelity iteration.
(Includes five tester records with observations, feedback, and recommendations.)
1. Navigation lacked continuity
2. Important actions were not easily discoverable
3. Missing confirmations caused uncertainty
To guide iteration, findings were grouped into prioritised fixes (P0 / P1 / P2) to steer redesign focus.
Problem Found
1. Users didn’t notice the screen could scroll
2. AI icon meaning unclear
3. Customisation icon ambiguous
Design Fix
1. Added clear scroll cues
2. Introduced brief AI health tips
3. Clarified customisation icon
1. AI and nutrition insights unclear
2. Unclear what each panel represented or how it functioned
Design Fix
1. Highlighted AI and added an insight button
2. Added chips to preview panel categories
1. Content felt disconnected from user
Design Fix
1. Added “Your Focus / Your Goals” labels and AI-suggested content for better personal relevance
1. Low relevance and engagement
Design Fix
1. Linked discussions to user goals and recent logs to increase relevance and participation
1. No feedback when item added
2. AI unclear
Design Fix
1. Added confirmation message after item is added
2. Added concise AI guidance message
1. Button unclear
2. Nutrition-grade scan ambiguous
Design Fix
1. Added labelled buttons for clarity
2. Introduced grade icon with tooltip for easier understanding
1. Favourite icon unclear
2. Hard to tell if food was healthy
3. “Done” button hidden
Design Fix
1. Added tooltip and saved-state feedback
2. Introduced a simple nutritional rating label
3. Renamed “Done” to “Log This Food” and made it a floating action button for continuous visibility
Body Measurements
Problem Found
4. Date unclear
5. Summary tone too neutral
Design Fix
4. Added clearer grouping and visible date
5. Introduced friendly AI summary for positive reinforcement
1. Hard to return or switch between sections
2. AI assistant was passive
Design Fix
1. Added global bottom navigation
2. Enabled AI nudges to link directly to relevant tasks
4
Forward
Early feedback surfaced blind spots: unclear icons, missing confirmations, and confusion around AI cues.
2 Micro-frictions shape confidence
Even small hesitations (e.g., “Is this saved?”) influenced trust. Clear micro-interactions mattered more than expected.
Users liked choice, but only when guided. A light framework made customisation feel supportive, not overwhelming.
4 AI tone must be human
Participants preferred insights that felt simple, friendly, and emotionally aware, especially in wellbeing contexts.
Several weren’t sure how to return to Well Today or switch sections smoothly.
Participants paused at buttons like “AI” or “Favourite”, unsure what they meant.
Stats alone didn’t motivate behaviour: users wanted summaries, nudges, or small suggestions.
Personalisation existed, but wasn’t always recognised without better visibility or grouping.
Small reassurances, ticks, toasts, shadows, helped users feel more “on track”.
Coming from a visual design background, going through the full UX process: research → testing → iteration, expanded how I think about product design. It wasn’t perfect, but it pushed me to grow in both craft and mindset. I’m proud of how far I’ve come, and excited to keep building, not just better design, but more meaningful experiences that genuinely support people.
Iterate & Test • Refine remaining Priority 2 issues
• Run a second round of usability testing
• Improve navigation clarity + AI flows
Collaborate
• Seek senior UX/Product design critique
• Validate AI summaries with real users
• Explore co-creation or mentorship
Community Growth • Add prompts, Q&A, and lightweight events
• Explore new content formats (GPS logs, streaks, wellness trivia)
Partnerships • Collaborate with health brands for giveaways or challenges
• Build reward-based streak systems tied to goals
5
Iteration
Streamlining the In-Store Journey
2018
Customer Journey Mapping
User Flow Design
Research
Brand Identity Extension
Strategic Planning
Creative Direction Paul Mynard
Customer Journey & User Flows
Paul Mynard, Ju Wen Cheng
Lead Designer Ju Wen Cheng Conceptual Rendering Emily Budden
Product Photography Godiva
Analysis
Lindt
Debuted colour‑coded ‘Pick & Mix’ walls and in‑store digital signage to streamline self‑service while maintaining a premium brand atmosphere.
Hotel Chocolat
Adopted an open‑plan “Chocolate Wall” concept and tablet‑based gifting guides, helping customers navigate quickly and reducing queue build‑ups at tills.
Pain Points
Difficulty navigating crowded chocolate counters.
Unclear purchasing steps , leading to confusion and longer wait times.
Feeling ignored or overwhelmed in busy environments.
Personas
Busy Professional Prefers quick, efficient shopping experiences; feels overwhelmed in crowded environments. experiences.
Problem statement
Emma needs a fast and intuitive way to select and purchase chocolates without navigating through crowds.
Gift Shopper Looking for easy-to-understand, guided gift-buying experiences with minimal stress.
Problem statement
John needs help selecting and customising chocolates for gifts without feeling confusion.
Arrival &
OrientationCustomers are welcomed by an engaging chocolate-themed video wall and a marble-finished "Create Your Collection" zone outlining the four-step process.
Engaging &
Interaction An intuitive four-step journey allows customers to proceed independently via digital touchpoints or with staff support:
Step 1
Choose a box size
Select preferred chocolate box size
Step 2
Choose your chocolates
Explore options via physical display or touch screens, with seasonal highlights
Step 3
Choose your packaging
Pick a preferred wrapping and ribbon
Step 4
Write your message
Personalise with a message card
Service &
RelationshipCustomers proceed to checkout and receive a beautifully wrapped chocolate assortment. A printed card included in the gift bag describes the selected chocolates for flavour recall.
Browse the Ranges
Choose by Preferences
Clear digital steps support customer confidence and reduce confusion
cear
Thoughtful layouts support congestion relief in compact retail spaces
Offering multiple user paths supports diverse shopping behaviours
cear
Combining digital and human support creates a more inclusive in-store experience
Conduct in-store testing to refine the design with real customer feedback
cear
Launch the "Choose by Gift Occasion" feature for gift-focused purchases
Integrate loyalty options to enhance future visits and encourage repeat purchases
cear
Expand the digital solution to other high-traffic Godiva locations, tailored to store size and layout