Challenge
Challenge
Design a device agnostic digital menu for a beachside snack shop
Embedded Files
The product:
Chicy Tiki is a Beachside Bar and Grill concept. The typical user is between 18-60+ years of age. Chicy Tiki’s goal is to give families, beachgoers, tourists, locals, couples, and people coming by for special occasions a taste of the tropics and to make ordering and reservations simple and easy while hanging out on the coast.
Project duration:
March 2023 to April 2023
Study type:
Unmoderated usability study
Location:
United States, remote
Participants:
5 participants
Length:
20-30 minutes
The problem:
Available online beachside restaurant and snack shop websites have cluttered designs, inefficient systems for browsing and ordering items, and confusing checkout and reservation processes.
The goal:
Design a Beachside Snack Shop website to be user friendly by providing clear navigation and offering a fast and easy reservation and ordering process.
My role:
UX Designer leading the Chicy Tiki Beachside Bar and Grill's website design
Responsibilities:
Conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, iterating on designs and responsive design.
User Research: Summary
User Research: Summary
I conducted interviews and created empathy maps to understand the users I’m designing for and their needs. A primary user group identified through research was working adults who don’t have time to decorate their homes.
This user group confirmed initial assumptions about Art X customers, but research also revealed that time was not the only factor limiting users from decorating their home. Other user problems included obligations, interests, or challenges that make it difficult to find art for their home or unsure of where to go search for individual pieces in-person.
User Research: Pain Points
User Research: Pain Points
Limited Time
Busy beachgoers often have limited time and may feel rushed or stressed trying to fit everything in during their beach day.
Interaction
With the high likelihood of users accessing the website from mobile devices, a non-responsive design could lead to a poor user experience.
Navigation
If the website has a confusing or unclear navigation structure, it could make it difficult for users to find what they are looking for.
Limited Options
For users who may not have time to wait in long lines, It's important to ensure that the online ordering process is smooth, easy to use, and offers a variety of options.
Persona: Leilani
Problem statement:
Leilani is a busy beach goer who needs a quick and efficient way to order food and drinks because she wants to spend more time enjoying the beach and less time waiting in long lines.
User journey map
I created a user journey map of Leilani's experience using the site to help identify possible pain points and improvement opportunities.
Sitemap
Difficulty with website navigation was a primary pain point for users, so I used that knowledge to create a sitemap.
My goal here was to make strategic information architecture decisions that would improve overall website navigation. The structure I chose was designed to make things simple and easy.
Paper wireframes
Next, I sketched out paper wireframe ideas for each screen of my website, keeping the user pain points about navigation, limited time, limited options while browsing, and checkout flow in mind.
The home screen, menu, and gallery paper wireframes to the right focused on optimizing browsing experience for users.
Paper wireframe
screen size variation(s)
Because Chicy Tiki's customers access the site on a variety of different devices, I started to work on designs for additional screen sizes to make sure the site would be fully responsive.
Digital wireframes
Moving from paper to digital wireframes made it easy to understand how the redesign could help address user pain points and improve the user experience. Prioritizing useful button locations and visual element placement on the home page was a key part of my strategy.
Low-fidelity prototype
To create a low fidelity prototype, I connected all of the screens involved in the primary user flow of adding an item to the cart and placing an order.
At this point, I had received feedback on my designs from my studies about things like placement of buttons and page organization. I made sure to listen to this feedback, and implemented several suggestions in places that addressed user pain points.
Mockups
Based on the insights from the usability study, I made changes to improve the site's homepage format and checkout flow. One of the changes I made was adding a flyout menu that includes all links to navigate the website, and an order online button on every page to help you quickly navigate to the online menu, ordering, and reservation process.
Before usability study
After usability study
To make the checkout flow even easier for users, I added a check box that allowed users to reserve a table and dine-in or pick-up your order. I also added the option to edit the number in your party to match you with a table available at the time of pick-up in case you decide to dine-in. This allowed users more freedom to avoid wait times, lines or not having a place to sit.
Before usability study
After usability study
Mockups: Original screen size
High-fidelity prototype
My hi-fi prototype followed the same user flow as the lo-fi prototype, and included the design changes made after the usability study, as well as several changes I personally added after the study.
Accessibility considerations
1The website was designed with clear and easy-to-use navigation, with keyboard navigation available to allow users with mobility impairments to access all areas of the site.
The website uses color combinations that provide sufficient contrast between foreground and background elements. This is important for users with visual impairments, including color blindness.
All images on the website have alt text that describes the image's content or purpose and clear typography. This is important for users with visual impairments who use screen readers to access website content.
Thank You!
Thank you for your time reviewing my work on the Chicy Tiki’s Website Design Concept! If you’d like to see more or get in touch, my contact information is provided below.
Email: kristen.townsel@gmail.com
Website: kristentownsel.com
© 2025. All Rights Reserved to Kristen Townsel
Page updated
Google Sites
Report abuse