Rangitoto Tokyo

Rangitoto Tokyo is not an ordinary restaurant, and that is the whole point of this story.

Owner Wayne Shennen is a Certified Sommelier from the Court of Master Sommeliers, placed second in the New Zealand Sommelier of the Year 2017, and was selected by Wine Australia for its 50 Sommeliers of the World programme. He is the first New Zealander, and the third person in the Southern Hemisphere, to become an Advanced Certified Sake Professional.

Executive Chef Trevor Blyth is British born and classically French trained, with three Michelin star kitchens on his resume including La Gavroche under Michel Roux Jr. He has cooked for the past three British Ambassadors to Japan and appears as a guest chef on NHK World.

Since 2019 they have run Tokyo’s home for New Zealand wine: a dinner restaurant in Ochanomizu pairing French Japanese cooking with one of the deepest New Zealand cellars in the country.

Almost none of this was visible on their website.

The old site was a Wix template, built in 2019 and never redesigned. Our audit, run before we ever pitched, found a site actively working against the people behind it:

• The homepage loaded 84 script tags and had no H1 heading at all. The restaurant’s own name rendered as an H2.
• On a phone, the navigation did not collapse. All ten menu items stayed in one row of unreadably small text at 375 pixels wide. There was no hamburger menu of any kind.
• The Japanese version lived on a separate subdomain and was incomplete: navigation stayed in English, a whole page silently disappeared, and section headings went untranslated.
• The wine page of a sommelier’s restaurant contained no wine list. No producers, no prices, nothing a guest could read before booking.
• The two founders’ extraordinary credentials sat in long text blocks over busy photo backgrounds with no visual hierarchy.
• The newsletter widget had stopped rendering, leaving an empty box. The dinner menu was shown through a PDF viewer stamped with the words Free Version.
• Social sharing metadata still described the business as a cafe with an espresso service that had not existed for years.
• Structured data told search engines this was a generic local business, not a restaurant, with no menu or event markup.

None of this reflected the restaurant. All of it was fixable.

We approached Rangitoto Tokyo with the audit already done, and agreed to rebuild the site as one of our founding Tokyo projects. The brief we set ourselves: make the website tell the truth about how good this restaurant is, and leave the owner in full control of it afterwards, on infrastructure he owns, with nothing rented from a website builder.

We do not present clients with one take it or leave it design. For Rangitoto we built two full concepts: direction one, dark and cellar like, wine forward, with the bottle and the glass as heroes; and direction two, inspired by wine label design, with the mark framed and centered like a label on a bottle.

Wayne chose direction one, and it earned its keep through five major revisions, each snapshotted before we changed course.

The concept that was not chosen is part of this case study because it is part of the method: one of one means considered alternatives, not a single guess.

Everything is handcrafted. Plain HTML, CSS, and JavaScript. No frameworks, no page builders, no templates. Firebase provides hosting, database, authentication, and image storage under a single Google account that belongs to the restaurant, not to us. What shipped:

• A landing page that leads with the room, the credentials, and the story.
• A full menu page covering food, wine, sake, and the tasting menu.
• The complete 177 bottle wine and sake list, extracted from the restaurant’s PDF menu by a parser we wrote and tested for it, organized the way the cellar deserves. 165 of the 177 wines carry real Japanese names, not machine transliterations.
• Events with real detail pages: each winemaker dinner gets its own page with the story, the menu, the wines, and booking.
• A journal for news and stories, and a private dining enquiry flow feeding an inbox the owner reads in his console.
• A true inline language toggle. English and Japanese live on the same pages, switch instantly, and QA verified zero cross language leaks.
• SEO and AI discoverability done properly: restaurant structured data, a sitemap, robots rules, and an llms.txt file so AI assistants describing Tokyo restaurants get the facts right.
• A 301 redirect map covering every old Wix URL, so six years of links and search placement carry over instead of breaking.

The most important deliverable is the one guests never see. At /admin, behind Firebase authentication locked to the restaurant’s own account, is a ten tab console: food, wine and sake, by the glass, events, enquiries, journal, promotion, about, images, and hours.

Every edit autosaves as a draft. A preview button renders the draft exactly as the live site would show it. A publish button compiles everything into the single snapshot the public site reads. The owner can reprice a wine, post a journal entry, change the hours for a holiday week, or stage a whole event page, without touching code and without waiting for us.

During QA we also attacked our own security assumptions and found that the initial authentication rules were too permissive: a self registered account could in principle have gained write access. We locked writes to an explicit allowlist the same day and verified both the allowed and the denied paths against the live project. We publish this detail because trust is the product: the console now refuses everyone except the restaurant.

The site was not built at the client. It was built with him, across three structured feedback rounds after the first testing release:

• Round one added Japanese descriptions for every dish, staff photos and qualifications, an interactive map of New Zealand wine regions, an hours editing tab, and vintage and tasting note fields for the cellar.
• Round two shipped the full wine list, live within days of receiving the source menu.
• Round three split wine and sake onto their own page, added automatic linking for by the glass pours, delivered the per event detail pages and the private dining booking flow, and removed the last of the design phase scaffolding.

Every request that reached us shipped, and each shipment went out with a plain language email walking the owner through what changed.

From the production QA pass on the live build:

The old site loaded 84 scripts to show a broken menu bar. The new one loads a restaurant.