Toronto Cupcake Site
Toronto Cupcake Site
Website Audit and Redesign
Website Audit and Redesign



Problem
The original site suffered from several design and accessibility flaws and required a full-scale overhaul that focused on the local roots, cute aesthetics and delicious edibles created by Toronto Cupcake. The goal was to complete a full user experience audit and identify major flaws, and then fix these flaws to immediately improve the general user experience.

Methodology
Complete UX audit and identify major flaws.
Analyze nearby comptetitors and pinpoint strengths that can be applied to this site.
Design new user interface designed to be minimal, cute and functionally sound.


Methodology
Complete UX audit and identify major flaws.
Analyze nearby comptetitors and pinpoint strengths that can be applied to this site.
Design new user interface designed to be minimal, cute and functionally sound.


Methodology
Complete UX audit and identify major flaws.
Analyze nearby comptetitors and pinpoint strengths that can be applied to this site.
Design new user interface designed to be minimal, cute and functionally sound.
UX Research
To gain a better understanding of the pain points experienced by the company and the users, I conducted an audit of the existing site, analyzing the information architecture, navigation, general accessability (WCAG) and overall aesthetics.
UX Research
To gain a better understanding of the pain points experienced by the company and the users, I conducted an audit of the existing site, analyzing the information architecture, navigation, general accessability (WCAG) and overall aesthetics.
UX Research
To gain a better understanding of the pain points experienced by the company and the users, I conducted an audit of the existing site, analyzing the information architecture, navigation, general accessability (WCAG) and overall aesthetics.
Key Findings
There were a few key takeaways from the audit. They are described below in detail.
Quiet Assistant
The application should not present itself or its capabilities as super-human, but rather as a quiet assistant that runs in the background and assists only as needed. Think butler rather than supercomputer.
Respect Privacy
The data will need to be stored locally, on the device being used to run the application. Adhering to ethical guidelines and data protection policies will also be crucial to maintaining confidentiality.
Proper Guidance
Understanding the app's capabilities and limitations will prevent users from asking it to complete tasks outside its purview and inevitably becoming disappointed, thus leading to algorithm aversion.
Transparent Loop
Having a human-in-the-loop system to verify and correct the AI as it analyzes user data will rectify any misleading statements it makes while also training the AI to do better in the future.
Navigation & Structure
The navigation and structure are intuitive, but they are not easily identifiable. For example, the menu bar is hidden under an icon on the homepage. Buttons cannot be selected and there is little guidance on where to click.
Aesthetics
The design is not visually compelling. The pictures are of poor quality and do not attract attention. The accents on the site are also simple, with little thought to incorporate a cohesive brand look.
Accessibility
The site is not equipped for users with accessibility needs. The contrast in some areas scores around 4.35:1, which fails some color contrast parameters. General spacing between elements is also poor.
Interactivity
The site is mostly functional. All interactive buttons work as intended. The cookies pop-up is the only button that doesn’t work, as interacting with the buttons does not eliminate the pop-up.
Key Findings
There were a few key takeaways from the audit. They are described below in detail.
Quiet Assistant
The application should not present itself or its capabilities as super-human, but rather as a quiet assistant that runs in the background and assists only as needed. Think butler rather than supercomputer.
Respect Privacy
The data will need to be stored locally, on the device being used to run the application. Adhering to ethical guidelines and data protection policies will also be crucial to maintaining confidentiality.
Proper Guidance
Understanding the app's capabilities and limitations will prevent users from asking it to complete tasks outside its purview and inevitably becoming disappointed, thus leading to algorithm aversion.
Transparent Loop
Having a human-in-the-loop system to verify and correct the AI as it analyzes user data will rectify any misleading statements it makes while also training the AI to do better in the future.
Navigation & Structure
The navigation and structure are intuitive, but they are not easily identifiable. For example, the menu bar is hidden under an icon on the homepage. Buttons cannot be selected and there is little guidance on where to click.
Aesthetics
The design is not visually compelling. The pictures are of poor quality and do not attract attention. The accents on the site are also simple, with little thought to incorporate a cohesive brand look.
Accessibility
The site is not equipped for users with accessibility needs. The contrast in some areas scores around 4.35:1, which fails some color contrast parameters. General spacing between elements is also poor.
Interactivity
The site is mostly functional. All interactive buttons work as intended. The cookies pop-up is the only button that doesn’t work, as interacting with the buttons does not eliminate the pop-up.
Key Findings
There were a few key takeaways from the audit. They are described below in detail.
Quiet Assistant
The application should not present itself or its capabilities as super-human, but rather as a quiet assistant that runs in the background and assists only as needed. Think butler rather than supercomputer.
Respect Privacy
The data will need to be stored locally, on the device being used to run the application. Adhering to ethical guidelines and data protection policies will also be crucial to maintaining confidentiality.
Proper Guidance
Understanding the app's capabilities and limitations will prevent users from asking it to complete tasks outside its purview and inevitably becoming disappointed, thus leading to algorithm aversion.
Transparent Loop
Having a human-in-the-loop system to verify and correct the AI as it analyzes user data will rectify any misleading statements it makes while also training the AI to do better in the future.
Navigation & Structure
The navigation and structure are intuitive, but they are not easily identifiable. For example, the menu bar is hidden under an icon on the homepage. Buttons cannot be selected and there is little guidance on where to click.
Aesthetics
The design is not visually compelling. The pictures are of poor quality and do not attract attention. The accents on the site are also simple, with little thought to incorporate a cohesive brand look.
Accessibility
The site is not equipped for users with accessibility needs. The contrast in some areas scores around 4.35:1, which fails some color contrast parameters. General spacing between elements is also poor.
Interactivity
The site is mostly functional. All interactive buttons work as intended. The cookies pop-up is the only button that doesn’t work, as interacting with the buttons does not eliminate the pop-up.
Prototype
Prototype
Below is a fully functional prototype of a new site design, with better accessibility and overall improved user experience.
Below is a fully functional prototype of a new site design, with better accessibility and overall improved user experience.