Self-directed concept build for an invented business. This project was not commissioned, and the company described here does not exist.
清水酒造 (SHIMIZU SAKAGURA)
A site for a 156-year-old sake brewery in Niigata that presents its sake, its history and brewery tours, built on a hand-written CSS design system.
Shimizu Sakagura is a sake brewery in Nagaoka, Niigata, founded in the first year of the Meiji era. The site had to carry 156 years of history and still make it easy to browse the sake, request a brewery tour and understand how the local water shapes the product. We built it in Next.js.
The
Challenge
Selling sake online usually means putting a tactile, historical product into a sterile web store. The challenge was to close that gap.
Turn 156 years of brewing history, Niigata snowmelt and the work of the Toji (master brewer) into a story people will actually read.
Explain sake varieties such as Ginjo and Daiginjo, and how to pair them, without overwhelming someone browsing the lineup.
Design a tour flow for a brewery with only a few tour slots a week, which its staff arrange by hand.
The
Constraints
What the build was answering, and where we stopped on purpose.
- THE BRIEF
- Self-directed, for an invented 156-year-old brewery. Our one rule was no utility framework, so every value on the page comes from a named token.
- SCOPE
- Eleven routes as a static export, with a hand-built CSS Modules design system and art-directed photographs colour-graded to the palette. The photography carries the design and most of the page weight, which shows in the mobile scores.
- NOT CONNECTED
- The shop is a storefront only. The cart shows zero and there is no checkout, and the tour reservation sends a request instead of holding a slot. A real brewery would connect its own systems at both points.
The
Solution
We built a restrained Next.js site with generous whitespace, careful typography and large photographs meant to suggest the clarity of good sake. The design stays quiet so the brewery's story and its products carry each page.
A dark palette built from named tokens (kuro, sumi, beni and kome) with no utility framework behind them. The type mixes Shippori Mincho, Playfair Display, Noto Serif JP and DM Mono, so traditional and modern faces share each page.
A Next.js App Router site exported as static HTML, styled with CSS Modules instead of a utility framework. Every page, including the lineup, the history and the tour page, is prerendered, and scroll reveals use IntersectionObserver.
Site
Walkthrough
The site opens with an age gate, so the first thing a visitor does is answer a question. Behind it, the hero shows a single bottle lit like a portrait in near-darkness, with no snowy mountain or barrel montage.
The home page shows two releases instead of the whole catalogue, one seasonal and one year-round. Each has its sweetness and body marked on a scale and its full price, and the rest of the lineup is one link away.
The history comes down to four numbers: 156 years, six generations, twelve varieties and forty-seven prefectures, with the long version behind a link. A brewery's age works as a credential, so it should be easy to check.
Tour details and the request form share one screen, with the place, times, price and bus from Nagaoka on the left and four fields on the right. The form sends a request instead of confirming a booking, because a brewery with three Saturday slots replies by hand.
The
Results
The site is a static export with hand-written CSS Modules and a large, art-directed image layer. The desktop scores reflect how lean the CSS is. The mobile scores reflect the images, which are the clearest thing on this build still worth fixing.
Measured against the live build with Lighthouse 13.0.3, median of three runs per preset.
Final
Reflection
Shimizu Sakagura tested how far restraint can carry a site for a traditional product. We kept the design quiet, focused on how the sake is made, and wrote the CSS by hand so every value comes from a named token. The storefront and the tour form stop short of a real store and booking system, since a real brewery would connect its own. The photography didn't work out as planned: it gives the site its atmosphere, and it also makes the mobile version slow.
Want a site like this?
We design and build websites for small businesses in English and Japanese. Tell us about your project and we'll reply within 24 hours.