Lette Macarons

The LA based macaron shop "Lette Macarons" have several stores and a website to order macarons and other products online. The company definitely has some quality products, but their current website 'Lette is not the best experience.Definitely not the experience you want for quality products like these.


Adobe Photoshop



Pen and paper

Goal: I found through research the frustrations with the order online process and the user flow for purchasing online. The site needed to be redesigned both architecturally and visually. I worked on the site with new ordering flow, new wires and new design. Also, created a mobile site.

Pain points

I conducted my own heuristic evaluation of the site based on Nielson's criteria: learnability, efficiency, memorability, error management, and satisfaction (or delight.) I also did a set of user interviews and evaluated task scenarios for users to complete on the ‘Lette site. Through these methods I gained a lot of useful feedback and observations:

  • You see a very confusing navigation and a lot to read at a first glance

  • You don't see all the flavors at one glance 

  • Shipping or pick up, causing a dilemma after I have already chosen online shopping as my option

  • Shipping policy is not clear and conscise and price missing during checkout process

  • The visual design is overwhelming and distracting

  • What is the difference with gift boxes under the order online tab VS gifts and parties tab

  • There are too many order online links in multiple places

  • There is no FAQ section, that's missing

  • Users would want to abandon their carts when required to make an account to proceed

  • When you go to the shortbread cookies page for example, you are confused between 2 redundant online shopping links

  • When you click on the online shopping button in the shortbread cookies page, you expect to directly go into shopping online. But it takes you to the online orders tab which then asks you you want to shop online or do a store pick up.



One area of interest that seemed to resonate with users is that macarons are an accessible, luxurious treat that make a great gift.I detailed out one task scenario into a journey map to highlight some of the pain points. 

Restructured navigation

Researched comparable brands and sites like the few below:

  • Laduree

  • Chelles

  • Lady Yum

  • Ma-ka-rohn

The insights and research lead me to focus on the following:

  • Streamline the ordering process

  • Reduce the multiples ways to get to online shopping

  • Make navigation more clear and simplified

  • Add a guest check out

  • Add FAQ as part of navigation

  • Rework the overall visual

Screen Shot 2019-11-12 at 7.53.40 PM.png
Screen Shot 2019-11-12 at 7.54.25 PM.png
Screen Shot 2019-11-12 at 7.52.10 PM.png
Screen Shot 2019-11-12 at 7.52.34 PM.png
Screen Shot 2019-11-12 at 8.54.12 PM.png
Screen Shot 2019-11-12 at 8.54.20 PM.png
Screen Shot 2019-11-12 at 9.53.09 PM.png

I used site maps and card sorting to simplify the navigation and make sure the content is structured in a way that considers the most important information first. In the original site map, a wide navigation leads you to pages with a lot of text. I started by running a card sort test with users to prioritize what was most important to the potential ‘Lette visitor.  The new site map condenses the amount of navigation tabs by housing all of the available items for purchase under “Shop Online.” The sub categories “Parties and Events” and “Limited Edition” give ‘Lette the flexibility to expand within these categories as their product list expands. An FAQ page was added at the bottom to answer users questions, so each page can be as straightforward as possible. At the moment there is not a single source on the site where a customer can go to, for questions on shipping, cancellation and so on.

Sign in
About/Our Story
Printed Macarons
Shortbread cookies
Open a store
Contact info
Screen Shot 2019-11-19 at 10.58.57 PM.pn

Current Lette site


press to zoom

press to zoom

press to zoom

press to zoom

Lette site redesigned

Rework of the shopping experience

The new check out process is simplified to one flow, and the choice between shipping or pick up in store is a button right before you add your item to the cart. One of the biggest and most important pain points to address was users not seeing the shipping price until the final step in the process before payment. In the new process, the shipping price appears immediately once you chose shipping and review order. The other being the confusion between gift and parties vs online shopping has also been addressed.

Screen Shot 2019-11-20 at 1.57.13 PM.png

Rework of the mobile experience

If you compare the letter mobile site they don't even have one. They use the regular desktop site for mobile. For what their business goals are and keeping in ind the way people use their mobiles for everything I thought I should definitely create the mobile experience. 

Screen Shot 2019-11-26 at 1.42.06 PM.png
Screen Shot 2019-11-26 at 1.42.34 PM.png
Screen Shot 2019-11-26 at 1.42.25 PM.png