2024  ・  World Family English  ・  Education

Renewal Disney World of English Responsive Website

DWE-01-MainBanner
Project Goal

To ensure users can effectively and conveniently use the DWE website, we provide a consistent UI/UX design. We aim to clearly communicate product features and benefits to encourage potential customers' participation. Additionally, we incorporate feedback to achieve continuous quality improvement.

Team

Alinta Cheng (PM)

Nari Kim (UX/UI Designer)
Chihwei Huang (UX/UI Designer)
Wanju Shen (UI Designer)
Reneta Chang (Developer)

Tools

Figma
Confluence
Jira

My Role

I conducted UX research for the Korean DWE (Disney World of English) website, including site analysis, global UX pattern comparison, IA design, and wireframing. Based on this, I proposed a main page design with UX writing guidelines, a color palette, and typography. While my design was not implemented, my research became the foundation for the product team to design the Korean DWE site and later influenced the localization of the Hong Kong and Taiwan DWE websites.

I analyzed the purpose of each page on the existing website, formulated hypotheses from the user’s perspective, identified issues, and derived solutions.

Ico-Magnifier

Users feel confused about the location and have difficulty comparing products when exploring products. It also needs to make it easier for users to recognize the value of the DWE brand. We should improve the user journey for easier navigation. 
Enhance the content of the products and add features to facilitate comparisons of key elements. Increase brand visibility.

Global UX Benchmarking

The Korean marketing team wanted to apply packages and programs in a specific way within the UX/UI. However, this approach had the potential to hinder the user experience. To ensure users could navigate and understand the content more intuitively, I benchmarked effective UX patterns from global markets (Taiwan, Hong Kong, Japan) and derived an optimal UX/UI strategy tailored for the Korean market.

DWE-02-01-Global UX Benchmarking
Information Architecture Design

To improve the navigation structure of the existing website, I designed an optimal sitemap by referencing the UX patterns of global markets (Hong Kong, Taiwan, Japan) to balance the requirements of the Korean Marketing Team (KMT) with user experience. 
Additionally, I incorporated color bullets to clearly distinguish the improvement elements.

DWE-IA
Wireframe Design

Based on the improved Information Architecture, I developed a wireframe to visualize the optimized user experience.

Lo-Fi Wireframe

In the initial stage, I sketched Lo-Fi wireframes on paper to conceptualize the basic layout and flow. Then, based on these sketches, I created digital wireframes in Figma to refine detailed elements and enhance the UX/UI.

Mid-Fi Wireframe
UX Writing Guide

I proposed an initial guide, considering that UX Writing is not just text but a crucial element in designing user experience.
Although it was not reflected in the final design, I established a strategy to help users understand information more easily and take action through effective UX Writing.

DWE-Writing
Design Proposal

In this project, I was responsible for UX/UI planning and directly proposed the main page design concept. Focusing on enhancing user navigation, I aimed to effectively convey the brand identity while designing an intuitive UI. I established a style guide by defining the color palette and typography. To increase visual engagement, I incorporated full-size banners, card-style UI, and interactive elements. Although the final design was executed by the Hong Kong UI designer with some modifications based on the marketing team’s requests, the initial concept was designed to provide an optimized user experience aligned with UX principles.

DWE-Color
DWE-Typo
UX Strategy & Flow

I structured the information architecture to ensure users can naturally navigate the main page, considering the following flow.

1. Optimized CTA Buttons
Placed fixed CTA and consultation buttons to ensure accessibility and encourage consultation and purchases even while scrolling.
2. First Impression
Designed the first screen to convey brand identity by featuring children using the product, intuitively showcasing the joy of learning.
3. Communicating DWE’s Core Values
Highlighted the brand’s unique selling points with custom-designed icons to maintain brand identity consistency and used a card-style UI for easy comprehension.
4. Learning Experience Aligned with Growth Stages
Illustrated the natural progression of English learning based on a child’s growth. Added an interaction where cards extend in height on hover to intuitively represent the concept of ‘Up & Down’ in learning.
5. Demonstrating Learning Methods and Effectiveness
Used a carousel format to prevent information overload, displaying one card at a time. Enhanced credibility and understanding by incorporating real images of the learning materials.
6. Clarifying the Difference Between Course Materials and Club Services
Provided two buttons—Disney World English vs. World Family Club—for an intuitive understanding of each service. Implemented an interactive feature where clicking a button dynamically changes the displayed content.
7. Emphasizing Real-World Use Cases
Showcased real children using DWE through videos and social media content. Designed as a carousel for effortless browsing of various testimonials.
8. FAQ Placement
Positioned FAQs at the end of the page to answer potential final questions, preventing user drop-off.
DWE-mockup-web

Selected Works

Disney World of EnglishResponsive Web UX
Hyundai FinanceMobile Web
P.pool BetaVideo Communication Service
National Health Insurance ServiceGUI, Interaction Design
Chang Sung E&CDesign Proposal
JollypongDesign Proposal
Rabbit Under AttackUI/UX, Illustration