.jpg)
Simple tearoom website to decrease phone calls and increase staff productivity
Koetsenhuis tearoom
Overview
When Koetsenhuis Tearoom needed a simple website to reduce phone traffic, I delivered a clean, mobile-friendly single-page design with all the important details. The menu is easy to update with an image, and the tearoom’s warm vibe shines through in the photos. It was a fun project to not only design the website but also build a strong brand identity and capturing the tearoom’s cozy feel through photos. All is done in a budget-friendly.
Goals
To build a simple website that reduce phone calls of potential customers.
Team
-
1 UX/UI Designer
-
1 Developer
Outcome
✔ Desktop prototype
✔ Mobile prototype
​✔ Brand identity & guidelines
✔ Professional photos​​
When
September - November 2023
My roles
-
UX/UI Designer
-
UX Writer
-
Brand identity
-
Photography
Tools
-
Figma
-
Miro
About them
Koetsen Huis is a tearoom is such a hidden gem in the heart of the forest of Bruges, so close to the planetarium, and three parking lots. A perfect place for families to enjoy delicious lunches or snacks in a cozy atmosphere. A delightful dining experience in nature.
.jpg)
The brand and theme they want to show is traditional Flemish. It shows on their logo, the building, and on the menu they serve.
.png)
Problems
The staffs are often overwhelmed with phone calls from potential customers about:
-
the opening hours
-
should they reserve the seats before arriving there
-
and other basic questions that they actually had shared on the Facebook page.
With the small group of staffs they currently have, this problem increases their productivity to the main task, which is to serve the customers who are present at he teahouse. ​
.jpg)
Solutions
Based on my UX research, most of the participants use mobile phones and desktops to search for places to drink or eat out. Therefore I design the website only for desktops and mobile phones.
Simple & one single page website
Since the owner has a limited budget and only the owner who handles the website. They expected me to design the website as simple as possible. So we came up with only one-single page website.
The menu shows various foods and drinks with their prices. To make it simple, the menu list is an image that the staff can upload. They just need to simply upload the image of the menu list. No need to edit the text of the menu or the price directly on the website.
-
To attract new customers
-
To reach wider potential customers
Location
Show the map and 3 parking lots nearby. To help users or customers to find the resto.
Description of the benefits for customers who come. For example discounts and loyalty cards to attract potential customers to come.
To gain users' trust to the tearoom house.
Aesthetic photos with high quality
Photos of the cozy tearoom and the friendly staff. This can show the resto is professional. Add also the description on the photos.
Goals
1
To reduce the phone calls about frequently asked questions (menu, services, opening hours, opening days)
4
-
To attract new customers
-
To reach wider potential customers
2
The staffs can be more focused on main tasks: preparing foods, drinks, and serving customers. ​
5
To improve customers' experience. When users can find the answer online, they don't need to wait in the phoneline.
3
To build their brand online
Easy to find online
Competitive research
I conducted competitive research where I observed some websites such as restaurants, cafes, and bistros. ​ I found out they have some basic elements and features:
​
1
The menus with good quality photos
4
Location and map
7
Contacts: how customers can reach them by phone, email, and social media
2
The services and menu they provide
5
Open hours
8
Reviews from their former customers
3
Photos and videos in good quality
6
Reservation and payments policy
Photoshoot
My client didn't have good-quality photos yet. To make their business look more professional, I did the photoshoot for them with my basic skill of photography. I'm always happy to help my clients if they need other creative services besides designing websites.
High fidelity & branding
I create the design system to smoothen the collaborations between UX/UI Designer and the developer.
The colors and fonts are also essential parts of this tearoom brand. To build a memorable brand image for their customers, I consider the colors and fonts that reflect their brand identity.
​
Fonts
-
Sofia font as titles. It looks vintage or traditional, just like the font on the logo. So it can show the personality of the Koensen Huis Tearoom visually.
-
Robota font: easy to read, accessible for people with visual trouble, can work well on desktop and mobile, widely used.
​
Colors
-
I choose the color that aligns with their logo with a traditional style
-
Brown and yellow are warm and earthy color palettes. Also, it can give a warm ambiance to the website just like the warm ambiance in the tearoom building itself.
.jpg)
.jpg)
What I learned
Be flexible
I planned to focus only on UX UI, but in real world my clients need me to do other things such as photography. Since my clients didn't have good-quality photos to show on their website, I could help them to provide some that resonate with their brand: traditional Flemish. That's why we do photoshoots and I edited the photos with a touch of their brand.
.
1.
2.
Combining two creative aspects
Combine UX/UI for a website and photography is so fun to do. I enjoyed being able to play multiple roles to solve their problems.