Why

Mokujiro works across Japan and Australia. The site was English only, which meant half of the people the studio talks to were reading it in their second language. The job was a Japanese version that reads as if it had been written in Japanese, on the same site, without a second site to maintain.

The setup in Framer

Framer's Localization add on carries the second language. English stays at the root, Japanese lives at /ja, and Framer writes the hreflang tags, the canonicals and a sitemap per locale. Case studies, products, lab entries and services are CMS collections, so each item's text fields took a Japanese value while slugs, images, dates and prices stayed shared.

Four parts of the site are code components: the language switcher, the update banner, the hero knowledge graph and the approach tabs. Each reads the active locale with useLocaleInfo and picks its copy from an English and Japanese dictionary in the code. Internal links inside those components get the /ja prefix from the same hook.

IBM Plex Sans, the site typeface, has no Japanese glyphs. The site custom code loads Noto Sans JP and places it behind Plex on Japanese pages, so Latin keeps Plex and kana and kanji use Noto. A one line script sets the html lang attribute before first paint, because Framer sets it after hydration.

How the Japanese was written

Machine translation gives coverage, not quality. Japanese readers notice within a sentence when text was written in English first, even when every word is correct. So the writing ran in three passes.

1. AI translated the English into Japanese. This pass only had to be complete.

2. AI read the Japanese alone, worked out what each sentence was trying to say, and rewrote it to say that. The English was no longer in the loop.

3. I reviewed every string. A lot still changed. The tagline and the studio description are my own words, not a translation.

The rules that came out of the review are simple. First person 私 on the studio pages, 当スタジオ on the legal pages. No dash punctuation. Product and service names stay in English. One fixed set of section headings across the service pages.

Pushing 779 strings

Framer's external agent cannot write localisation data, but the plugin API in the same session can. The drafts lived in a dictionary keyed by the English source, a script matched them to Framer's localisation sources, and one API call wrote each round. When the review changed a phrase, the fix was a dictionary edit and a rerun, not 779 manual edits.

Keeping the editorial judgement

To carry the corrections from the human review into the next round of translation, two skills were built in Claude Code.

The first writes Japanese. It reads four knowledge files first, a style guide, a glossary, approved sentences and the corrections log, then runs the three passes above and returns an English and Japanese table for review.

The second records the review. It logs the difference between draft and final as before, after and lesson, sends term decisions to the glossary and sentences used unchanged to the examples. When the same lesson appears three times it proposes an addition to the style guide. The log was seeded with the 151 rewrites from this project's second pass.

Every review feeds back into this loop, so the translation decisions accumulate as documents that can be reused rather than remembered.

The audit

Before launch a script fetched every page in both languages and compared them: untranslated strings, links from Japanese pages that pointed back to English, section order per breakpoint, meta tags and hreflang. It found a footer that overflowed on phones, a tablet layout where the footer sat above two sections, and a form label still in English. All three were fixed before the announcement.

What I would tell anyone doing this in Framer

• Localise code components in code, not through the panel. A localised value on a component's array prop can change how the component reads its own defaults.

• Set html lang yourself if any CSS depends on it.

• CMS enum options cannot be localised. Anything that must change language should be a string field or handled in code.

• Check every breakpoint after localisation. Japanese labels change widths, and rows that never wrapped in English may need to.