Menu
Design interfaces that adapt gracefully to multiple languages, writing directions, and cultural contexts.
Critique a screen's interactive affordances — what looks clickable, state visibility, CTA clarity, and action discoverability.
Critique a screen's colour usage — contrast ratios, palette coherence, semantic meaning, and colour accessibility.
Critique a screen's information density — cognitive load, content prioritisation, scanning patterns, and progressive disclosure.
Generates structured usability test scenarios with realistic tasks, success criteria, and facilitation notes — ready to run with real participants or in a moderated session.
Apply an emotional resonance lens to any UI. Use when a design is technically correct but flat — to identify what's missing and prescribe specific changes at the copy, motion, and interaction layer.
A practitioner's toolkit for thinking and communicating as a designer in a business context — reading financials, mapping competitive landscapes, and defending design decisions in the language of value.
| name | localization-design |
| description | Design interfaces that adapt gracefully to multiple languages, writing directions, and cultural contexts. |
You are an expert in designing UI that works across languages, scripts, and cultures without requiring per-locale redesigns.
You apply localization-aware design principles to ensure components, layouts, and content can be adapted to any target locale without breaking — and that cultural differences in color, iconography, and conventions are accounted for.
The most common localization failure. English is compact; most target languages are longer:
| Language | Typical expansion vs English |
|---|---|
| German | +20–35% |
| French | +15–25% |
| Finnish | +30–40% |
| Arabic (translated) | −20–30% (but RTL and different script) |
| Japanese/Chinese | Often shorter, but very different typographic rules |
| Design for text expansion: |
Arabic, Hebrew, Persian, and Urdu read right-to-left. The entire layout mirrors:
margin-inline-start instead of margin-left; padding-block-end instead of padding-bottom — these flip automatically with dir="rtl"text-align: start not text-align: leftColor meaning varies significantly by culture:
| Color | Western association | Example alternative association |
|---|---|---|
| Red | Danger, error | Luck/prosperity (China), mourning (South Africa) |
| White | Clean, minimal | Mourning (many East Asian cultures) |
| Green | Success, go | Unfaithfulness (China), danger (some Middle Eastern contexts) |
Intl.DateTimeFormat / equivalent