Product Design Brief · Consumer Booking Flow

Fullerton Hotel
Booking Experience

Luxury booking UX, mobile conversion flow, and premium interaction design

Project
Fullerton Hotel Booking App
Deliverables
Journey map, lo-fi flow + live mobile prototype
Document Type
Product Design Brief / Design Rationale
Year
2025
Interactive · Skip to Prototype Try the live booking experience →
↓
01 · User Journey Map
02 · Lo-Fi Wireframes
03 · Interactive Prototype
01
Deliverable · User Journey Map

Booking Journey
from Browse to Confirmation

Journey map showing screens, system interactions, and the emotional arc across the full booking flow — from first interest through room selection, checkout, and confirmation.

User Journey Map

Loads from horizonsplash.com

Deliverable 01 · User Journey Map
Luxury Flow,
Low Friction

Full booking arc from first consideration to post-confirmation, mapping screens, system interactions, and emotional sentiment across every touchpoint so the design could reduce friction without flattening the premium feel.

↗ Open Full Size
View Deliverable
fullertonjourneymap.png
→
Design Intent

Full Arc Visibility

Maps the complete experience from first consideration to post-confirmation — making friction points visible before they become problems.

Methodology

Three-Layer Structure

Screen flow, system activity, and emotional arc run in parallel — showing how backend latency and form errors translate directly into user sentiment drops.

Key Finding

Payment Is the Friction Peak

The emotional arc dips sharpest at payment entry. Trust signals and progressive form disclosure were identified as the highest-priority fixes.

02
Deliverable · Low Fidelity Wireframes

7-Step Mobile Booking
Structure

Structure-first wireframe set mapping every screen from home hub to booking confirmation — resolving layout, hierarchy, and decision flow before visual design began.

Lo-Fi Wireframes

Loads from horizonsplash.com

Deliverable 02 · Lo-Fi Wireframes
Structure First,
Premium Later

Every screen from Home Hub to Booking Confirmed was resolved at lo-fi stage so the high-fidelity pass could focus on brand tone, visual hierarchy, motion expectations, and polish rather than repairing the core flow.

↗ Open Full Size
View Deliverable
Lofiwireframe.png
→
Design Intent

Structure Before Style

Lo-fi was built to resolve layout and flow decisions independently of visual design — keeping stakeholder feedback focused on what matters at this stage.

Methodology

Progressive Disclosure

Each screen surfaces only what the user needs at that step. Room pricing is withheld until selection. Payment breakdown only appears at checkout.

Key Decision

One CTA Per Screen

Every screen has a single primary forward action. No screen competes with itself — reducing decision fatigue across all 7 steps of the flow.

03
Deliverable · Interactive Prototype

Fullerton Booking App
Live Mobile Prototype

Live prototype of the full mobile booking flow. Navigate the experience directly in the device frame to review interaction patterns, transitions, decision points, and confirmation behavior.

Deliverable 03 · Interactive Prototype
Mobile Booking
Prototype

Navigate the full 7-step booking flow directly in the phone frame. Tap through each screen to experience the interaction patterns and transitions as designed.

↗ Open Full Screen
Open Prototype
horizonsplash.com · fullertonapp.html
→
What to Look For

Flow Continuity

Each screen transitions into the next without dead ends. The prototype validates that the 7-step journey map translates cleanly into a working interface.

What to Look For

Interaction Patterns

Note the progressive disclosure at each step — filters, room details, and payment fields appear only when the user is ready for them.

What to Look For

Confirmation Moment

The final screen is designed to close on a high — reflecting the delight peak identified in the journey map at the booking confirmed stage.