Royal Caribbean

Overview

FormatPage Grabber

PlatformDesktop + Mobile

EngineGreenSock

AgencyUndertone

Virtual preview of the Royal Caribbean cruise experience. Users explore the ship deck by deck: pool areas, dining venues, entertainment, and stateroom categories. Destination photography showcases itinerary ports with cross-fade transitions. The ad functions as an interactive mini-brochure rather than a traditional display unit.

Cruise advertising sells a complete vacation, not a single product. The ad needed to convey the full scope in one format.

Context

This was one of the heaviest ad units I built in terms of asset weight. Ship exterior, pool deck, restaurant interior, entertainment, spa, plus 4-7 destination photos, plus stateroom photography at multiple price tiers — all in one ad unit that had to load within the ad server's weight limit. The approach was aggressive lazy loading: only the first tab's imagery loads on open, and subsequent tabs fetch their assets on first click with a loading indicator. The stateroom comparison section was architecturally interesting — each tier (interior, ocean view, balcony, suite) needed its own photography, amenity list, and starting price, but the tab transition had to feel instant. I preloaded the next tier's image during the current tier's display timeout, so by the time the user clicks forward, the image is already cached.

How It Works

~3s

Ship

Full-bleed ship exterior photography. Royal Caribbean logo and ship name animate in. Aerial view establishes scale.

Interactive

Onboard

Tabbed exploration of ship areas: pool deck, restaurants, entertainment, spa. Each tab reveals area photography with feature callouts.

Auto-cycle

Destinations

Port destination imagery cycles with itinerary highlights: Caribbean islands, Mediterranean coasts, Alaska fjords.

End State

Book

Booking CTA with itinerary-specific pricing. "Learn More" and "Book Now" tracked separately for funnel analysis.

Engineering

Ship Tour Tabs

Tabbed navigation for ship areas. Each tab manages its own content: photography, feature callouts, and area-specific CTAs. GreenSock handles tab transitions.

Destination Gallery

Auto-cycling destination imagery with port name and itinerary data. Cross-fade transitions between ports with synchronized text updates.

Stateroom Showcase

Category comparison from interior to suite. Each stateroom level shows room photography, amenity list, and starting price.

Panoramic Views

Desktop leverages wide viewport for panoramic ship and destination photography. Mobile uses cropped vertical compositions.

Engineering Decisions

Users have different priorities: some care about the pool, others about dining. Tabs let them explore what matters to them first.

Cruises sell a complete vacation. A single hero image can't convey ship + destinations + accommodations. The multi-section format covers the full value proposition.

Cruise pricing varies 5x between interior and suite. Showing the range helps users self-select their price point and reduces bounce from sticker shock.

Cruise itineraries visit 4-7 ports. Showing only one undersells the experience. Auto-cycling creates a sense of variety and adventure.