Skip to content
All insights
Project story3 min read

Enclave: a coffee and coworking brand with a barista companion

A project story about building a specialty coffee and coworking website for two Metro Manila locations, with a menu, workspace rates, and Kopi, an AI companion.

  • Coffee
  • coworking
  • hospitality
  • Philippines
Enclave website, full page
Enclave on a phone

Hover the browser to scroll the live page capture.

Project
Enclave
Type
Client website
Sector
Coffee and coworking
What we built
  • Interactive signature drinks and a full menu by category
  • Coworking rates and room requests for the Makati space
  • Kopi, an AI companion for menu, branch, and room questions

A café that is also a workplace has two audiences who want different things: the person who wants a good drink in two minutes, and the person who wants a quiet desk for four hours. Enclave sells both, in Legazpi Village in Makati and at Bonifacio High Street in BGC. The website had to make a visitor feel the place before they arrived.

The brief was a website for specialty coffee, calm workspaces, and a community worth showing up for, with enough product structure to handle menu questions, space rates, and room requests.

The product problem

Hospitality sites tend to be a photo, a menu PDF, and a map pin. Enclave needed more than that:

  • two locations with different roles, a full café and coworking space in Makati and a grab-and-go counter in BGC;
  • a menu that is easy to browse by category, with best sellers marked;
  • coworking rates and meeting-room times that read clearly before anyone calls;
  • a brand that feels warm and local without turning into a stock-photo template.

Designing the first screen

The homepage opens on a generated café scene with a signature cup and Kopi, the brand's panda barista. A warm, serif-led headline sits on a cream palette with deep green accents, and the first screen offers two paths: order now, or explore the spaces. Three short proof cards cover coffee, workspace, and community.

Letting the menu be interactive

The signature drinks section is a rotatable cup carousel. Visitors can spin a cup, open it to see what is inside, and jump to the full menu by category: coffee, chillers, tea, refreshers, and food. Prices sit beside the drinks they belong to.

Two locations, two jobs

Enclave Main is presented as the full experience: menu, coworking spaces, meeting rooms, and events. Enclave Express is presented as the quick one: grab and go, quick bites, the same quality. A day-at-Main timeline walks through the morning launch, the deep-flow hours, the midday reset, and after-hours community nights.

Coworking and room requests

Open desks, private cubicles, meeting rooms, and flexible packages are shown with hourly rates and package prices. A room request widget lets a visitor choose a start time and a duration, and shows the total. The action reads "Request this time", which keeps the promise honest: it is a request, not an instant booking.

Kopi, the AI companion

Kopi answers questions about the best seller, nearby branches, room booking, and drink recommendations. It gives the brand a voice that is friendly and a little playful, and it is introduced as a companion instead of a generic chat box.

What the work reinforced

  1. Give each location a job. One brand, two clear roles, and no duplicate pages.
  2. Make the menu playable. A drink you can turn and open sells better than a list.
  3. Say what a request is. Room times that look like instant bookings create support work. A button that says "request" keeps the promise honest.

Continuing work

Enclave is a live site for a real brand, and the menu, rates, and spaces will keep changing. This story will be updated as the product grows. If you are building a hospitality or coworking site of your own, start with the two questions a visitor asks first: where do I go, and what will it cost?

Start a project

Planning a website of your own?

Tell us what the website needs to accomplish. We reply with an honest fit review and the right next step.