Little Lemon
Little Lemon, a family-run business, enlisted my help to create a reservation page. The goal was to design a page that is clear and user-friendly while preserving the original look and feel of their website.
Responsibility’s
User Personas
Wire-Frames
User Journey Maps
Mock ups
High Fidelity Prototypes
User Research
User Testing
Client
Coursera Project
Year
08/2025 - 09/2025
My role
I worked on this project solo.
Goal
Design a functional reservation page for guests, maintaining the existing design style of the website. Include essential information in a clear, concise way to ensure usability without overwhelming users.
Problem
Guests of the Little Lemon Restaurant have no way of booking a table online.
User Research
To ensure the reservation page met the needs of Little Lemon’s guests, I conducted user research that included informal interviews with potential users. The research focused on understanding how users typically make reservations, what information they expect to see, and pain points they experience with similar websites. Insights from this research informed the design decisions, helping to create a page that is intuitive, efficient, and aligned with user expectations.
Pain Points
1
Functionality
Users expected a smooth reservation process, including the ability to select dates, times, and number of guests. Any lack of responsiveness led to frustration.
2
User-Friendly
Some users felt overwhelmed when too much information was displayed at once. Prioritizing key details and progressive disclosure was important to maintain engagement.
3
Interaction
Users preferred interactive elements such as clickable buttons, confirmation messages, and feedback to indicate completed actions.
4
Information Overload
Simplicity and clarity were essential. Users wanted a clean layout with essential information easily accessible, avoiding unnecessary complexity.
Persona
Age : 28
Education : High School
Hometown : Statesville, NC
Family : Relationship, 1 child
Occupation : Marketing Manager
JORDAN REYES
Goals
Complete Reservations Quickly: Wants want a fast and seamless process for booking a table.
Easily Select Date and Time: Wants want an intuitive way to choose his preferred reservation slot.
Specify Party Details: Wants to easily indicate the number of guests for his reservation.
Receive Clear Confirmation: Wants immediate feedback or confirmation that his reservation has been successfully submitted.
Frustrations
Confusing Navigation
Limited Options
Lack of Feedback
Slow or Unresponsive Interface
James is a busy professional who often dines out with friends and family. He values efficiency and simplicity when making reservations, as he doesn’t have time to navigate complicated systems.
“I just want to book a table for my family quickly, without any confusion or extra steps” — Jordan Reyes
User Journey Map
The journey map illustrates David's priorities for simplicity and proactive tools in managing his family’s schedule. It underscores the importance of seamless onboarding, intuitive and conflict-free scheduling, and collaborative features that drive engagement. These insights highlight opportunities to design a solution that empowers David to feel confident, organized, and in control of his family’s planning.
Persona: Jordan Reyes
Goal: Jordan is trying to book a table for him and his family on the little lemon website.
Information Architect
Paper Wireframes
My paper wireframes outlined the basic flow of the site, ensuring all necessary information was included for the final design. I highlighted elements I felt worked well and defined the order in which information should appear on the screen, providing a clear structure for the user journey.
Digital Wireframes
Through testing my paper wireframes, I gained valuable user feedback that informed key design improvements. Users expressed a preference for having contact information displayed on the same page as guest details, reducing the number of pages they needed to navigate. They also wanted the current date to be more prominent and easily visible. Additionally, users suggested organizing information into separate boxes or sections to clearly distinguish each category, enhancing readability and minimizing cognitive load.
Low-Fidelity Prototypes
After creating this prototype and testing it with users, I learned that they were unsure why reservations were limited to the current week. To address this, I added small information boxes explaining availability. Users appreciated the date selection but wanted a clearer indication of the current day, so I added a “Today” label at the bottom of the date display. Overall, the prototype clearly demonstrates the flow of the app, guiding users from the reservation page through reviewing and confirming their table.
Usability Study
Moderated usability study
United States, In-Person
5 Participants
10 - 15 Minutes
Findings
The font size was too small, impacting readability.
Dropdown menus had closely spaced buttons, making it difficult to select the desired options.
Insights informed adjustments to improve readability, usability, and overall user experience.
Users wanted more information at the end of the reservation process, such as restaurant guidelines and policies.
Before & After: Usability Improvements
Before usability study
I improved the dropdown menus by increasing the spacing between options, allowing users to click with confidence and accuracy. I also enlarged the text for better readability and introduced a yellow highlight with a checkmark to clearly indicate the selected option.
I updated the date section by adding a help button for users who want to book beyond the current week. To make navigation clearer, I highlighted today’s date and introduced an element that shows which days are fully booked, helping users make quicker, more informed decisions.
After usability study
Mockups
In my high-fidelity mockups, I referred back to the original website’s design sheet to ensure consistency and applied all brand elements accordingly. On the confirmation page, I added a section that provides users with additional information about the restaurant, enhancing both clarity and transparency. I maintained the existing color scheme while following WCAG guidelines to ensure the design remains accessible and user-friendly.
High-Fidelity Prototype
In my high-fidelity prototype, I introduced micro-interactions, such as a checkmark animation appearing on the confirmation page, to provide users with clear feedback and a sense of completion. I maintained a simple and sleek aesthetic throughout the design, ensuring clear navigation and a consistent look and feel across the website.
Accessibility Considerations
Ensured the color palette followed WCAG guidelines so that text and interactive elements are easy to read for users with visual impairments.
Added micro-interactions and highlights (such as a yellow checkmark on selections) to confirm user actions and reduce uncertainty.
Increased font sizes and spacing to improve readability and make the interface easier to navigate for all users.
Takeaways
Impact
As a result of me creating this part of the website, the final reservation flow is intuitive, accessible, and user-friendly. Users can quickly select dates, times, and guest numbers with confidence, while receiving clear feedback at every stage of the process. The addition of helpful guidance, accessible typography, and micro-interactions has streamlined the booking journey, reduced frustration, and built trust in the system. Overall, the design now provides a seamless reservation experience that reflects the brand’s identity while meeting the needs of a diverse user base.
What I learned
Through multiple rounds of testing and iteration, I learned the importance of listening closely to user feedback and observing pain points in real time. Users highlighted challenges such as unclear date displays, limited booking explanations, small text, and difficulty interacting with dropdown menus. These insights taught me that even small details—like spacing, labeling, or confirmation cues—can have a significant impact on usability and overall user confidence. I also gained a deeper understanding of accessibility standards, particularly how color contrast, typography, and visual feedback play a key role in creating an inclusive experience
Next steps
Test the high-fidelity prototype with a wider group of users to validate improvements and uncover any remaining pain points.
Explore additional accessibility enhancements, such as keyboard navigation, screen reader compatibility, and alternative text for icons or images.
Adapt the reservation flow for different devices and screen sizes to ensure a consistent, user-friendly experience across desktop, tablet, and mobile.