How might we design a seamless and intuitive booking experience that gives parents confidence when planning a
family staycation?
School Project, Aug 2024 - Nov 2024
My role
Lead UI/UX Designer
What I did
User Research
Usability Testing
Ideation
Prototyping
UI Design
UX Design
Software
Figma
Miro
Results
Designed a hi-fi working prototype of the booking user flow.
The National Service Resort & Country Club (NSRCC) is a premier resort-style destination in Singapore, offering golf, sports, and family-friendly amenities for National Servicemen. For this project, our team set out to improve the bungalow booking experience. I led the end-to-end redesign, focusing on usability, clarity, and a seamless booking flow.
Before the Redesign
NSRCC's Current Booking Flow
Problem
1. Accessibility Issue
The green background, blue hyperlinks, and red greeting text clash visually and do not align with modern web accessibility or readability standards.
2. Lack of Visual Clarity
The green background, blue hyperlinks, and red greeting text clash visually and do not align with modern web accessibility or readability standards.
3. Heuristic Evaluation
3.1. Aesthetic and Minimalist Design
The interface uses a cluttered mix of colours (bright green background, red and blue text) with no visual hierarchy, white space, or imagery. This overwhelms users and lacks modern visual clarity.
3.2. Consistency and Standards
In most interfaces, the primary action (e.g., “Next,” “Continue,” “Submit”) is placed on the right, following established industry conventions and user expectations. However, in NSRCC’s booking flow, the “Back” button is placed on the right, while the “Next” button is on the left, directly conflicting with both platform conventions and the rest of NSRCC’s own UI.
3.3: User Control and Freedom
Users have limited ability to review or change booking details mid-process. There is also no clear navigation or breadcrumb trail, making it hard to understand where you are or how to go back safely.
3.4: Recognition Rather Than Recall
With no visual previews of bungalows or in-line chalet details, users are forced to recall information from another tab or document, increasing cognitive load.
Primary Research
1. Scenario-Based Tasks
Core users of NSRCC's booking system (parents booking chalets for family use) were asked to complete a booking for a specific chalet and date on the current system. We timed their completion, recorded screen navigation, and encouraged think-aloud protocols to capture their thoughts and frustrations.
2. Interviews
After the tasks, we conducted semi-structured interviews to unpack deeper pain points and needs.
3. Key Insight
Parents wanted a visually guided and confidence-inspiring experience. They do not want more choices, just clarity.
So, How Might We...
Design a seamless and intuitive booking experience that gives parents confidence when planning a family staycation?
Final Prototype: Key Features
Main Page
I transformed the outdated, text-heavy interface into a clean, image-driven booking experience that empowers parents to browse, compare, and book with confidence.
.png)
Selection of Dates
I introduced a modern, visual calendar picker that makes it effortless for users to select their check-in and check-out dates, allowing parents to see date ranges at a glance.
Interactive Bungalow Map for Confident
Decision-Making
After selecting their dates, users are guided to an interactive map view showing only the bungalows available for their selected stay.
Once a bungalow is selected, details will appear below. The user also has the option to change their selection.
Confirmation of Details
A clear progress indicator shows parents where they are in the booking flow. Key details of the selected bungalow are shown to reduce the need to backtrack. The “Confirm and Proceed” button stays disabled until all fields are completed and the required checkbox is ticked, helping prevent errors and incomplete submissions. These changes ensure clarity, guide parents through the process, and build confidence at every step.
Payment Details
In the final payment step, I displayed a clear summary of the stay dates, selected bungalow, and total pricing to reinforce confidence before checkout. This ensures parents feel informed, reassured, and in control before completing their booking flow.
Design System
Basic Elements
.png)
Components
_edited.png)
_edited.png)
Takeaways
1. Visual Hierarchy and Accessibility are Essential for Usability
This project was my first real exposure to core design principles such as heuristic evaluation and usability testing. It taught me how a clear visual hierarchy and strong accessibility practices are fundamental to creating user-friendly interfaces.
2. Designing for an Often Overlooked Demographic
This project focused on designing for busy parents—a user group often overlooked in UX. By prioritising accessibility, simplicity, and clear visuals, I turned a potentially stressful booking process into an easy, calming experience that reduces cognitive load and saves time.
3. Simple, User-Centric Design Wins
Simplifying the interface, minimising distractions, and highlighting essential information helped the target users (parents) feel guided and confident throughout their interaction.
