Role
Lead UX Designer — Cross-Platform & Localization
Team
Wordbank → IATA · Cross-functional
Company
IATA
Timeline
2023
Tools
Figma, WeChat DevTools, bilingual spec annotations
The Challenge
Navigating a Closed Ecosystem.
Delivering aviation training to Chinese professionals required building inside WeChat, an ecosystem that fundamentally rejects Western mobile conventions. I identified two critical failure modes for this launch: designing the wrong UI patterns (the product feels foreign) or providing ambiguous specs (the implementation diverges from intent). Failing at either meant shipping a product the market would reject.
Architecture Before Pixels.
Designing from Western assumptions guarantees a product that looks great in a mockup but fails in production. As the sole designer, I spent two weeks auditing WeChat DevTools to define the technical boundaries before drawing a single screen. Instead of relying on Western design software, I architected the UI directly within a native Chinese microsite builder. I owned the complete pipeline—from platform research to bilingual handoff—functioning as the single design-to-implementation bridge for a cross-continental engineering team.
How It Got Built
Discover
- Platform-First Definition: Documented WeChat Mini-Program guidelines as strict architectural constraints before any UI work began—ensuring the design was platform-native from day one.
- Ecosystem Mapping: Audited Chinese mobile behavior to replace invalid Western assumptions, mapping out WeChat-specific navigation (QR flows, long-press menus, app-internal routing).
- Content Architecture: Audited the existing training structure and credential recognition requirements to align with Chinese market expectations.
Design
- Native Tooling Adoption: Architected the interface entirely within a native Chinese microsite builder to guarantee 1:1 component translation for the engineering team.
- Brand Localization: Adapted IATA's global brand identity to fit within the rigid constraints of the WeChat ecosystem, ensuring international brand trust remained intact for Chinese users.
- Daily Engagement Loop: Designed the UI flows and templates for "daily posts," creating a recurring content architecture tailored to how Chinese professionals consume media natively inside WeChat.
- Native Navigation Stack: Engineered a WeChat-native navigation flow (bottom tabs, flat hierarchy) rather than adapting Western browser-based patterns.
Ship
- Bilingual Engineering Specs: Delivered 100% of architectural annotations in both English and Simplified Chinese, explicitly removing implementation ambiguity across the language barrier.
- Cross-Continental Handoff: Executed a flawless handoff to the China-based engineering team, resulting in zero design-to-implementation discrepancies and zero QA rework.
- Live in WeChat: Successfully launched the localized training platform directly into the WeChat ecosystem, eliminating the need for any external browser dependencies.
What Got Designed
Campaign Localization
The Global Baseline: IATA's standard international marketing relies on a discount-led visual hierarchy and left-to-right English reading patterns, which underperforms in the Chinese digital ecosystem.
The Localized Architecture: The hierarchy was entirely reconstructed, not just translated. I redesigned the visual logic to align with Chinese market reading patterns and WeChat's high-density information expectations, placing the brand and the value proposition in a localized context.
Landing Page
WeChat-Native Architecture: The platform was built from the ground up for the Chinese ecosystem. By abandoning Western mobile patterns in favor of native bottom-tab navigation and CJK-optimized typography, the platform feels inherently local—protecting IATA's global brand equity without forcing foreign UX on the user.
Course Detail
Credential Recognition Strategy: The interface is fully localized, but the course titles intentionally remain in English to preserve their international credential value. Every element on this screen is a deliberate architectural choice prioritizing user trust over a default 1:1 translation.
About Page
Before
After
Bilingual Engineering Specs: What looks like a standard wireframe is actually the foundation of a zero-rework handoff. By delivering 100% of the architectural annotations natively in Simplified Chinese, I eliminated the translation ambiguity that typically breaks cross-continental engineering workflows.
What Shipped
I help teams build for markets and platforms that play by fundamentally different rules.
All Projects