Restaurant

A website concept for a Mediterranean restaurant: it lets the photography speak, makes the menu easy to read and leads straight to booking a table.

Sector
Restaurant
Type
One-page website
Sections
Opening, menu, dining room and hours
Typefaces
Newsreader and Hanken Grotesk
The restaurant concept on a computer: the headline “Market cooking, kept simple”, the buttons to book a table and see the menu, the hours and a large photograph of a white dining room with wooden tables.

What this concept explores

What people choosing where to eat need, and how a website can answer.

People choose a restaurant mostly by what they see on the table and in the room. Anyone looking for somewhere to eat wants a sense of the atmosphere, a look at the menu and an easy way to book a table.

The concept gives the main space to photography, presents the menu like a printed one, with clear prices, and keeps the button to book a table within reach at all times, with no effects or decoration to distract.

  • Get a feel for the place from the first image.
  • Read the menu and prices without downloading anything.
  • Ask for a table in one tap, from a phone too.

A design exploration created by ELEVA. It is not a client commission: the menu, prices, hours and photographs are examples.

Design decisions

Three decisions so the website feels like going there.

Detail: three photographs of dishes in columns, chargrilled octopus, seasonal tomatoes and steamed mussels, each with the dish's name in italics.

Photography in the foreground

Large landscape images of the room and the dishes, with one colour treatment so they read as a single series. The text supports them; it doesn't compete.

Detail: the sample menu in three columns, to start, from the sea and rice and desserts, with each dish's name, a line of description and the price aligned to the right.

A menu that reads like a printed one

Three columns, clear names, one line of description and the price aligned to the right. It's text on the page, not an image or a PDF: it reads well on a phone and can be updated in moments.

Detail: the sample hours on a light card, with the “Book a table” button, and beside it a photograph of a laid table and the sample address with the “Get directions” button.

The hours and “Book a table”, together

The hours sit beside the button, so nobody has to look for them before deciding. On a restaurant's website, the button leads to the channel it already uses: its phone, its email or its booking platform.

Identity

A light stone background, charcoal text and a single olive accent. An editorial typeface for headings and a very legible sans-serif for the menu.

Stone#F3EFE7
Sand#E9E2D5
Charcoal#24211D
Olive#5A6136

Market cooking, kept simple.

Fish of the day, vegetables from the market garden and olive oil. A short menu that changes with the season.

Newsreader, an editorial typeface made for reading, for the headings; Hanken Grotesk for the menu, the prices and the hours.

A table laid with a white cloth, glassware and a lemon, in the sunlight. Chargrilled octopus on a white plate. Wicker chairs and a round table in a white dining room.
Photographs from Unsplash licensed for commercial use (Kim Schouten, Guillaume de Germain, Paolo Bici, Molly Keesling, Iñigo De la Maza and Lisha Riabinina), with one shared colour treatment. They are stock images and don't show any actual restaurant.

The whole page

Scroll inside the window to go through the concept from top to bottom, as it looks on a computer.

A full capture of the concept: the opening with the dining-room photograph, the cooking in one sentence, the menu with dish photographs, the room, the hours with the “Book a table” button, the sample address with “Get directions” and the footer.

Or open the concept and browse it.

On a phone

On a phone, the photography stays up front, the menu falls into a single column and the button to book a table is always within reach.

The opening on a phone: the headline, the buttons to book a table and see the menu, the hours and the dining-room photograph.
The menu on a phone: the dish photographs, one under another, with each dish's name.
The hours on a phone, with the “Book a table” button on the card and in the fixed bar at the bottom.

Real screenshots of the concept on a 393-point-wide screen.Open it on your phone