Timeline
-
September - November, 2021
My role
-
Solo student project for GBDA 228 - Digital Imaging Online Apps
PROBLEM
Lack of Navigation and Alignment
When I go into the website to buy or research products, I find that the website should be easy to navigate and eye-catching to attract customers. Since the "Toronto Cupcake" brand website lacked navigation and contents alignment, it was hard to stay on the page although they had good cupcakes.
Organizing website structure is key!
SOLUTION
Orignal Sitemap
There are many unnecessary main pages where it would be better to be as sub-pages, making it hard for users to find what they were looking for.
Redesign Sitemap
I gathered related contents together, making it into sub-pages that users could reach the information more accessible and increase the readability.
Main Page Original
Main Page Redesign Mockup
-
The initial product’s logo design was chaotic and disorganized, misleading the user’s attention. The eight repetitive logos was decided to be simplified into one to solve this visual design problem.
​
-
There was a light pink square box that was also included, displaying the date. In this use case, it isn’t necessary for a cupcake shop to include this in their branding. To emphasize the company’s brand, I replaced the initial graphic with product photos, including brief descriptions, menu, and current trends.
​
-
I followed the color scheme the brand initially had, which is pink and white, but I also added light yellow color to deliver a warm baking feeling to the user.
About Page Original
About Page Redesign Mockup
-
It used too much white space and disorganized design structure, and the written information was tight together, so the user could not feel the charm to read.
​
-
I redesigned the page more colourful with adding more pictures, and reducing some white space to make it more attractive.
Menu - Holiday Page Original
Menu - Holiday Page Redesign Mockup
​
-
I made the image's alignment and direction even, so users could easily see menus increasing usability and looking prettier in design.
Contact Page Original
Contact Page Redesign Mockup
​
-
The contact page of the site was cluttered with information and had a bad use of whitespace.
​
-
I reorganized the information into two sections: one for the social media links and the other for location & contact. This will allow the user to find the information they’re looking for quickly at a glance.
For more work inquiries, or to grab a coffee do email me at c22kang@uwaterloo.ca ✨
​
Thank you for reading! ðŸ§
