Nearby Cabins

Helping families and groups book cruise cabins next to each other

How I designed a simple way for travellers booking more than one cabin to see — and pick — the cabins right beside theirs, without starting their search over.

My role: UX / UI Designer
Works on: Phone & Computer
Timeline: 4 rounds of design
Designer: Nehal Rana


01 — OVERVIEW

When a family or group goes on a cruise together, they usually book several cabins — and they want those cabins close to each other. But the booking screen gave them no way to see which cabins were next door. They had to guess, or leave and search all over again.

I designed Nearby Cabins: a small "View Nearby" link under each chosen cabin. Tap it, and you see the free cabins right beside yours, marked on the ship's deck map, ready to add with one tap. It's an optional extra — if a cruise company doesn't switch it on, nothing about the booking screen changes.

• Shown only when asked for
• Doesn't change what already works
• Live info from the cruise line
• Clear, honest messages
• Built for phones first


02 — THE PROBLEM

Travellers booking several cabins ran into three frustrations.

1. No way to find the cabin next door
The cruise line knew which cabins were side by side, but the screen never showed it. Groups had to guess, or leave and search again.

2. A connection hiccup looked like "sold out"
If the cruise line's system briefly didn't respond, the screen said "No nearby cabins were found." People assumed the cabins were taken — when really, trying again might have worked.

3. The cabin panel was crowded, especially on phones
Too much was squeezed into each line — labels, buttons, prices and cabin names all fighting for space — so people had to scroll far more than they should.


03 — HOW I GOT THERE

Over two weeks, I worked through four rounds of design. Each round fixed one thing at a time. Four key choices shaped the final result.

Clearer prices → Tidier cabin names → Simpler layout → Clear final buttons

Choice 01 — Show it only when asked
Nearby cabins stay hidden until you tap "View Nearby", and only one list opens at a time. The screen stays calm for people who don't need it.

Choice 02 — Details on the left, buttons on the right
Every line follows the same pattern, so your eye always knows where to look. Clear headings split the panel into "Choose your cabin", "Nearby" and "Your cabins". "Choose Cabin" became a simple "Select".

Choice 03 — Use the whole phone screen
On phones, cabin names were squashed into a narrow column. I spread the layout across the full width and moved extra details onto a second line — shorter cards, much less scrolling.

Choice 04 — Be honest when something goes wrong
If the cruise line doesn't respond, the screen now says "Unable to retrieve nearby cabins. Please try again" with a retry button — clearly different from "there are none". A "Confirm Cabins" button and a "Clear All" link make the final step obvious.


04 — THE RESULT

Nearby cabins now sit neatly under the cabin you picked, appearing only when you want them — and every situation, from loading to "please try again", has a clear message.

See them on the map
Free cabins next to yours light up on the deck map, so you can see exactly where they are.

Know the price difference instantly
Each nearby cabin shows how much more or less it costs than the one you picked, with a full breakdown one tap away.

No repeats, easy to scan
Cabins you've already chosen don't show up again, and the list is always in cabin-number order.

Your picks are kept safe
Chosen cabins are held for you and stay put even if the page reloads — they can't be removed by accident.


WHAT I HAD TO WORK AROUND

It depends on the cruise line
The nearby-cabin info comes from the cruise line itself, and not every cruise line provides it yet. The design had to work well either way.

An on/off switch for each business
Each travel company can choose whether to turn the feature on — for agents, for direct customers, or for specific cruise lines.

Starting with one website style
This first version was built for one of our website designs, keeping the change small and safe before rolling it out further.

Adding without breaking
The new sections were built as separate pieces that sit alongside the existing screen, so everything that already worked kept working.


05 — WHAT CHANGED FOR TRAVELLERS

Finding a cabin next door is easy
Groups can find and add a neighbouring cabin without losing what they've already chosen — something that simply wasn't possible before.

Fewer false "sold out" moments
People can now tell "nothing's available" apart from "try again", and recover with one tap.

Easier to read, less scrolling
Plainer wording, a consistent layout and a tidier phone view make the screen quicker to understand.

Safe to switch on
Nothing changes until a business turns it on, so it can be introduced gradually and with confidence.


06 — LOOKING BACK

The hardest part wasn't the new feature itself — it was adding it without disturbing a booking screen people already relied on, while working within what each cruise line could provide.

Small, focused rounds of design helped: each one solved a single problem, so nothing big was ever at risk. And the quiet win was honesty — showing "we couldn't reach the cruise line, try again" instead of "nothing found" is a small detail, but it's exactly where people decide whether to trust a booking site.

What I'd do next
• Find nearby cabins ourselves for cruise lines that don't provide the info, so every traveller gets the feature.
• Bring it to our other website designs.
• Measure how often people use it, to show its value with real numbers.