Escalé
Design System · v0.1
Screens 03 — 05
Booking Flow
Screens 03 — 05 / Booking Flow

Three steps to a confirmed stay.

Step 1 · Rooms & Dates
Step 2 · Guest details
Step 3 · Payment
Sticky CTA · running total
Preview · 22 May 2026
Step 01
Choose your stay
Pick the room, set the dates, decide on meal plan. Live price updates with every change.
9:41
Step 1 of 3

Your stay

Choose dates, guests, and room.

Dates and guests carried over from your search
Check in
15 Mar
Sun
Check out
18 Mar
Wed · 3 nights
Adults
Age 13+
2
Children
Age 0–12
0
Room
Garden Suite
King · 48 m²
EGP8,600
Sea-Edge Room
Twin · 32 m²
EGP5,700
Meal plan
Half board
Breakfast + dinner
Room only
−EGP 860/night
3 nights · half board
EGP 28,380
Step 02
Who's staying
Primary guest details plus optional ID verification — unlocks direct-to-room QR check-in.
9:41
Step 2 of 3

Tell us about you

Primary guest details. We'll use these for check-in.

Skip the front desk
Verify with Digital ID for direct-to-room QR
First name
Last name
Email
Phone
Nationality
ID / Passport no.
These let the hotel finish your check-in before you arrive
Special requests — optional
Late check-in around 10pm. Quiet room if available.
3 nights · total
EGP 28,380
Step 03
Confirm & pay
Booking summary on top, payment methods below. Local methods (mada, Apple Pay) first for the Saudi market.
9:41
Your stay
Casa Bougainvillea
Garden Suite · 3 nights · Half board
Room (3 × EGP 8,600) 25,800
Meal plan + 2,580
Tourism tax + 430
Service (5%) − 430
Total
EGP 28,380
Free cancellation until 12 Mar · Your card won't be charged before check-in.
Payment
Paymob
Visa · Mastercard · Meeza
Apple Pay
Touch ID to confirm
mada
For Gulf cards
Total · 3 nights
EGP 28,380

Why the booking is only 3 steps.

Every extra screen makes people give up before they finish. We kept booking to three short steps so guests complete it.

01

You always see your progress

Three dots at the top show which step you are on and how many are left.

02

The price stays on screen

The total price is shown the whole time you book. No surprise at the payment step.

03

Adding your ID is optional

If the guest adds their ID, they get a QR code to walk straight to their room.

04

Local payment first

mada and Apple Pay are shown first because Saudi guests know and trust them.

05

Free cancellation is clear

The free-cancellation note shows right before payment, so the guest feels safe.

06

One pink button

Steps 1 and 2 use a dark button. Only the final Confirm button is pink.