The brief

Since 2012, the magazine has built up a large following with a high number of subscriptions and the client wanted to offer a new resource to engage new and existing customers. They approached D3R to develop a customisable travel guide builder which could be used to explore, share and collaborate with friends in preparation for their holiday.

As well as allowing users to create their own holiday guide, the travel builder also needed to provide a location landing page where all related content and establishments could be easily linked to.

The work

Establishing the user journey was vital to the projects success as users would primarily be using the site's 'app' whilst on the move, therefore mobile UX was top priority. The app adapts seamlessly from mobile to desktop and four templates were established: World locations, Destination results, Borough results and My Guide.

The site content is bookmarked by an easy to learn filter menu that is colour coded by category (Hotels, Restaurants, Things To Do, Shopping and Bars) and bottom pinned toggles to navigate to and from your saved guide and map view.

I adapted the UI from the current look and feel of the main website but with added iconography and slightly toned down call to actions to not to distract from the map and destination photography.

The result

Suitcase already had well researched, pre-prepared travel guides for users to read. However, this new feature allows them to choose, save, share and organise their own travel guide prior to and whilst travelling.

After completion of user testing and data input, the travel guide launched in May 2018 to a great response and is attracting new users and had led to an increase in return visitors.

Users are actively creating and sharing their own guides amongst their friends.

Mobile Designs

Suitcase | Mobile, Home
Suitcase | Mobile, My guide 1
Suitcase | Mobile, My guide 2
Suitcase | Mobile, My guide 3
Suitcase | Mobile, London
Suitcase | Mobile, London 2
Suitcase | Mobile, London 3
Suitcase | Mobile, London 4
Suitcase | Mobile, Home 2
Suitcase | Mobile, Home 3
Suitcase | Mobile, Location
Suitcase | Mobile, Destination

Save & Share

As the app is not integrated with Suitcase's main site accounts, we had to develop a way for the user to save and share their guides. In order to do this, the user has to save their guide by entering their email address (in turn encouraging newsletter signups) and they are sent a unique URL for their guide. This unlocks the ability to share their unique guide URL on social media and to print off a hard copy. Another user then receives the pre populated guide via the unique URL and can amend and edit the guide to their own liking.

Saving that guide again generates a brand new URL - which creates an illusion of saved guides.

On the go

The expectation (and since reality) is for users to organise and sort their guides whilst at home/at their desks and then using their guides as a reference/directions whilst visiting and travelling to their destinations. Therefore it was imperitive that the UX wasn't interrupted across different devices despite neccesary changes in the UI, this was done with easy switch toggles to listing and map views and swipeable guides.

Suitcase | Desktop, Home
Suitcase | Desktop, London
Suitcase | Desktop, Details
Suitcase | Desktop, Home 2
Suitcase | Desktop, Location
Suitcase | Desktop, Location 2
Suitcase | Desktop, My guide 1
Suitcase | Desktop, My guide 2
Suitcase | Desktop, My guide 3
Suitcase | Desktop, My guide 4
Suitcase | Desktop, My guide 5
Visit project