← projects/WHERE slug = 'innovemia'
row 4 of 4
Education platform
Innovemia Academy
A multilingual academy site, built so the localisation reads as native rather than translated.
- slug
- innovemia
- kind
- Education platform
- year
- 2024
- role
- Frontend developer
- stack
- Next.js, i18n, Sass, Responsive design
- repo
- NULL
Innovemia Academy is an education platform serving more than one language. I built the front end in Next.js with i18n routing and Sass.
01The problem
Most multilingual sites are designed in one language and then have the others poured in. The failure is always the same: a layout tuned to English breaks the moment the words get longer, and navigation is where it shows first.
Translated copy commonly runs 20 to 35 per cent longer than English. A nav item that fits exactly, or a button sized to its label, is a layout bug waiting for a locale switch.
02What I did
I built every component to be indifferent to string length: no fixed widths on anything holding copy, wrapping permitted where it would otherwise overflow, and headings tested against the longest locale rather than the shortest.
Routing and metadata were localised together, so each language got proper URLs and correct document metadata instead of one canonical language with the rest treated as variants.
I checked layouts by switching locale rather than by resizing the window. Different failure, different test.
03On reflection
I would set up a pseudo-locale that pads every string by a third and run it in review. Catching expansion bugs before translation arrives is much cheaper than finding them after.