Healthcare

A UnifiedE-Commerce Experience

Redesigned Juara Skin Care’s e-commerce platform to deliver a cohesive, user-centric experience across multiple regions while maintaining brand consistency.

+13%

Task completion

-10%

Navigation friction

+12%

Customer satisfaction
CLIENT
Juara Skin Care 
TIMELINE
Duration to be confirmed
TEAM
UX Designer, UI Designer

Services Used

Product & UX DesignUI & Visual Design
the problem

The Challenge

Juara’s country-specific e-commerce sites (Indonesia, New Zealand, USA) suffered from inconsistent design and fragmented user experiences. Customers faced navigation issues and brand inconsistencies due to the lack of cohesive style guides and interaction patterns. 

Key Pain Points 

  • Fragmented branding across regions 
  • Navigation difficulties affecting user journeys 
  • Inconsistent UI components 
  • Lack of cohesive style guide and design system 
  • Cross-platform usability issues 

Research & Discovery

Usability & UX Review

Usability & UX Review

Focused on identifying usability gaps and flow issues across the Juara Skincare experience.

Research AreasRegional heuristics, navigation, and checkout flows.
Key FindingsDiscoverability, navigation, and checkout issues.
Accessibility ChecksReadability, contrast, and interaction clarity.
User Behavior & Market Insights

User Behavior & Market Insights

Studied regional user expectations and content patterns to align the experience with user needs and industry benchmarks.

Analysis FocusUser preferences, discovery, and purchase flow.
Insights IdentifiedClear info, simple navigation, better trust.
Design OutcomeResearch-driven web and mobile wireframes.

Key Research Findings

~14%

Friction in product discovery across regions

~12%

Inconsistent interactions reducing conversion potential

~13%

Opportunity to streamline multi-region navigation

Before & After

Before

After

Fragmented sites with inconsistent UI and branding
Before and After

Click to view full screen

Unified, intuitive, and brand-consistent e-commerce experience
Before and After

Click to view full screen

Our Solution

We implemented a multi-region UX redesign, establishing a cohesive design system and polished final screens for both desktop and mobile, enhancing navigation, user engagement, and brand perception. 

 

Vector (8)
Regional UX Optimization
  • Tailored designs for Indonesia, New Zealand, and USA 
  • Localized content and interactions 
  • Improved navigation and purchase flows
Group
Unified Design System
  • Comprehensive style guide covering typography, colors, and UI elements 
  • Cohesive interaction patterns across regions 
  • Future-proofed for scalable updates 
Group (1)
Polished Web & Mobile Screens
  • Desktop and mobile optimized interfaces 
  • Intuitive shopping experience 
  • Consistent brand identity and aesthetic 

Measurable Impact

Task Completion
+13%

Task Completion

Improved navigation and product discovery

Before:70%
After:83%
Navigation Friction
–10%

Navigation Friction

Streamlined multi-region flows

Before:30%
After:20%
Customer Satisfaction
+12%

Customer Satisfaction

Cohesive design and intuitive UX

Before:68%
After:80%
Conversion Readiness
+11%

Conversion Readiness

Optimized purchase paths across platforms

Before:65%
After:76%
Component Reusability
+13%

Component Reusability

Unified design system for all regions

Before:0%
After:13%

Methodology & Testing

Heuristic Evaluation

Heuristic Evaluation

Identified regional UX issues

Wireframe & Prototype Testing

Wireframe & Prototype Testing

Iterative validation for web and mobile

Multi-Region Usability Testing

Multi-Region Usability Testing

Collected feedback from representative users

testimonial-element-top

Key Learnings & Insights

Regional Customization Enhances UX

Tailored experiences improve user engagement

Consistency Builds Trust

Unified design system reduces confusion and errors

Iterative Testing Reduces Friction

Feedback-driven iterations improve satisfaction

Scalable Design Enables Growth

Reusable components simplify future updates

Design Process Deep Dive

UX Steps Taken

UX Steps Taken

  • Heuristic evaluation and research 
  • Wireframing for multiple regions 
  • High-fidelity UI design for desktop and mobile 
  • Iterative prototype testing 
Deliverables

Deliverables

  • Style guide and design system 
  • Wireframes and high-fidelity screens 
  • Final web and mobile screens 
  • Regional UX adjustments 
Notable Decisions

Notable Decisions

  • Balanced brand identity with regional usability 
  • Optimized purchase flows for diverse audiences 

Implementation & Handoff

div (2)

Design Documentation

Annotated regional workflows and screens 

div (1)

Component Library

Reusable UI elements 

div

Compliance Guidelines

Developer alignment

Developer Handoff Process

Documentation

Annotated screens and component guidelines explaining design behavior and usage.

Assets

Final UI screens, design system components, icons, and interaction prototypes.

Collaboration

Structured walkthroughs and regular syncs to clarify interactions and resolve queries.

QA

Design reviews to ensure accurate implementation, consistency, and device states.
icon top.svg
icon top.svg
icon bottom
icon bottom

Ready to Transform Your Conversion Rates?

See how we can apply similar strategies to your product. Let's discuss your conversion optimization challenges and explore proven solutions.

hand icon