Cross-Border
E-Commerce Redesign

Cross-Border
E-Commerce Redesign

Cross-Border E-Commerce Redesign

Bridging the gap between Asian and Western e-commerce experiences: Mamaway serves a global audience, yet disparate consumer behaviors meant our Western users struggled with an interface designed for Asian markets. This friction directly impacted conversion rates. To resolve this, we embarked on a systematic problem-deconstruction process to redefine the browsing experience for Europe and North America.

ROLE

ROLE

Web Designer

Web Designer

Visual Identity

Visual Identity

DELIVERABLES

DELIVERABLES

  • Visual Direction

  • UX flow

  • Responsive Web

  • HTML / CSS



  • Visual Direction

  • UX flow

  • Responsive Web

  • HTML / CSS



Year

Year

2018.6

2018.6

PLATFORMS

PLATFORMS

Adaptive Web Desktop, Mobile

Adaptive Web Desktop, Mobile

Introducing

Introducing

Global E-Commerce UX/UI Overhaul

Global E-Commerce UX/UI Overhaul

Core Challenge

Core Challenge

As a leading mother-and-baby brand, Mamaway faced conversion bottlenecks when entering European and American markets. Due to significant differences in browsing behavior across the two markets, the existing Asian-style e-commerce operating habits differ greatly from those in Europe and the U.S., resulting in excessive cognitive load for overseas users and making it difficult for them to quickly find the products they need. We initially defined three key optimization directions:

As a leading mother-and-baby brand, Mamaway faced conversion bottlenecks when entering European and American markets. Due to significant differences in browsing behavior across the two markets, the existing Asian-style e-commerce operating habits differ greatly from those in Europe and the U.S., resulting in excessive cognitive load for overseas users and making it difficult for them to quickly find the products they need. We initially defined three key optimization directions:

1

Brand visuals are out of focus

The new logo and inconsistent color scheme across the platform or touchpoints result in unclear brand recognition, making it difficult to build a professional and trustworthy brand image in overseas markets.

2

Confusing information architecture

A lack of a clear information hierarchy has caused the product’s value proposition to be communicated unclearly, and the high bounce rate directly reflects users getting lost in the shopping guidance flow.

2

Localization depth is insufficient

An internationalized website is not just about language translation; it also means arranging the interface layout to match overseas users’ goal-oriented, concise shopping habits.

1

Brand visuals are out of focus

The new logo and inconsistent color scheme across the platform or touchpoints result in unclear brand recognition, making it difficult to build a professional and trustworthy brand image in overseas markets.

2

Confusing information architecture

A lack of a clear information hierarchy has caused the product’s value proposition to be communicated unclearly, and the high bounce rate directly reflects users getting lost in the shopping guidance flow.

2

Localization depth is insufficient

An internationalized website is not just about language translation; it also means arranging the interface layout to match overseas users’ goal-oriented, concise shopping habits.

Break Down Step By Step

Break Down Step By Step

E-Commerce Evolution

A Cross-Regional Approach

Before the project officially began, to better understand the pain points of overseas users, I worked closely with the PM. Together, we broke down the complex experience challenges into actionable design goals. Below is the overall planning process from problem definition to solution implementation:

Before the project officially began, to better understand the pain points of overseas users, I worked closely with the PM. Together, we broke down the complex experience challenges into actionable design goals. Below is the overall planning process from problem definition to solution implementation:

Project Planning Phase

Project Planning Phase

Defining Process and Visual Optimization Directions

Defining Process and Visual Optimization Directions

Experience Planning

Experience Redefined

Segment-Based Content Delivery

After consolidating customer service feedback and market research, we focused our design priorities on “brand consistency” and “regional adaptation.” We didn’t just adjust the interface visuals; we also developed four core design principles tailored to the shopping decision-making paths of different markets:

After consolidating customer service feedback and market research, we focused our design priorities on “brand consistency” and “regional adaptation.” We didn’t just adjust the interface visuals; we also developed four core design principles tailored to the shopping decision-making paths of different markets:

Strategy and Execution

Strategy and Execution

Refer to the new identity and unify the brand’s visual language

Centered on the new logo, we redesigned the complete brand visual guidelines, from the proportional use of the primary color palette to the redefined typographic hierarchy, ensuring users experience a consistent and professional brand identity across every touchpoint.

# Unified Visual System

A flexible layout tailored to regional habits

Asia region: Adopts an "exploratory layout" that emphasizes new product trends and rich visual appeal, catering to shoppers who enjoy browsing and comparing.

Europe and North America: Adopts a task-oriented layout, centered on function-based categories, offering simple and intuitive navigation to speed up decision-making.

# Localization User Habits

Enhance the information architecture and tagging system

Rework the semantic logic of product categories, replacing vague labels with more guidance-oriented descriptions to reduce users’ cognitive load when filtering products and directly improve conversion rates.

# Optimizing the Tagging System

Build a content delivery mechanism for segmented audience groups

Adopt a user-tagging approach. Based on user status (e.g., trying to conceive, pregnant, new parents), optimize EDM and homepage content presentation to provide precise, personalized parenting advice.

# Building Personalized Services

Optimize the newsletter subscription system, provide personalized content based on user identity (such as parents of infants, pregnant women, etc.), and integrate product information tagged on Instagram

Optimize the newsletter subscription system, provide personalized content based on user identity (such as parents of infants, pregnant women, etc.), and integrate product information tagged on Instagram

Designed the site's full range of pages, including the shopping system, pregnancy journal, product reviews, and pregnancy encyclopedia articles.

Designed the site's full range of pages, including the shopping system, pregnancy journal, product reviews, and pregnancy encyclopedia articles.

Learning and Reflection

Learning and Reflection

Through this process of working with the project manager to break things down and design the implementation together, I learned the following important things:

Through this process of working with the project manager to break things down and design the implementation together, I learned the following important things:

Brand consistency requires deliberate management.

If product presentations across different regions lack a consistent visual and tone-of-voice strategy, the brand image can easily become blurred, and may even feel fragmented in user's minds. A brand is not just a set of standard fonts and colors, it is a cognitive experience that transcends contexts.

Architectural design should prioritize users' search and understanding logic

A cumbersome information architecture and confusing navigation can frustrate users. We’re not just designing screens; we’re designing the map in the user’s mind.

Europe and North America: Adopts a task-oriented layout, centered on function-based categories, offering simple and intuitive navigation to speed up decision-making.

Localization is not translation; it is cultural understanding.

Asian users and users in Europe and North America differ significantly in their information preferences and usage contexts. If you simply apply a one-size-fits-all template and ignore cultural background and contextual differences, you may instead weaken users' trust and engagement.

Integrating the user experience flow is more important than adding new features

Design is not about piling on features, but about providing clear guidance and reducing cognitive load. Too many decision points and a lack of feedback mechanisms will weaken users’ motivation to complete tasks.

Defining the problem is more important than the solution.

When there is no clear information or team consensus, designers should proactively clarify requirements and establish a shared language. The real value of design is helping the team identify the right problem, rather than just creating a polished interface.

COPYRIGHT © CHIEN-YI CHU ALL RIGHTS RESERVED

Create a free website with Framer, the website builder loved by startups, designers and agencies.