lol.travel

Positioning a new travel brand in the world, improving brand identity, conversion and retention rates

Activities
UX design
Prototyping
User test
UI design
Icon & illustration design
Front-end development
Duration
9 months
Stakeholders
CEO, COO, CTO, Marketing Manager, Customer Care, Content Manager, Frontend and Backend developers, SEO responsible, Sales responsible.
lol.travel cover case study

Achievements

+27%

Conversion rate

+74%

Upsell of additional services

-21%

Calls to customer care

-12%

Bounce rate

The client

lol.travel is one of the main Italian online travel website for comparison and booking: flights, hotels, holidays and car rentals. The lol.travel brand is part of Hotelbeds Group. Despite being a new born brand, lol.travel has twenty years of experience and relevant figures on annual turnover with more than 230,000 hotels, over 4000 airlines and low cost companies, exclusive holiday packages and more than 60 Tour Operators with a dedicated multilingual customer support.

Visit website: lol.travel

Context

The intentions of lol.travel were clear and precise right away: improving their portal performances through a bold user experience and brand identity renovation, in order to enhance brand memorability and increase customer loyalty. Goal: quickly become the leader in online booking, internationally, not only for the Italian market.


From the very beginning lol.travel has totally relied on our experience giving us utmost trust, essential to work freely, but with the awareness of having to deal with a reality that generates large figures, where choices and strategies have a large-scale impact.

An international project based on these large figures, oriented towards a “mobile-first” design that doesn’t actually neglect the desktop experience: these are some of the challenges we had to face and overcome as a team.
"I immediately realized that Tangible’s working method was completely focused on users needs and would make us reach new paradigms and look at the industry from the perspective of an insider/expert. The final result is really satisfying. Now, our website offers a simple and fluid user experience, especially from mobile devices."

Paolo Bergamaschi

Head of Marketing

Transformation and trust

Transformation


Together with us, Lol.travel has gone through a bold image and product strategy renewal. Designing a meaningful user experience, able to transform the brand awareness of lol.travel within the online booking market, allowed us to build the fundamental identity bases for future brand marketing strategies.

Trust

From the very first meetings, during the process of domain exploration, we established a clear connection that lasted for the following 9 months. A relationship made of participation, of complementary and spontaneous confrontation, of technical-strategic feedback. This kind of relationship has been crucial for a good work of co-planning. The presence of two structured teams has created a valuable multidisciplinary interaction that involved numerous roles from both sides of our teams, such as: Product Owner, Customer Care Office, Marketing Department and IT Department, Researcher, Experience designer, Visual designer and Front-end Web Developer. This multidisciplinary union has made it possible to organize meetings, workshops and co-design sessions of high design value.

two photos: in the one on the left a hand holds a smartphone with a screenshot of the site; on the right a laptop and a hand holds a smartphone

Semplificare la complessità in 9 mesi di iterazioni



lol.travel presentava un vasto e complesso ecosistema di prenotazioni online tra voli, hotel, noleggio auto, secret deals e pacchetti vacanze volo+hotel. Era quindi fondamentale capire quale sarebbe stato il prodotto pilota per avviare la ri-progettazione dell’intero ambiente di booking online. Dopo alcuni incontri con il Product Owner, il reparto IT e il reparto Marketing, abbiamo mappato insieme le 3 milestone sulle quali pianificare in dettaglio una roadmap di attività più estese.




I bisogni dichiarati dal business esprimevano la necessità di mettere in discussione e riprogettare l’esperienza di acquisto dell’intero flusso di prenotazione dei biglietti aerei in un periodo di 3 mesi. L’obiettivo era quello di portare gli utenti a vedere in lol.travel un partner fidato per la prenotazione delle proprie vacanze. Il nostro piano di progetto su questa milestone prevedeva il miglioramento del flusso di acquisto del biglietto aereo offrendo all’utente un’esperienza esplorativa, comparativa e di scelta del proprio volo che corrispondesse ai propri desideri e necessità di acquisto. L’ascolto attento dei bisogni sia del business che degli utenti (attuali e potenziali) ha portato alla progettazione di un nuovo funnel d’acquisto, secondo il modello di Acquisition-Activation-Retention-Revenue-Referral, che ha avuto come risultato un aumento significativo del conversion rate.

Examples of Desktop mockups
Design board showing user flows on mobile

Grazie al completamento di questa prima milestone, i due team hanno avuto modo di conoscersi, tarare i processi e gli strumenti di lavoro tenendo il focus sulla scadenza. Fase conoscitiva che ci ha permesso di indagare a fondo il dominio delle prenotazioni online e di comprendere le dinamiche di monetizzazione del business model di lol.travel, acquisendo consapevolezza attorno ad un ambiente tecnico altamente articolato e sfidante.




Una volta conclusa la riprogettazione dell'intera esperienza d'acquisto dei biglietti aerei abbiamo iniziato ad affrontare le altre milestone pianificate. Queste prevedevano la riprogettazione del funnel di prenotazione del soggiorno in hotel (focalizzando l'attenzione sulle email transazionali di conferma o cancellazione) e della nuova area riservata. All'interno di quest'ultima, l'utente potrà ritrovare le prenotazioni fatte in precedenza e avere accesso a scontistiche e servizi personalizzati.




In soli 9 mesi di lavoro, pianificando rilasci rilevanti ogni due settimane, abbiamo riprogettato e rilasciato l’esperienza di ispirazione, comparazione, acquisto e gestione delle proprie prenotazioni di biglietti aerei e pernottamenti in hotel, punti di contatto per lol.travel importanti per stabilire fiducia con il proprio target cliente. La vicinanza temporale e l’iteratività tra fase di ricerca, progettazione e sviluppo ha portato ad avere una continua validazione delle scelte di design, sia dal lato business ma anche da quello tecnologico e dell’esperienza utente.

Conoscere per progettare soluzioni significative

Progettare senza sapere chi è la persona che utilizza o che potrà utilizzare il servizio (utente attuale e potenziale), può portare ad ottenere come risultato una progettazione che non tiene conto dei bisogni, dei desideri e delle abitudini degli utenti. Le conseguenze? Clienti non fidelizzati, basse performance e mancate conversioni.

Codesign sessions photos
Project team retrospective - User test sessions with users

Durante il corso delle iterazioni abbiamo svolto tre sessioni di ricerca volte ad indagare aspetti di usabilità dei processi d’acquisto di biglietti aerei e soggiorni in hotel, come anche a raccogliere informazioni sulle abitudini, i bisogni e i desideri degli utenti durante le loro esperienze di prenotazione viaggi dai siti competitor. Abbiamo scelto di effettuare una ricerca di tipo qualitativo per analizzare a fondo gli aspetti di usabilità dei funnel d’acquisto (volo e hotel) e dell’area riservata, capendone i momenti wow e i pain point. Durante le interviste in laboratorio abbiamo utilizzato diverse metodologie di ricerca tra cui test di usabilità, esercizi di card sorting e di prioritizzazione dei bisogni, interviste esplorative.




Durante le sessioni di user test, abbiamo usato prototipi interattivi molto dettagliati che hanno consentito di simulare scenari e task realistici e conversare in modo diretto e concreto con le persone intervistate, consentendoci di mappare gli eventuali ostacoli rilevati in fase di test e, una volta tornati in ufficio, andare a progettare possibili soluzioni migliorative.

Un linguaggio di design identitario


La sfida era quella di partire dall’esplorazione dell’identità di lol.travel finora presentata online, individuare gli aspetti più importanti per la sua riconoscibilità e infine costruire una base più solida di linguaggio identitario per il futuro. L’efficacia dell’esperienza d’acquisto è fortemente dipende dalla presentazione di informazioni complesse attraverso un design chiaro che guida l’utente alla ricerca, alla comparazione e alla scelta.




Abbiamo così costruito una serie di nuove linee guida visive maggiormente consistenti rispetto all’identità fino ad ora comunicata, ridefinendo ed estendendo la brand identity di lol.travel.




Riguardo alla tipografia, abbiamo scelto un solo carattere, il Rubik, i cui lineamenti morbidi rendono l’impronta identitaria forte. Questo carattere è stato scelto non solo per i suoi lineamenti e ritmi costruttivi ma anche per la sua estesa libreria di caratteri speciali che ci ha permesso di mantenere la riconoscibilità identitaria anche verso un pubblico di visitatori esteso in tutto il mondo. Un dettaglio importante da non sottovalutare.

Portions of the styleguide with colour palette, fonts and illustrations
Digital Brand identity and Icon tone of voice

Abbiamo studiato ogni dettaglio dell’interfaccia, ogni momento di utilizzo, ogni segmento di prodotto scelto, per favorire una consistenza visiva e un’impronta distintiva del brand in ogni fase dell’acquisto, dalla semplice ispirazione per la prossima meta vacanze fino alla conferma della prenotazione conclusa.




Ogni buona esperienza è costruita sulle emozioni che l’utente prova durante l’interazione con il prodotto/servizio. Così abbiamo deciso che ogni momento cruciale dovesse essere accuratamente rappresentato in un’illustrazione che facesse sentire l’utente accompagnato, passo dopo passo, nella sua esplorazione e scelta d’acquisto. È stata fatta una scelta stilistica che, in sintonia con il sistema visivo di lol.travel, ha portato lungo i 9 mesi di progettazione a costruire un set di oltre 150 icone e illustrazioni ad hoc fortemente riconoscibili e identitarie.

Some website components
Some of the interface components

Le linee guida di progettazione hanno consentito al reparto marketing di continuare un lavoro parallelo ed autonomo di implementazione coordinata di nuove attività di promozione del brand permettendo così, durante tutte le iterazioni, di mantenere coerenza e riconoscibilità dentro e fuori dal sito.

Modularità oggi, flessibilità domani

Definite le linee guida, iterazione per iterazione abbiamo progettato, disegnato e sviluppato una libreria incrementale di componenti e pagine, andando a costruire una styleguide di lol.travel estesa e coerente.




Al momento del nostro coinvolgimento nel progetto, il sito lol.travel presentava due flussi di prenotazione tra voli e hotel con componenti dell’interfaccia e pattern d’acquisto differenti tra loro. Questa diversità minava sia la reciproca riconoscibilità ed esperienza d’uso sia la loro reciproca modularità e flessibilità per implementazioni future di prodotto.




Per pianificare, costruire e mantenere una libreria di componenti aggiornata, che faciliti tutte le attività di progettazione e di implementazione, è essenziale monitorare la crescita basandosi sul principio di modularità degli elementi e sul contesto di utilizzo di ciascuno di essi. Ogni elemento, per essere considerato modulare oggi e flessibile domani, deve poter avere un collocamento di utilizzo molteplice consentendo così il consolidamento dei componenti dell’interfaccia e pattern d’acquisto che l’utente potrà incontrare e riconoscere durante la sua permanenza sul sito.

Example of a component showing flight times and duration
"Realtà competente e concreta. Metodologie che possiamo definire lo stato dell'arte del project management. Sicuramente uno dei migliori partner che abbia incontrato nella mia esperienza professionale."

Manuele Bastianelli

CTO of lol.travel

Design, observe, reiterate

Monitoring a project with appropriate tools, especially after its release, can bring enormous benefits in validation and improvements. Marketing and IT department monitored lol.travel project to allow an effective tracking of conversion objectives. Thanks to the setup of tools such as Google Analytics and Hotjar, it was possible to start a phase of accurate monitoring of purchase flows that users carry out every day to buy their tickets or hotel stays. By analyzing figures, interaction heatmaps and navigation records of users, collected a few months after the online launch, it was possible to plan interventions and improve conversion performances. This type of validation is crucial to continuously collect quantitative data of enormous value, observing and analyzing new needs, friction points, wishes and opportunities expressed by users, ensuring relevance over time thanks to an evolutionary project maintenance.

example of a page heatmap
Heat maps in Hotjar and funnel tracking in Google analytics

Project team

Martina working at the pc

Martina Ferro

Experience designer

Luca selfie

Luca Salvini

Front-end advisor

Paolo Valzania

Icon designer & illustrator

Tangiblers at work
Want more information about this project or would you like to discuss a similar project for your business?

Enter your name

Enter a valid email address

By sending this request, I declare that I am of age and that I have read the Privacy Policy