All work Case study

Dalí

How we helped a luxury travel agency provide travellers the best experience for their trips.

Client
Dali Travel - luxury travel agency
Role
UX & UI Design · Art Direction · Product Management
Disciplines
User research · User interface · Prototyping · Front-end
Platform
Responsive web & iPad
An iPad resting on stones, running the Dalí trip-planning system

A personalized micro-site for each client, for each trip, with everything they need to view and adjust their journey before, during, and after.

Hand holding an iPhone with a Dali trip proposal open, on board a plane

01The challenge

Planning a dream trip meant too many trips to the agency.

When booking a trip, many people will go to a travel agency in person. With the assistance of an agent, they will build the trip of their dreams.

That also puts a burden on travel agents, who have to work hard and dedicate a lot of time to meeting and talking with potential clients, and only a percentage of them close the deal.

Behind the scenes, every proposal was built by hand. City write-ups, hotel descriptions, and photos lived in separate documents and spreadsheets; flight fares had to be requested and copied in one by one; and everything was assembled into a static PDF. Putting a single proposal together could take an agent a couple of days, and every change request meant redoing part of that work, and often another visit to the agency.

Since Dali Travel offers luxury experience travels, they wanted to offer a better service for their clients, so they looked for me to help.

It usually meant the traveler had to visit the agency many times, to view the proposal, adjust the itinerary, and pay.

The Dalí trip-planning system shown across two iPads
The system on tablet, designed for browsing and decision-making on the go.

02The solution

We created a personalized micro-site for each client, for each trip.

There, the user would have the ability to view the itinerary and hotel room photos, make changes autonomously, mix & match items like rooms and flight tickets, see maps and vouchers, make and manage reservations, and more, all with a friendly interface to help the decision-making process.

From the travel agency perspective, it would allow agents to auto-generate proposals pulling information from data sources. Content that used to live in scattered files became a library the system draws from: when an agent selects a city, the available hotels come in with photos and descriptions ready to drop into the proposal, and an integration with airline ticketing systems pulls in current flight options and fares. It also let agents create templates that could be replicated for different users while remaining easily customizable, and opened the opportunity for the agency to partner with restaurants, car rental companies and hotels.

For the traveler, the closed PDF gave way to a link: a responsive micro-site that works just as well on a phone or tablet as on a desktop, always shows the latest version of the trip, and can be shared with travel companions in one tap.

The Dalí trip-planning interface running on an iPad
Diagram of the Dalí front-end and back-end architecture
How the front-end for travellers connects to the back-end agents use to build proposals.

The product is the visible half. From here on, this page shows how we got there, step by step, artifact by artifact.

03Discovery

We started by watching people plan real trips.

We interviewed travel agents and travellers to understand every side of the journey, and we sat with them while they performed real tasks: assembling a proposal, comparing hotels, requesting a change. Watching the work beat asking about the work: the friction showed up in places nobody thought to mention.

Interview session with travel agents and travellers in a meeting room
Affinity mapping: clustering interview notes on a wall of sticky notes

Interview sessions and affinity mapping, clustering what we heard into themes.

The sessions produced a long list of pain points. Written next to each one is the answer that eventually made it into the product, which is how we later argued about what deserved to be built.

The pain
What the product does about it

Traveller

The proposal was a static document of names, dates, and prices. To picture any of it, travellers opened a browser and hunted for hotel photos, room types, descriptions, and where the place actually was.
Every hotel arrives with photos, video, an editorial description, category, amenities, and a map link, inside the proposal.
Flights were in one file, hotels in another, the car in a third, and the extras in an email thread. Reading the trip meant assembling it in your head.
One address holds the whole trip, city by city, in the order it happens.
Comparing several hotels, room types, and fares, each with its own price, was impossible at a glance. It took a spreadsheet or a lot of patience.
Options sit side by side as comparable cards, and the total updates as choices change.
Sharing the trip with a partner, family, or the friends travelling along meant forwarding a heavy file and hoping everyone opened the same version.
The trip is a link. Co-travellers open the same live page.
Documents aged badly. Prices and availability moved, and nobody could tell which of the attached versions was the current one.
There is only one version, and it is always the current one.
Asking for a change meant a call or a visit, then waiting days to see the result.
Comments go to the agent in place, and edits appear on the page in real time.
Questions could only be asked during agency hours, which rarely matched the evenings when people actually plan trips.
The trip site is open at any hour, and comments wait for the agent.
Paying meant going to the agency or a bank, at the exact moment the traveller had already decided to buy.
Card, boleto, or wire transfer, from wherever they are.
Handing over a large sum with no itemized view of what it covered made the final step uncomfortable.
Checkout reviews every selected item and the full itinerary before payment.
Vouchers and reservations travelled as a printed folder that could be forgotten or lost.
Vouchers live on the phone, alongside reservations and agency contacts.
If something went wrong mid-trip, reaching the right person took effort and a time zone conversion.
Contact and emergency numbers are one tap from the itinerary.

Travel agent

Each proposal was assembled by hand from content scattered across documents, spreadsheets, and hotel websites.
A content base of cities, hotels, rooms, airlines, and rental companies, reused across proposals.
Copying descriptions and photos from hotel sites into a document consumed the hours meant for curating the trip.
Hotel content surfaces automatically; the agent adds the part only they can write.
Every revision meant rebuilding and resending the file, then explaining what had changed.
Editing a field publishes to the live trip site instantly.
Similar trips were built from zero every time, even when the destination repeated.
Templates replicated across clients and adjusted per trip.
Only a fraction of proposals closed, and there was no signal about which ones were even being read.
Partly answered: proposal analytics stayed on the roadmap for the phase after launch.

04Problem definition

One problem, four root causes.

Planning a luxury trip through Dali Travel demanded so many visits, calls, and reworked PDFs that both travellers and agents lost time, patience, and sales along the way.

Asking "why" until the answers stopped changing pointed to four root causes:

  1. 01 Trip content lived in static, disconnected files, so every proposal was rebuilt by hand instead of assembled from a source.
  2. 02 Traveller and agent had no shared medium: the only interfaces between them were meetings, calls, and email attachments.
  3. 03 Payment was welded to physical presence, which turned the final "yes" into one more errand.
  4. 04 After purchase the relationship went dark: no live channel for vouchers, updates, or help mid-trip.

05Hypotheses

What we believed, written down so it could be wrong.

H1. If proposals become living pages fed by a content library, assembling one drops from days to about an hour, and revisions stop being rework.
H2. If travellers can view, comment, and mix & match options on their own, the number of meetings and calls per trip falls sharply.
H3. If checkout supports card, boleto, and wire transfer remotely, more proposals convert into paid trips.
H4. If vouchers, reservations, and agency contact live in the traveller's pocket during the trip, support requests drop and reviews improve.

06How might we

The questions that opened the solution space.

With the team and the agency in the room, we turned each root cause into "how might we" questions. They set the brief for ideation without prescribing any answer.

How might we let a traveller see the trip come to life before paying for it?
How might we make each revision instant instead of another agency visit?
How might we let travellers mix & match hotels, flights, and cars without breaking the agent's work?
How might we make paying remotely feel as safe as paying in person?
How might we keep every voucher one tap away in the middle of the trip?
How might we turn the agent from typist into curator?
A wall filled with sticky notes during the how-might-we session
The wall at the end of the session: root causes on top, questions and early answers below.

07Ideation

Four concepts entered. One left.

Open idea sessions with designers, developers, agency staff, and travellers generated the raw material: dozens of feature cards, from mapping with points of interest to QR code readers. At the concept level, four directions competed:

Discarded

Automated PDF generator

Faster to produce, but still a static document: every change would still mean a new file and a new email thread.

Discarded

Email digest with links

Cheap to build, but it fragmented the trip across messages and gave the traveller nothing to own or return to.

Chosen

A live micro-site per client, per trip

One address holding the whole trip: itinerary, options, comments, checkout, and vouchers. Always current, shared by traveller and agent.

Deferred

Full native app

Right instinct, wrong moment: the install barrier would fight adoption. A responsive web experience covered the trip; the app idea waited.

Ideation workshop: the team around a table covered with sticky notes and printed mockups
Paper wireframe sketches, sticky notes, and markers on the sprint table

Ideation sessions: feature ideas written as cards, sketched, discussed, and clustered by the whole team.

By the end of a session the wall looked like this: one idea per note, no filtering yet, the good and the doomed side by side.

A reconstruction of the wall. Two of these, the QR reader and buying tickets in the proposal, did not survive the matrix.

Inside the chosen direction, every feature was written as its own card. This is the full inventory that came out of the sessions, including the ones we argued for and then let go.

Built into the product Kept for a later phase Discarded

Trip site & itinerary

  • BuiltPersonalized cover with the travellers' names and trip type
  • BuiltOne micro-site per client, per trip
  • BuiltCity pages with hero image, name, and description
  • BuiltItinerary organized by city and dates
  • BuiltCity photos and embedded videos
  • BuiltTravel tips per destination
  • BuiltMap with points of interest
  • CutWeather forecast per city
  • CutBuilt-in currency converter

Hotels

  • BuiltHotel content surfaced automatically from the content base
  • BuiltCategory, location, and link to the hotel's own site
  • BuiltEditorial description written by the agent
  • BuiltPhoto carousel with arrows and position dots
  • BuiltLightbox for full-size photos
  • BuiltRoom options as comparable cards with dates and type
  • BuiltSee map link for each hotel
  • BuiltAmenities as icons
  • BuiltHotel videos
  • LaterRatings and reviews pulled from travel sites
  • CutBooking the room directly from the proposal
  • CutReviews written by other Dali travellers
  • CutSide-by-side comparison of two hotels

Flights, cars & transfers

  • BuiltAir tickets with airline, logo, class, and fare
  • BuiltMulti-leg routes with dates, times, and duration
  • BuiltCar rental with model, rate, period, pickup and drop-off
  • BuiltTrain tickets
  • BuiltLive fares listed from the ticketing integration
  • LaterTransfers and chauffeur service
  • CutBuying the airline ticket directly in the proposal
  • CutRenting the car directly in the proposal
  • CutSeat selection

Experiences & extras

  • BuiltOther services block for anything outside the standard types
  • BuiltAttractions and tours as itinerary items
  • LaterRestaurant reservations
  • LaterBooking attractions and concerts
  • CutTicket QR code reader at the destination

Deciding & collaborating

  • BuiltMix & match of hotels, rooms, flights, and cars
  • BuiltTotals updating live with each choice
  • BuiltTravellers set their own preferences and selections
  • BuiltComments sent straight to the travel agent
  • BuiltAgent edits reflected on the live site in real time
  • BuiltSharing the trip with co-travellers
  • LaterUpvoting and favoriting items to signal preference
  • CutPublic social sharing of the itinerary
  • CutAgency recommendations engine

Checkout

  • BuiltReview of every selected item and the full itinerary
  • BuiltPaying online by card, boleto, or wire transfer
  • BuiltReturning to adjust choices before paying
  • BuiltConfirmation and receipts
  • LaterInstallments
  • CutSplitting payment between travellers

During the trip

  • BuiltVouchers and reservations in the traveller's pocket
  • BuiltResponsive access from phone and tablet
  • BuiltReal-time updates while the trip is happening
  • BuiltEmergency numbers and agency contact
  • LaterNative app with push notifications
  • LaterOffline access to vouchers

Agent tools (backend)

  • BuiltProposal builder split by Client, Destination, Air Tickets, Car Rental, and Other Services
  • BuiltClient selector, trip title, and estimate date
  • BuiltRich text editor for custom copy in every block
  • BuiltImage upload and ordering per city, hotel, and room
  • BuiltVideo embedding by URL
  • BuiltRepeatable blocks: another room, another hotel, another ticket
  • BuiltAuto-complete for hotel and city names
  • BuiltTemplates replicated across clients
  • BuiltPublishing changes to the live trip site instantly
  • BuiltPassword login and access control per trip
  • LaterReading which items the client opened and compared

Content base

  • BuiltReusable database of cities, with copy, photos, and videos
  • BuiltReusable database of hotels, rooms, and amenities
  • BuiltDatabase of airlines and car rental companies with logos
  • BuiltContent written once and reused across proposals
  • LaterPartner-managed content, kept current by hotels themselves

Several of those features only work if something feeds them. The integrations were part of the same conversation, since they decide what an agent has to type and what arrives on its own.

Hotel content and ratingsDescriptions, photos, categories, and review scores from travel content providers, so a hotel page is not typed from scratch.
Hotel availability and ratesRoom types, dates, and prices from booking platforms, feeding the room option cards.
Airline fares and schedulesTicketing integration listing routes, legs, classes, and fares for the itinerary.
Car rental partnersVehicle categories, rates, and pickup locations from the rental companies the agency works with.
Restaurant reservationsReservation providers for the dining part of the itinerary, planned for the phase after launch.
Attractions, tours, and eventsTicketing partners for experiences and concerts, the natural next layer of the trip.
PaymentsGateway covering card, boleto, and wire transfer, the three methods travellers actually asked for.
Maps and points of interestLocation data behind the see map links and the points of interest around each hotel.

08Prioritization

Every card earned its place on the matrix.

Each idea card from the sessions was placed on a priority matrix of resources needed versus benefit to the user. The placement was done by the entire team, designers, developers, and users together, so the trade-offs were argued in the open. Cards in the "cheap and useful" corner, like online payment, vouchers, and mix & match, shaped the MVP; the "expensive and irrelevant" corner, like QR code readers, was let go without guilt.

Resources
Expensive and irrelevant Cheap and useful QR code reader API integration Mapping w/ POI Mix & match items Book concerts Car rental Plane tickets Book hotel Commenting Train tickets Pay online Real-time updates Travel tips Give recommendations Auto-complete hotels Hotel photos Share w/ co-travellers Social sharing View recommendations Password login Emergency numbers View vouchers Hotel map
Benefits

The matrix redrawn with the cards that decided the MVP. Everything in the green corner shipped first; the lonely card in the red corner did not ship at all.

Priority matrix with feature cards placed by resources versus benefits, and the story mapping board
The original artifacts, photographed from the session: the priority matrix and the first story mapping board.

09Story mapping

From themes to epics to stories.

The prioritized features were organized into a story map: themes on top, epics under them, and user stories below, still high level on purpose, since stories break down further before development. A condensed view:

Epics
Logging in: exclusive access to the trip
Manage itinerary: cities, hotels, dates, cars, and mix & match
Themes
Create & view account
Login form
Forgot password
View itinerary
Mix & match
Comment & checkout
Stories
Email validationSend email confirmationAdd photoEdit detailsProfile pageSocial login integrationDelete account & data
Google login integrationFacebook login integrationForgot password buttonPassword strength validationPrevent password auto-complete
Password resetSend reset emailReset password pageRedirect to latest proposal
View all citiesView list of hotel optionsView hotel room optionsView car rental optionsView airplane ticket optionsView city photos and videosView hotel map
Select a roomSwap a hotelChoose flight classSee totals update liveReturn to adjust choices
Send comments to the agentReview the full itineraryPay by cardPay by boletoPay by wire transferReceive confirmation

Redrawn from the original board, which carried every story with its acceptance notes.

10Personas

Three people we designed for.

The interviews condensed into three personas: two travellers with opposite relationships to time, and the agent, who is a user of the same system from the other side.

H+M

Helena & Marcos

Honeymoon travellers

Planning the trip of their lives and enjoying the planning almost as much as the trip.

Goals

  • See and feel the trip before paying
  • Compare hotels and experiences together, at home

Frustrations

  • Deciding from a flat PDF with no photos of the actual rooms
  • Hunting hotel pictures and locations on other sites, one tab at a time
  • No easy way to look at it together, or send it to family
  • Waiting days for each revised version

"We want to dream it together before we buy it."

R

Ricardo

Time-poor executive

Travels often, decides fast, and has no patience for errands that could be a link.

Goals

  • Approve and pay in minutes, remotely
  • Have every voucher on his phone mid-trip

Frustrations

  • Flights in one file, hotels in another, the car in a third
  • Comparing two configurations and their totals took a spreadsheet
  • Going to the agency to pay
  • Printed folders of travel documents

"If it needs a meeting, it's already too slow."

S

Sofia

Travel agent (internal user)

Knows the destinations by heart, but spends her days copying content between files.

Goals

  • Assemble proposals from ready content
  • Reuse templates and answer changes fast

Frustrations

  • Rebuilding PDFs after every change
  • Copying descriptions and photos from hotel websites
  • No signal about whether the client even opened the proposal
  • Being a typist instead of a curator

"I sell journeys. I shouldn't be formatting documents."

11The traveller journey

First a storyboard, then the map.

Before mapping anything into rows and columns, we drew the journey as a storyboard, ten scenes from landing on the site to using vouchers at the destination. It made the experience easy to feel, and it paved the way for the structured map and for prioritization.

Traveller journey storyboard: ten sketched scenes from landing on the website to using vouchers during the trip
The traveller journey storyboard, sketched with the team.

The full customer journey map covers the whole relationship, from researching a destination to coming back home. For each phase: what the traveller does, what they want, how it feels, and how we measure it.

Phase
Research & dreaming
Planning with the agency
Selecting hotels, cars & flights
Payment
Pre-travel
In-travel
Post-travel
Activities
  • Browsing destinations and dates
  • Collecting references and wishes
  • Setting a budget range
  • Logging in to the trip site
  • Seeing hotels, flights, and train tickets
  • Comparing itinerary prices
  • Commenting and asking for recommendations
  • Mix & match of hotels, cars, and flights
  • Seeing values update with each choice
  • Returning to adjust choices
  • Proceeding to checkout
  • Reviewing items and full itinerary
  • Contacting the agent if needed
  • Paying by card, boleto, or wire transfer
  • Making restaurant reservations
  • Booking tours and rides
  • Last-minute changes
  • Opening vouchers on the go
  • Viewing recommendations
  • Receiving alerts
  • Contacting the agency
  • Reviewing the trip
  • Sharing photos and impressions
  • Starting to dream about the next one
Goals
Turning a vague wish into a concrete request the agency can work with.
Receiving a tailored, curated list of hotels, restaurants, and tickets matching interest, budget, and time frame.
Adapting the list until it matches expectations, with final costs always visible.
Paying in a secure, comfortable way without going to the agency or a bank.
Having vouchers, tickets, reservations, and contacts organized and reachable.
Getting updates about the trip and reaching someone fast when something goes wrong.
Feeling the trip was worth it, and keeping the agency as "their" agency.
Experience
Feelings
Hopeful, unsureExcited about the idea, unsure how to turn it into a plan.
Surprised, happySurprised by the new approach; happy to see the itinerary come to life in a palpable way.
Delighted, empoweredEven when the agent gets something wrong, fixing it is a comment away.
Secure, comfortableKnowing the transaction is protected, in the payment method that suits them.
Confident, safeConfident about the trip, with every voucher in a safe place.
Informed, cared forInformed about the trip status; getting help is an easy task.
Satisfied, loyalHappy to recommend, already thinking about the next trip.
KPIs
Qualified requests reaching the agency
Less time to prepare proposals; fewer meetings, calls, and interactions per trip
Fewer revision rounds; changes made without meetings
Prospects converted into paying clients
Travellers self-serving without contacting the agency
Support requests resolved in-app; incident response time
Five-star reviews after trips; repeat bookings

Extended from the original artifact below; the map continues past the edge of the page.

The original customer journey map artifact for the traveller, with five phases
The original journey map artifact, built with the team after the interviews.
Journey maps and interview synthesis for Dalí
Journey maps for the different users, synthesized from the interviews.

12Flows & architecture

How the screens connect.

The user flow follows the journey: enter, explore, decide, pay, travel. Solid boxes are screens; dashed ones are views inside a screen.

Access

Login
Social login
Password reset

Trip home

Latest proposal
Itinerary timeline

Explore

City page
Hotels & rooms
Flights & trains
Car rentals
Attractions

Decide

Mix & match tray
Live totals
Comments to agent

Pay

Review & checkout
Card · boleto · transfer
Confirmation

Travel

Vouchers & documents
Recommendations
Contact agency

The information architecture keeps the trip as the center of gravity: everything hangs off the client's current proposal.

13Validation

Tested with the people who would live in it.

Wireframes were presented to users and to developers, and adjusted to match what users expected to see and what the team could build. During that phase, we made sure that every single requirement was captured by the mockups.

Wireframes for the Dalí trip-planning system

The clickable prototype then went through acceptance rounds: travellers and agents performing the real tasks, find a hotel, swap it, comment, check out, with us watching where they hesitated.

The rounds trimmed the design rather than reinventing it: labels renamed to the travellers' own words, the mix & match tray made permanently visible, and the checkout reduced to fewer, calmer steps. When the tasks stopped generating questions, the design was ready for the pixel-perfect handoff.

14Development handoff

A 30-page spec so the build matched the design.

We created a clickable prototype on InVision, but also a detailed document covering all interactions, a PDF with 30+ pages making it clear to the development team how the tool should behave, look and feel. This was instrumental in reducing rework and back-and-forth between team members.

This is an important part of the process, alongside the specs file, also created and provided to the team, which contained the pixel-perfect specifications of the screens.

Development handoff documentation and specs for Dalí

15Results & conclusion

A streamlined experience for travelers and agents alike.

The biggest shift was in the agents' time. A proposal that used to take around two days of manual assembly, hunting content across documents and spreadsheets, requesting fares, and laying out a PDF, can now be put together in about an hour, with cities, hotels, and live flight options pre-loaded in the system. Revisions that used to mean redoing the document and booking another meeting became same-day adjustments the client sees instantly.

~90%
less time to assemble a proposal
~1h
from briefing to a shareable proposal (was ~2 days)
0
agency visits needed to review and adjust a trip

Travelers got a better deal too: instead of a static PDF that aged with every change, they can open the latest version of their trip anywhere, on any device, share it with companions, and adjust it on their own.

Dali Travel's emphasis on customer satisfaction and innovative features set it apart from traditional travel-planning tools, one that caters to the modern traveler's needs and preferences.

Nothing here was decorative. Every artifact earned a decision.