UI/UX Designer • Project Lead

Toronto Cupcake

A website redesign for a cupcake shop focused on improving product browsing and visual clarity. Inspired by clean, product-driven layouts, the redesign organizes items into a structured grid with clearer hierarchy, consistent spacing, and simplified navigation. The interface highlights each cupcake with better imagery, pricing visibility, and easier add-to-cart interaction, creating a more intuitive and enjoyable shopping experience.

01. Overview
Toronto Cupcake is a product-heavy e-commerce website with a wide variety of items, but the original design lacked clarity, structure, and an intuitive shopping flow. The redesign focuses on improving usability, strengthening visual hierarchy, and creating a smoother customer journey.

02. Problem
Before the redesign, the website presented products without clear organization or guidance. Interactions were unclear, key actions were not properly signified, and the navigation disrupted the shopping flow. This made it difficult for users to browse, understand how to interact with elements, and complete purchases efficiently.

03. Design Process
The process began with analyzing usability issues based on design principles such as affordance, signifiers, and mapping. Low-fidelity wireframes were created to restructure the layout and improve interaction flow. These were then refined into high-fidelity designs with a clearer grid system, improved navigation, and more intuitive interaction patterns.

04. Solution & Results
The redesign introduces a clearer structure with better categorization and a more intuitive cart system. Features such as visible quantity controls, a pop-up cart, and improved button placement create a smoother flow from browsing to checkout. These changes enhance usability, reduce confusion, and support a more efficient and user-friendly shopping experience.