Connecting clients with their ideal luxury getaway, quicker.

Having started out as a relatively small family business offering tailor-made villa holidays in the Mediterranean, The Thinking Traveller owes much of its early growth to word-of-mouth recommendations. It wasn't until much later, in 2016 - having heeded many of their clients' requests for them to be able to book and manage their trip online, instead of solely over the phone - that a new team of UI designers & front-end developers was finally established within the company's ranks.

Their task? Putting an end to almost two decades of digital being the 'elephant in the room', and discovering whether luxury travel aficionados - both within and out of the organisation - would respond to a new, modern offering.

Fast forward nearly two years, and the team has doubled in size, added countless features & improvements to the company's online platform, and made their patented brand of unforgettable experiences more accessible than ever before.

Of these improvements, none were perhaps quite so ambitious as a complete overhaul of the property search flow, featuring a new interactive map interface.

It's easy to understand why the company prides itself on its customer service team - a meticulously handpicked roster of specialists, each with a peerless understanding of their native region - they collectively offer an immense pool of local knowledge that helps them match each client with their ideal property.

By analysing a sample of enquiry forms submitted by prospective clients & picked up by the local specialists, it came as little surprise to discover that among the most important factors for clients when deciding on a property was its location - specifically, relative to a particular town or amenity. However, I also discovered that many prospective clients - particularly first-time visitors - would often be put off by the hyper-local terminology employed by search results, more often than not prompting a call to a local specialist in order to clarify.

For example, searching for properties in Palermo - the regional capital of Sicily - would yield zero results, despite two properties residing in Mondello: a small borough to the north around half an hour's drive from the centre but most definitely within the city limits. To make matters worse, the wording of the search response - the 'empty state' - offered no hints nor encouragement to assist visitors in repeating their search with more success.

A quick call to a local specialist would have promptly remedied any confusion. But then, what use is having a website?

Although an argument could certainly be made that this geographic schema is more 'correct', the findings prompted a wider debate surrounding the purpose - and potential - of the website itself, and it was eventually decided to undertake a holistic redesign of the search UI/UX flow. This was, you might say, the 'nuclear' option; technical limitations prevented us from improving the search algorithm itself (for example, including results near a region), as well as testing new features individually using an A/B methodology.

To make the property booking experience more accessible for newcomers, I had the idea of introducing a map interface alongside the existing result cards: not acting merely as a superfluous visual aid, but as a genuinely useful addition to the search & discovery journey.

The first step, however, was to re-engineer the existing elements on the page in order to avoid overwhelming visitors with too much information at a time.

Adopting the principles of progressive disclosure, the result filters (i.e. price, occupancy) were relocated from the cluttered sidebar and abstracted into a new flyout menu bar, elegantly separating each filter into its own view. Once a view is collapsed, its summary remains visible in the menu bar, in order to indicate the currently set criteria at-a-glance.

The property cards were also redesigned to be more legible and compact, allowing us to display more results at a time by displaying cards in a two-dimensional grid which intelligently responds to six different device profiles - ranging from small smartphones all the way up to 4K screens.

Coincidentally, our internal SQL database already housed the lat/long coordinates for each property. These were extracted into JSON before being fed into the Google Maps API, and presto - searching for properties now revealed not only a list of cards showing their vital information, but also their precise location plotted on a map.

To truly solve the original issue, however, we had to establish a visual relationship between each card and its counterpart map pin. Building on top of the API, we introduced code that highlights each pin when interacting with its respective card, and vice versa. Each interface is a reflection of the other; the map only shows pins for properties that fit the current search criteria; conversely, zooming or panning the map to a particular region will have the effect of showing cards for only the properties visible on the map.

For a period following the initial rollout of the redesign, we gathered feedback from clients (both new & returning) over the phone. Feedback was near-universally positive, with our target audience praising the ease-of-use afforded by a 'familiar' tool like Google Maps; returning visitors, who had already used the site previously, responded positively to the UI improvements described at the beginning of the process.

In addition, data gathered from Google Analytics revealed that visitors who went on to complete their booking typically spent considerably less time within the isearch journey. The bounce rate (compared to the same period a year previously) also saw a significant decrease.