BACKGROUND: Supper chef is a fictitious cooking school catering to all skill levels. From novices to seasoned cooks, participants create a three-course meal in each hands-on class, guided by expert chefs. For this self-initiated project, I designed a Supper Chef website that allows users to browse and sign up for their favourite classes.

CHALLENGE: Available class sign-up websites have cluttered designs, inefficient systems for browsing classes, and lack enough information for users to feel confident in their decision-making.

GOAL: Design a user-friendly website by providing clear navigation, ample browsing options, and a straightforward checkout process.

RESPONSIBILITIES: Paper and digital wire framing, low- and high-fidelity prototyping, conducting usability studies, and iterating on designs.

DURATION: November 2021

LAUNCH PROTOTYPE

Usability Research

SUMMARY: I conducted user interviews, which I then turned into empathy maps to better understand the target user and their needs. I discovered that many target users treat recreational classes as a fun activity when they want to learn something new or jump outside of their comfort zone. However, many class-sign-up websites are confusing to navigate, and lack details on each class which frustrated many target users. This caused a normally exciting experience to become challenging for them, deterring users from successfully signing up for classes.

PAIN POINTS:

1. Navigation: Recreational class websites are often cluttered and overwhelming, leading to confusion in navigation.

2. Interaction: Locating call-to-action items can be challenging, resulting in users making errors, such as selecting the wrong buttons or, worse, leaving the website in frustration due to difficulty finding what they need.

3. Experience: Insufficient photos an information create uncertainty about class expectations, diminishing confidence in decision-making and depriving users of an immersive browsing experience.

Usability Study

I chose my favourite aspects of the paper wireframes to build a low-fidelity digital prototype, which was then used to test the website's functionality in a usability study.

STUDY TYPE: Moderated

LOCATION: Canada, remote

PARTICIPANTS: 10, ages 25-45 years old

LENGTH: 20-30 minutes

Usability Study Findings & Refinements

FINDING: 1. Text - Verbiage that was intended to convey a warm and inviting tone was actually confusing to some users. For example, 'How many chefs?' and 'Our Story' sounded ambiguous.

REFINEMENT: Simplified verbiage to 'How many participants?' and 'About us'.

FINDING: 2. Icons - The icons used to convey class difficulty were not intuitive for all users.

REFINEMENT: Replaced icons with wimple verbiage (i.e. 'Beginner', 'Intermediate', and 'Advanced'.

FINDING: 3. Typography - When viewing the Class Details and Order Summary pages, it was challenging to spot key information from a glance.

REFINEMENT: Implemented a greater variety in typography and font amongst headers, paragraphs, and buttons.

Final Design - LAUNCH PROTOTYPE

Takeaways

Throughout this project learned that imagery and icons can be useful tools in enticing users to engage with content and explore a website further. However I mustn’t rely on imagery and icons to guide the user flow. Being consistent with the typography and font used for different forms of information is key in building familiarity and confidence in users.