Grupo Casanova

Casanova

  • Web Design
  • Design System
  • Branding

Grupo Casanova brings together three restaurants owned by the same family: a wood-fired pizzeria by the river, a fine Italian restaurant in Bairro Alto, and a pizza-by-the-slice spot near Príncipe Real. None of the three had ever existed as a shared brand, and there had been no website for close to two years.

  • UX/UI Designer
  • Through an agency
  • In development
Home page of the Grupo Casanova site, headed by the year the group started, above photographs of the three restaurants.
  • 89%

    OF PRE-DINNER SEARCH HAPPENS ON A PHONE

  • 1

    CLICK FROM LANDING TO THE MENU

  • 3

    HOUSES, ONE SELECTOR, NO DEAD END

Challenges

Invisible, and already full

Casanova is a wood-fired pizzeria by the river, open since 2000. Casanostra is a fine Italian restaurant in Bairro Alto, open since 1986 and going through its worst year on record. Pizza a Pezzi sells pizza by the slice near Príncipe Real. Same family, three separate places, no shared identity, and no website for close to two years. The client was explicit that they were not chasing more covers, because they were already full. The brief was narrower and harder to satisfy: stop the group being invisible.

Which is what makes the market data the whole argument. 69% of people open a restaurant site to order food and 51% to see the menu, 89% of the search that happens before dinner happens on a phone, and 69% leave when a site confuses them. A group with no site was not losing a few bookings. It was absent from the one place its customers look, and absent from anything Google could show about any of the three houses.

Casanova restaurant page: a photograph of the wood-fired oven under buttons to see the menu and book a table.

Process

Choosing the house is the whole funnel

Restaurant usability research names choosing a location, right after brand affinity, as the biggest driver of a restaurant site’s experience and its biggest point of failure. On one national pizza chain’s site, with the picker buried, 80 percent of visitors chose their food first and lost the order when the location step finally arrived. On a sandwich chain’s site, with the picker up front, completion reached 90 percent. So the three-house grid is not a decorative section partway down the page: it sits directly under the hero, the whole card is the click target, and an anchor bar on each house page puts Menu, Gallery, Reserve and Directions one click away, which is the direct answer to the 51% who come only for the menu.

The system went in before the brand did, as colour ramps measured on a nine-step scale with components referencing the ramps rather than any colour typed in by hand. When the real photography arrived, the provisional anchors were checked against it in a colour space that separates hue from lightness, and two of five were wrong: the pizzeria’s colour lives in its tiled walls at a dark step and the dining room’s in its mint chairs at a light step, and forcing both to the same middle step ignored where the colour actually exists in the room. The reservation widget, which arrives in its own green and white and cannot be restyled, was framed deliberately and labelled Reserve via The Fork rather than disguised as something native.

Casanostra restaurant page: dish photographs above the dish of the day with its price and a booking button.

Outcome

Five pages, two languages, and one decision that was not mine

The desktop reached five pages in Portuguese and English, three restaurant menus and a working component set, audited clean. The menu is a set of expandable categories bound to a single shared property, so the client can add or remove a dish in the site’s own editor without a designer reopening the file, and the link to Portugal’s official complaints book, a legal requirement for any restaurant, lives once in the shared footer that every page inherits rather than nine times by hand across three houses in two languages.

Two working sessions went into a dark mode built specifically for Casanostra: a second colour mode, the shared collection extended to carry it, and an eleven-screen dark version of the whole flow, all to hold a shade of green the client’s brand manual had never confirmed. One meeting ended it, because the client found black too heavy for the room. The work did not ship, and that is the right outcome: a client is allowed to decide what a room feels like more than a designer is. What stays open is the phone. 89% of the search happens there and the mobile was never designed in this project, so what is live on a phone today is implementation rather than design.

Pizza a Pezzi page: photographs of pizza by the slice above an ordering button and a note about the place.
Casanova food menu, with the antipasti section open and each dish priced.
Casanova drinks menu, with the aperitifs and house wine sections open and each drink priced.
The Casanova menu opened as an overlay panel, with the category tabs along the top.
Casanostra food menu, with the antipasti section open and each dish priced.
Casanostra wine list, with the white wines open and prices by glass and by bottle.
Contacts page listing the address of each of the three restaurants beside a map.
Privacy policy page, with the date of the last update above the first section.