Léché Donuts
Role
Project Length
Tools
UX Researcher, UX Designer, UI Designer
1 Week
From the website: "Léché prides itself on having a unique offering and creating an experience for our valued customers. Our chefs are always a pushing to rethink what we know as donuts. Not only for desserts but stop by for a lunch when you are in the neighbourhood. We are excited for you to come by and indulge a little!"
Who is Léché Donuts
The Best Donut Shop in Montréal
Problem Space
I decided to redo Léché's homepage because there are several usability heuristic violations such as there is no system status, the design is not minimal and aesthetic, lack's a cart icon to let users know what is in it, and their is no direct and immediate call-to-action.
I didn't feel it was necessary to change their branding. They are a successful business and their branding is not the issue. The issue is how they present the information.
Current
Redesign
On the current site, you'll see the logo live as a small icon on the upper left hand corner. The brand's logo is it's identity. Because of this, and how it ties into the hero image, I wanted to proudly display it as it's the first thing a user sees when entering the site.
From a heuristic level, there is no visibility of system status. Each page is labeled but as you scroll, the nav bar remains but you can't see on the nav bar where you are exactly. By simply highlighting the location, the user will always know where they are on the website.
Not having e-commerce in 2023 is leaving a lot of business on the table. While Léché doesn't offer e-comm at the moment (this could be a future next step), it would be wise to engage in it through Shopify. This is why I added a cart on to their homepage. This also maintains consistency and adherence to standards.
Because there is a requirement for websites to be in French and English in Québec, I placed 'ENGLISH' on the navbar as that also maintains consistency and adherence to standards. Currently it's a tiny 'EN' on an even smaller bar sitting at the very top of the page.
Changelog 🍩
Current
Redesign
Current
Redesign
Changelog 🍩
Social proof is important. Locals may know about how great this delicious, decadent, delightful donut shop is but for newcomers, something that creates better buy-in and creates a better sense of urgency to try something is to see validation from other reliable sources. In the current site, the social proof is all the way at the bottom just above the footer and in a desaturated nature. Placing these logos at the very top and in their normal colours will allow for immediate recognition of other reliable brands thus building more trust and a desire to want to try it.
Changelog 🍩
On the homepage, there is seemingly a never-ending scroll to get to the bottom. Instead of having individual space for every single donut, to keep the design neat, usable, and decluttered, it makes sense to put them in a deck with horizontal navigation. This shortens the page length. Also note - this is the largest section of the page. This is an immediate draw to the call-to-action, "Shop Donuts". This process was also done for their "Nos Beignes d’anniversaire" and "Tourtières, tartes et quiches" sections lower on the page.
Current
Redesign
Current
Redesign
Current
Redesign
Current
Redesign
Current
Redesign
Changelog 🍩
On the current design, on that one screen, there are 7 CTA's. Prioritizing CTA's if they are necessary for the page works so long as they're spread apart. What was done in the redesign is removing of the embedded email capture as that can be moved to a pop-up (and it's already embedded in the footer). This eliminates one CTA. The other CTA's such as viewing the menu, their services, and contact can be removed as they are on the nav bar. A/B testing for this to test impact of removal could be a good idea. Directly under that, spreading social proof while prioritizing it are the testimonials which previously were at the bottom of the page.
How Might We?
After going through the homepage, my thought was simple: How might I redesign this page so that Léché can present their offerings in a succinct manner that would make usability of the site easier while maintaining brand integrity and identity?
Current
Redesign
Changelog 🍩
First thing that needed to be changed was the footer. Not because the information was bad, unnecessary, or poorly spaced or in accessible (I checked on WebAIM). I lightened it to match the branding more. The colour palette has a lot more muted tones so bringing the black up a bit fits better with the current theme. Also, while the 2 rows dedicated to Instagram may not be a lot, it does take up unnecessary space. Placing it in one row with horizontal navigation makes it easier
What's Next 🍩
I feel once these usability issues are solved and the information is organized, the user's experience of the website will match their experience when purchasing a donut from Léché. They don't just offer donuts - they offer culinary experiences. You know that by going in, ordering, and tasting these delicious donuts (and other products to be fair) but going on the current site shows a lot of discombobulation in information + hierarchy and it doesn't speak to the greatness of who they are as a donut shop especially the best one in the city.
Also - by having a more organized site, they could test running an e-comm site through Shopify which would not only bring in more revenue, it would be a lot easier for both consumer and business to do that instead of the current method of emailing in orders which is more time consuming and less efficient.
Thank
You