What is internationalization in UI, and what breaks when you only design in English?

Internationalization (i18n) is the engineering and design work so the product can support multiple languages and regions without a rewrite. User-visible strings must live in resource files or a CMS, not be scattered as literals. Layout: German labels are longer, Japanese may need more line break control, and right-to-left (RTL) languages (Arabic, Hebrew) need mirrored navigation and flow in many patterns, not only text alignment. Use logical properties in CSS (`margin-inline`, `inset` terms) to reduce left/right hard-coding. Dates, numbers, and currency: use locale formatters, not a single US pattern. Design review: do not design fixed-width fields that only fit 'City'. Icons with arrows, chevrons, and maps may need a mirrored variant. Translators add context, not a secret decoder ring for a string with five ambiguous placeholders. Pseudolocales (long, accented) can stress test overflow before you ship German.

i18n = structure
l10n = real translations
t('checkout.title')  // not hard-coded in JSX everywhere

Start simple: try this concept in a tiny project before moving to advanced tools.