Jerk’d is a modern Caribbean restaurant located in Hackensack, New Jersey with a new and modern approach to Caribbean cuisine. The Jerk’d initial mission is to bring a modern and casual Caribbean dining experience to those who love good food and those who just want a taste of back home.
Role
End-to-End UX/UI Designer
Product
Responsive Web Re-design
Tools
Figma, Fig Jam, Mockfy & Zoom
Time
4 weeks
- Context
Jerk’d is a modern Caribbean restaurant located in Hackensack, New Jersey with a new and modern approach to Caribbean cuisine.
The current design for the website is not responsive and has some accessibility issues on the website not present on the mobile site, a few website architecture issues are present and the site lacks a user friendly online ordering function. Additionally, a reservation feature was incorporated into the website to enhance the users dining experience.
- Research
Research Objectives
-
Determine whether or not users prefer onsite ordering or ordering on third party delivery apps.
-
Determine if users prefer to make reservations online directly to the site or a third party booking feature or over the phone.
-
Understand what would help enhance the user experience when booking a reservation
Competitive Analysis
Jerk’d was compared to several popular Caribbean restaurants with the main focus being on third party delivery for online orders and onsite online orders. Most of these restaurants did not utilize third party ordering or the ability to order directly from the website itself.
User Interviews
Using Zoom, I interviewed 8 different people from different walks of life and different takeout ordering habits as well as reservation making experience. These interviews were conducted to understand users preferences regarding ordering from restaurants and making reservations and some issues they may experience doing so.
After affinity mapping I was able to gain a few insights and from there I’d be able to get a clear idea of who I was designing for and further be able to meet their needs amongst other things.
Most users would like an additional section to add specific details regarding their reservations.
80% of participants preferred third party ordering over online ordering.
Participants would like to be notified of open reservations via email or text if none are available at that moment.
- Define
Persona
Meet Jane, after going through and summarizing my research and data I ended up with one target user. Jane Jagan is a Guyanese girl and lover of Caribbean cuisine. She loves to go out to dinner with her friends at least two times a week and ideally, being able to make reservations helps when dealing with a large friend group.
Initially two personas were to be developed however, after analyzing my research findings having two would be unnecessary since there was a consensus regarding online orders.
User Interviews
The original website didn’t have an issue as far as information architecture however, it was a bit outdated with a Thanksgiving category still available in the spring.
User Flow
After developing the site map, I realized that now I would need to figure out how Jane would navigate through the site and book a reservation. Additionally, I would also need to understand how my forms would need to be done for the reservation feature and how my information would flow together.
- Ideate
Wireframes
I began thinking of ways to restructure the site and ran to my ipad. The original design had the entire menu on the homepage and my first step was to figure out how to minimize that and give it its own section.
Since the entire menu was on the homepage I decided to give it its own page with distinct categories for the user to search through.
UI Elements
In order to move forward with the high fidelity designs I needed to work on some visual design elements. I started working on the buttons and chose colors to stay with the original theme of the restaurant and found some more appropriate font choices.
Just something light.
- Testing
Usability Testing
Using zoom again I conducted user testing with 4 participants. Going forward I think I’ll start testing at the mid-fidelity stage so that participants can focus on the site functionality and organization.
I had the participants make a reservation, order online food and judge my designs architecture against the current site's architecture.
Success!
-
UI was easy to understand and navigate
-
No task failures
-
Organization and architecture was familiar
Suggestions!
-
Illustrations for the menu cards and/or descriptions on the cards
- Grand Finale
Throughout the redesign process, I paid careful attention to the website's architecture. I restructured the navigation menu and optimized the information hierarchy to improve the website's overall organization and ease of use.
Overall, this restaurant website redesign aimed to transform a cluttered and problematic website into an accessible, user-friendly, and feature-rich platform. By addressing architecture issues, enhancing accessibility, and introducing new functionalities like the reservation feature and third-party delivery system, the redesign aligns the website with current industry standards, meets user expectations, and enhances the overall dining experience.
- Reflection
Reflecting on the journey, I am pleased to present the outcomes of this case study. However, I would go over the menu again and rework the layout and flesh out the third party delivery screen. All of this would of course require a bit more research which I do enjoy.