Slice Café Dublin Website Redesign - Communicating Brand Value & Enhancing UX
The Problem
Slice is a neighbourhood Dublin restaurant based in the heart of Stoneybatter, serving up tasty breakfasts, brunch, lunches, and private dinners with wine and of course lots of cake! They source all of their ingredients from small suppliers and cook up a simple, well-constructed menu with the best Irish ingredients available to them.
While their service is commendable and their support for local producers is important for the customers, their website doesn’t reflect their brand values. Their website has some fundamental UX issues and it doesn’t do a great job at communicating their brand’s identity to potential customers.
The Solution
In this case study, I will be going to break down their current website, evaluate each section and the overall structure based on web design best practices, and then attempt to redesign it based on my experience and knowledge.
The website needs 3 key solutions to achieve its goal of attracting customers. First, it needs to communicate the social proof that other people love to eat there. Second, they need a unique brand identity to effectively communicate their message. Third, the website should allow potential customers to be quickly be attracted by their offerings, and either make a booking or visit the place.
Hero & Top Navigation
Existing Design
|
What works here:
- Contact info at the top for easy access
- Quick call to action towards catering service
- Sufficient & useful links in the top navigation
What doesn’t work here:
- Close-up generic image of dish that doesn’t communicate anything
- No introduction about the place
- Disproportionate and generic logo
- Move to top arrow appears even though we’re at the top section
- No call-to-action with a business impact like ‘Make a Booking’ or ‘View Menu’
- Top navigation bar taking too much unnecessary space
- Full black background theme doesn’t convey the local support values
Proposed Design
Iteration 1
|
- I crawled over the google maps and found a really striking photograph of the cafe. So, went ahead with it for the colour scheme, style of fonts, and the overall vibe of dark blue and fluid nature.
- The current logo was too literal with the cake stand at the bottom. But the red neon slice written at the store front is by far the best mental image people will have for the cafe. So, I took inspiration from it, combined it with the playful yet readable ‘Bellota’ font, and we got ourselves a brand new logo for the website.
- Simplified the top navigation, reduced its width and added a subtle double struck to reinforce the brand logo style.
- The existing home page has a catchy introduction written in the middle somewhere like this:
- Slice Introduction further down the website
- The above text block has fundamental readability issues. Centred text is hard to read. Line length is too much. The background image takes focus away from the text. Too much information is thrown in one single block of text.
- So, in the iteration 1, I’ve changed that and taken the intro into the hero section.
- The photograph is given a bleed at one edge to indicate users to scroll down, and rounded at a single edge to show a friendly character thus balancing the corporate blue impression.
- Two call to action buttons are provided for users to either book via call or via email
Iteration 2
|
Major design decisions different from iteration 1:
- Moved the photograph to the top right thus giving a solid base at the bottom which aligns with the intro text block.
- Replaced the two CTA buttons with one ‘Book Now’ button that will open a modal to allow users to choose between a call or email thus reducing choice fatigue initially.
Customer Reviews
Existing Design
- Existing reviews section carousel
What works:
- 4 impactful reviews by customers
- Carousel is on autoplay so it’s a bit hard to read when it is running
- But it stops when you tap on the arrows
What doesn’t work:
- Large centred block of text is hard to read
- There are almost 739+ reviews on google maps and only 4 are shown here
- Needs more work on building strong social proof
Proposed Design
|
Leverage the existing social proof.
Since there are tons of google reviews with photos already present on google maps by trustworthy people who have real profiles and are local guides, it makes sense to display them as impactful social proof.
Also, a link to the google map reviews will allow visitors to view more reviews about the place.
Key Brand Value
Existing Design
|
Proposed Design
|
This section takes an interior photo of the ingredients within the cafe and conveys the message that they support local producers. This creates a far better impression on visitors and communicates the message proudly.
More Sections Coming Soon...