Café 101 Coventry

Café 101

A considered digital experience for an independent café in Coventry.

Café 101 is an independent coffee and brunch spot in Coventry.

The brief was to create a single-page marketing website that felt editorial and considered rather than looking like another café template.

The website needed to do a few things well. Show the food, communicate the atmosphere, make the menu easy to explore, build trust through real customer feedback, and give visitors a straightforward way to book.

The design was built around keeping things simple and letting the café itself do most of the talking.

01. Research & Positioning

we started by looking at the café’s existing Google reviews and menu rather than beginning with the visual design.

The reviews gave a useful picture of what customers actually appreciated about Café 101. The brunch, coffee, welcoming service and cosy atmosphere came up repeatedly.

That shaped the tone of the website.

Warm, understated and confident.

It also influenced how the social proof was handled. Instead of writing exaggerated marketing copy about the café, the site uses real customer feedback to communicate what people already value about the experience.

The idea was simple: let the customers make some of the claims.

02. Art Direction

The visual direction is built around an obsidian and cream palette.

Deep blacks and warm neutrals form the main foundation, with a burnished brass accent used sparingly for calls to action and important highlights.

The accent colour is #c9a96e.

It appears selectively so that it has more impact when it does appear.

Typography combines Cormorant Garamond for large display headings with Inter for body copy and interface elements.

The serif gives the site an editorial character, while Inter keeps menus, booking information and supporting content easy to read.

Together, the two typefaces create a rhythm that feels closer to a small food publication than a standard hospitality website.

03. Structure & Information Architecture

The website was intentionally kept to a single scrolling page.

The experience moves through a small number of focused sections rather than trying to make the café feel bigger than it is.

The hero introduces the atmosphere.

The menu gives visitors a clear view of the food and drinks.

The booking section provides a direct route to making a reservation.

The reviews section establishes social proof.

The footer brings everything together with opening hours, contact information and location details.

Navigation is kept deliberately simple:

Menu · Contact · Book

Each item takes the visitor directly to the relevant section.

Large spacing between sections gives the page room to breathe and prevents the experience from feeling like a long document.

04. A Menu That Feels Curated

A café menu can quickly become difficult to browse when everything is presented as one long list.

Instead, the menu is organised using category tabs.

This lets visitors move between different parts of the offering without having to scan through everything at once.

It also gives the menu a more curated feeling.

The interaction is simple, but it makes a noticeable difference to how quickly someone can find what they are looking for.

05. A Website That Knows When the Café Is Open

The hero includes a live open and closed indicator.

Rather than displaying a static “Open today” message, the website calculates the current status from the café’s opening hours.

This means the information changes automatically throughout the day.

It is a small feature, but it gives the website a sense of being connected to the real business rather than being a static brochure.

It also answers a very practical question immediately:

06. Booking

The booking experience was designed around reducing unnecessary steps.

The visitor is presented with a straightforward form and a clear confirmation state once the request has been submitted.

There is no unnecessary account creation or complicated multi-step process.

The goal was to keep the booking interaction consistent with the rest of the website: simple, clear and easy to understand.

07. Reviews

Customer feedback plays an important role in the page.

The reviews section combines individual review excerpts with an aggregate rating, giving visitors an immediate sense of how existing customers experience the café.

Using real review content was important here.

The website doesn’t need to manufacture enthusiasm when the existing customer feedback already provides it.

08. Imagery

Photography was treated as part of the editorial direction rather than as decoration.

The image selection focuses on food and coffee with hard light, warm tones and strong contrast.

The images are given enough space to work on their own instead of being buried inside cards and UI components.

This helps communicate something that text cannot easily explain: what the café actually feels like.

09. Technical Implementation

The website was built with React and Tailwind CSS.

For the location section, Leaflet is used with OpenStreetMap tiles, avoiding the need for a proprietary map provider and its associated licensing requirements.

The site is fully responsive and was designed mobile-first.

Accessibility was considered throughout the implementation, including colour contrast, semantic structure and keyboard-accessible controls.

The result is a relatively simple technical stack supporting a straightforward experience.

10. What we’d Explore Next

The current design deliberately keeps motion restrained.

A future iteration could introduce a more developed motion layer, including subtle scroll reveals and more expressive hover interactions on calls to action.

We’d also explore a darker version of the interface that pushes the editorial direction further and gives the site a slightly more atmospheric, late-evening character.

Those changes would build on the existing system rather than changing the direction completely.

The Outcome

Café 101 didn’t need a complicated website.

It needed a well-designed one.

The final experience gives the café a clear digital presence, makes the menu easy to explore, communicates its atmosphere through photography and typography, and provides practical tools for checking opening hours and making a booking.

The design stays deliberately quiet.

The food, the coffee and the people behind Café 101 remain the focus.

Designed and engineered by Evuve.