Concept project
This is self initiated concept work. No client engagement, no production deployment. The problem, structure, and execution are mine.
Senyu Fine Dining needed a website that matched the prestige of dining in person. Opulent dark aesthetic, full menu architecture, and an inline reservation system. The digital experience earning every table booking before the door opens.
Role
Web Designer
UI Design · Development
Timeline
3 Weeks
Concept through delivery
Scope
Full stack web
Design · Build · Deliver
Tools
Figma
HTML · CSS · JavaScript
The Challenge
Fine dining is sold on atmosphere before a single dish is served. This restaurant's food and ambiance were exceptional, but a generic website would send prospective guests straight to a competitor who could communicate that prestige digitally. Every pixel needed to justify the reservation.
The Gap
Most restaurant websites default to generic templates: stock photography, OpenTable embeds, and menus buried as PDF downloads. For a restaurant at this price point, that gap between digital experience and in-person experience doesn't just underperform. It actively erodes the brand before the guest arrives.
The Brief
Build a website that communicates luxury instantly, makes menu browsing an act of anticipation, and closes the reservation in a single seamless flow. No redirects off the site, no phone calls required.
Research & Discovery
I audited four restaurant website archetypes, from global luxury chains to independents fully reliant on OpenTable, to map where the fine dining digital experience consistently fails its audience.
Nobu
Strong brand presence and photography. But reservation flows split across markets and a fragmented menu structure dilute the luxury experience at the critical conversion point.
Zuma
Excellent visual staging and atmosphere. Navigation is confident. However the menu is PDF-gated and reservations route out to SevenRooms, breaking immersion at the moment that matters most.
Typical Independent
Template sites dominate: WordPress with a restaurant theme, stock photos, and an OpenTable widget. Nothing signals exclusivity. Nothing earns the table. The food has to do all the heavy lifting.
OpenTable Profile
Frictionless booking for the guest, zero brand control for the restaurant. The digital impression belongs to OpenTable, not the chef. For a restaurant competing on atmosphere, outsourcing that first impression is a brand liability.
| Criteria | Nobu | Zuma | Independent | OpenTable | This Site |
|---|---|---|---|---|---|
| Brand Atmosphere | Strong | Excellent | Weak | None | Immersive |
| Menu Experience | Moderate | PDF only | PDF / Hidden | None | Full inline |
| Reservation Flow | Fragmented | Redirects out | OpenTable | Off-site | Inline · 1 page |
| Mobile Experience | Good | Moderate | Poor | Generic | Optimised |
| Custom-built | Yes | Yes | No | No | Yes |
Research & Discovery
Two people use this website with fundamentally different intentions. Every design decision was tested against both: does this earn the diner's trust? Does this reduce the owner's dependency on phone calls?
Aiko Kobayashi
Marketing Director · Celebrating an anniversary
Background
Plans special occasions with research. Visits 3 to 5 restaurant websites before choosing. Expects the website to validate the decision: if the site feels cheap, the experience probably is. Has booked reservations online for 8 years and will not pick up the phone if an online option exists.
Primary Goal
Confirm the restaurant is worth the price before committing. Menu, atmosphere cues, and a frictionless booking flow are the deciding factors. She wants to feel the occasion before she arrives.
Pain Points
"If the website looks like a Squarespace template, I assume the attention to detail in the kitchen is the same."
Kenji Nakamura
Head Chef & Owner · 12-table omakase
Background
18 years in fine dining, opened his own restaurant three years ago. The kitchen is his domain. The phone, the front-of-house scheduling, and the reservation spreadsheet are not. Loses 4 to 6 hours a week to phone calls that could be self-serve. Has no technical staff.
Primary Goal
A website that handles reservations without him. No monthly OpenTable fee, no phone calls during service, no spreadsheet at the end of the night. The brand should feel as considered as the food he plates.
Pain Points
"I built this restaurant with my hands. The website should feel like I built that too."
Research & Discovery
Aiko's path from restaurant discovery to confirmed reservation, mapped against the friction points this site was designed to eliminate at each step.
Discovery
Google search · ~2 min
Action
Searches "best sushi restaurant [city]". Scans 3 to 5 results. First impression from the thumbnail image and meta description. Clicks the most compelling.
Friction
Most restaurant sites load slowly, display stock photography, and provide no immediate signal of quality. Bounce rate is high at this stage.
Design Response
Hero section: full-bleed food photography, clear name and positioning statement. The atmosphere is communicated in under 3 seconds.
Menu Evaluation
Browsing · ~4 min
Action
Navigates to the menu to check if there are options they'll enjoy and to validate price expectations before committing. Looks for item names, descriptions, and pricing.
Friction
PDF menus require download, can't be read comfortably on mobile, and have no design continuity with the brand. No pricing on some sites creates anxiety.
Design Response
Four inline menu categories (Nigiri, Sashimi, Specialty Rolls, Appetizers) with descriptions and pricing. Browsable on any device. A "Today's Special" section adds urgency and delight.
Building Conviction
Deeper browse · ~3 min
Action
Wants to know who is behind the food. Looks for a chef profile, the restaurant's story, any signal of craft and intention. Photography of the space helps visualise the occasion.
Friction
Generic "About" pages with no personality. Stock chef photography. No visual connection between the food and the person who creates it.
Design Response
Master Chef profile section with narrative biography beneath the reservation block. The chef becomes part of the reason to book, not an afterthought in the footer.
Reservation
Booking · <2 min
Action
Ready to book. Needs to select date, time, and party size. Expects the process to take under two minutes and stay within the same visual environment.
Friction
Redirected off-site to OpenTable or SevenRooms. The luxury aesthetic collapses the moment the third-party widget appears. Phone call requests in 2024 feel like a failure.
Design Response
Inline calendar-based reservation: date picker, time selector, party size, all on one page, no redirect. Confirmation stays on-brand. The entire flow takes under 90 seconds.
Design Process
01 · Information Architecture
Page Structure & Content Hierarchy
02 · Key Screens
Homepage Hero
Full-bleed dining room photography, gold-tinted headline, and a single CTA above the fold. Atmosphere is communicated before a word is read.
Menu Page
Four categories (Nigiri, Sashimi, Specialty Rolls, Appetizers) with photography, descriptions, and pricing. Browsable on any device without a PDF in sight.
Fine Dining Experience
CoreOur Story, four brand values, and the Master Chef profile. The emotional case for booking before the reservation form is reached.
Design Process
9 screens covering the full site experience, from the first impression on the homepage to reservation confirmation. Each screen is built around a specific guest or owner need.
Screen 1. Homepage hero. Full-bleed dining room photograph sets the tone before a word is read. Gold headline and "Go to Menu" CTA sit centre-screen; navigation is minimal: Menu, About, Contact, Reservation.
Screen 2. Menu page. Photography leads each category above a browsable item grid: Nigiri, Sashimi, Specialty Rolls, Appetizers. Name, description, and price for every item. No PDF, no redirect.
Screen 3. Fine Dining Experience. Our Story opens the page, followed by four value pillars and the Master Chef profile: portrait, biography, culinary philosophy. The chef becomes part of the reason to book.
Screen 4. Contact page. Location, phone, email, and hours in four equal cards for quick scanning. Full-bleed photograph with map pin and a "Ready to Dine?" CTA close the page.
Screen 5. Reservation Step 1, default state. Party size, inline calendar, and time slots on one screen. The 3-step progress indicator shows exactly what's ahead before the guest begins.
Screen 6. Reservation Step 1, selections made. Party size highlighted in gold, time slot chosen, Continue activated. The interface communicates readiness before the guest clicks forward.
Screen 7. Reservation Step 2, Your Details. Four fields only: first name, last name, email, phone. Enough to confirm and send a reminder. Back and Continue always visible.
Screen 8. Reservation Step 3, Special Requests. Optional textarea for dietary needs above a full booking summary. Everything reviewable before the single "Complete Reservation" CTA.
Screen 9. Reservation Confirmed. Gold checkmark, booking summary, and unique confirmation number. Two exit CTAs (Back to Home, View Menu) close the flow without a dead end.
Design Decisions
The decision to go jet black with antique gold wasn't aesthetic preference. It was competitive positioning. Every restaurant website in the reference set defaulted to white or cream. A full dark canvas made the photography the subject, created instant visual distinction, and signalled a level of craft in the design itself that translated directly onto the food. Gold (#C9A258) was selected for its warmth over the cooler yellows; it reads as earned, not decorative.
Every third-party reservation widget (OpenTable, SevenRooms, Resy) breaks immersion. The guest spends 4 minutes inside a crafted atmosphere, then clicks "Reserve" and lands on a generic white widget with corporate branding. The solution was a custom inline booking block: date picker, time slots, party size, and name/contact fields, all within the site's own design system. No redirect. The reservation completes without the guest ever leaving the page.
Before: 3rd-party widget
After: inline booking
A PDF menu is a failure mode. It requires a download, renders poorly on mobile, carries no brand continuity, and cannot be updated without re-uploading a file. The inline menu was designed as a content section, four tabbed categories (Nigiri, Sashimi, Specialty Rolls, Appetizers), each with item names, descriptions, and pricing displayed as a browsable grid. A "Today's Special" rotator sits above the menu to surface the freshest offering and drive return visits from regulars. The menu is the product catalogue and the closing argument simultaneously.
The decision to place the Master Chef's profile immediately beneath the reservation block was deliberate. At that point in the page, the guest has browsed the menu, considered the price, and is on the edge of committing. The chef's portrait, biography, and culinary philosophy turn a transaction into an occasion. It answers the question "is this worth it?" at the exact moment it's asked. A table reservation at a restaurant is partly a reservation with the person who made the food, the site makes that explicit.
Results & Impact
4
Menu categories, fully inline
Nigiri, Sashimi, Specialty Rolls, and Appetizers with item names, descriptions, and pricing. No PDF. Browsable on any screen.
0
Third-party redirects
The entire reservation flow (date, time, party size, confirmation) completes on a single page with no redirect to OpenTable or any external service.
Shipped
Delivered in 3 weeks
Responsive across all breakpoints. Gold-on-black. Every table reservation now begins here, and the site became the restaurant's best-performing front-of-house staff member.
Phone calls eliminated
The owner's 4 to 6 hours weekly of reservation calls during service shifted to a self-serve booking system. Every reservation that would have required a call now completes online, including during peak service hours.
Brand continuity
Every pixel of the guest's digital journey, from landing to confirmation, is inside a consistent luxury aesthetic. The first impression is now as considered as the last course. The site became part of the restaurant's identity.
Repeat visit incentive
The "Today's Special" rotator gives existing guests a reason to return to the site between visits. Regulars check for seasonal specials, converting what would have been a one-visit utility page into a lightweight engagement loop.
Reflection
With More Time
I would add a backend reservation management dashboard for the owner: a simple admin view showing upcoming bookings, party sizes, and contact details without requiring spreadsheet maintenance. The frontend reservation flow is complete; the missing piece is closing the loop on the owner's side so the booking data is immediately actionable. A confirmation email system with the same visual language as the site would also reinforce the brand post-booking.
What I Learned
Luxury digital design is not decoration. It is the systematic elimination of anything that contradicts the brand promise. Every redirect, every generic widget, every stock photograph is a micro-contradiction. The discipline of this project was resisting the convenient solution (third-party booking, PDF menu) in favour of the consistent one. The result is a site where no element breaks the atmosphere, because every decision was tested against the question: does this feel like the restaurant?