Traveler, an app for iOS and Android

Same idea, brand-new product

Traveler —Viajero in Spanish, the name on the app— grows out of an old concept of mine, Yourney: a marketplace of self-guided tours made by local guides, with one free stop to try, micro-prices and one-tap payment. I wanted to keep the problem and the features, but not the app: name, brand, architecture and design are all new.

The brief was clear: iOS and Android, following each platform's guidelines, and truly bilingual, in Spanish and English, because the traveller arriving in Madrid and the one leaving Madrid need the same thing in different languages.

I did the whole project in Figma, in the order I follow with any client: first the market and the users, then the structure, and the interface last.

A growing niche that still needs a push

I started by sizing the opportunity with market data. Spain welcomes almost a hundred million international visitors a year, and most experiences are still sold away from the phone. App-based self-guided tours exist, but they are still a minority: one traveller in eight has tried one.

The product takeaway is direct: if the format still has to be discovered, price and a free trial have to remove all the risk of trying it. And trust doesn't come from a synthetic voice, it comes from a person: nine in ten travellers think a local guide is the best way to get to know a place.

Eleven apps, and nobody in the sweet spot

I analysed six direct competitors, self-guided tour and audio-guide apps, and five indirect ones: marketplaces with a guide present, free tours and place discovery. I read their App Store and Google Play listings and, above all, their users' complaints, which is where the missing design lives.

The pattern repeats: cheap means generic —synthetic voice, AI-generated content, lists of places— and authentic means expensive: a guided marketplace tour costs €15 to €60, and VoiceMap $4 to $20 per tour.

Eight decisions born from complaints

Each design decision points at a specific complaint from competitors' users or at a gap in the matrix. They then became MVP requirements, prioritised with MoSCoW, and hypotheses to measure.

Four tabs and four journeys

The app is organised into four destinations: Explore, Map, My trips and Profile. On iOS it's a Tab Bar and on Android a Material 3 Navigation Bar, in the same order, so someone switching phones doesn't have to relearn anything. Onboarding and guide mode are cross-cutting flows.

I mapped four journeys with their branches: discover, try and buy; take the tour offline; change the language; and, for phase 2, the guide creating a tour. The first two are the ones tested in the clickable prototype.

Hierarchy first, colour later

Twelve low-fidelity wireframes cover the whole flow, from onboarding with the language picker to rating the tour. Grey and unbranded, to discuss what goes on each screen and in what order.

The important calls were made here: the free stop ends with the unlock in view, payment is a native sheet over the tour page, and the player puts the video on top and "Next stop" always within thumb reach.

A pin, a play button and four colours

The logo is a location pin with a play button cut out of it: the place and the guide's video in a single mark. On the app icon, a dotted route hints at the tour's stops. The wordmark uses Fraunces, a warm editorial serif, in lowercase.

The palette is short on purpose: navy for text and structure, burgundy for what's actionable, steel blue for accents and information, and cream as the background, because pure white fights with the city photos. White on burgundy passes AA contrast.

The city up front, the interface behind

The photos of Madrid and the portraits were generated with AI in Higgsfield, all with the same late-afternoon light so everything feels like one brand. The maps are real: OpenStreetMap tiles with the tour route, a pin for each stop and proper attribution.

The tour page answers, on a single screen, the three doubts from the journey map: who the guide is, exactly what's included and whether it's worth it. That's why it carries the rating broken down into stories, route and video, and the "Try for free" button next to the buy button.

One click switches the whole screen's language

Every interface string is a Figma variable with two modes. Switching a frame from Español to English translates the entire screen, and each variable carries its code name for iOS (L10n) and Android (R.string), ready for development.

I designed with the longest text, Spanish, which runs around 25% longer. Formats are localised too —1,99 € versus €1.99, 2,4 km versus 2.4 km— and the app language is independent from the tour language: you can use the app in Spanish and take a tour in English.

All 13 screens exist on iPhone, following the Human Interface Guidelines, and on Android with Material 3: a navigation bar with a pill indicator, top app bar, bottom sheets, Google Pay and 48 dp touch targets.

The two key flows, end to end

The Figma prototype links all 52 screens with 164 connections and four starting points: iOS and Android, in Spanish and in English. Long screens scroll under a fixed navigation bar, and carousels and filters scroll horizontally, just like the real app.

The video walks through the flow that matters most: explore, open a tour, try the free stop, pay with Apple Pay, find it downloaded in My trips and take it stop by stop, all the way to the final review.

One app, two native platforms

The mockups place the real Figma screens inside an iPhone and a Pixel, so what you see is the exact design, and it updates if the design changes.

Six hypotheses ready to measure

Traveler is a concept: it has no users, so I don't show conversion figures I haven't measured. What it does have is every decision tied to a real complaint or a market gap, and six hypotheses written with their metric so they can be tested.

The next step is a usability test with five or six travellers —half Spanish speakers, half English speakers— on the prototype, and three guides publishing a test tour. Then iterate and open phase 2: the guide app.