Mobile-first design for hospitality

Project: Defining and creating an online presence

Client: Castello di Ugento

Category: Travel & Leisure

Responsibilities: Concept & Identity development, User Experience Design, Interaction Design, Visual Design

The challenge:

Masseria Le Mandorle is a former farmhouse and newly restored boutique hotel, situated in the town of Ugento, in the Salento region of Puglia, Italy. It's the second hotel by the d'Amore family and following on from the highly successful Castello di Ugento project and as their preferred UX and design agency, we worked on together to define and design the identity and online presence for their sister property, Masseria Le Mandorle.

The client wanted to set themselves apart from the typical hotel and masseria  ('Farmhouse' in Italian) style hotel websites by promoting their key differences which could only be demonstrated through amazing imagery. They also wanted to show the relationship to Castello di Ugento while conveying Masseria le Mandorle with its own distinctive personality and highlight the property as 5 star in its own right, especially during the peak season as off-peak, the hotel serves as a student base for the Culinary Institute of America's semester abroad for Italian cuisine.

Our approach:

We started out with a research sprint where we collected visual and functional inspiration through moodboards and as part of a wider landscape review. As we needed to work remotely, we used Invision’s ‘boards’ so we could easily create a creative guideline which included a selection of  appropriate tone, mood, colours, typography and interactions we felt met the brief.

In the next sprint we focused on creating two user personas and their stories through an empathy mapping workshop. That was followed by a customer journey framework where we could map out their different "stays" at the hotel, and how Masseria Le Mandorle would be there to suit all of the differing user needs.

ux-sketches-design-sitemap-le-mandorle-website
ui-pattern-interaction-design-inspiration-le-mandorle

We opted for a simple yet elegant responsive website design that allows the visuals of the hotel's attributes to speak for itself. By incorporating large visual images with strong headlines we could highlight the hotel's features without cluttering the interface.

We combined this with playful illustrations that compliment the logotype. The design is modular and scalable and enables the client team to easily update, rearrange differing components to reflect their changing priorities and proposition from off-peak to peak.

To tie Masseria Le Mandorle together with Castello di Ugento we inverted the font styling to try and achieve a mother and daughter aesthetic. The body font at Castello di Ugento became headline font for the masseria. The logo and colour choices was based on the natural palette of Salento, the blue from the ocean and the light and sandy tones from the Ugento houses and Puglia's historic landscape.  Alongside the mobile-first website design, we were also commissioned to visualise key branding components for within the hotel.

The results:

branding-design-style-guide-font-pairing-inspiration-ui-designs-sketches
mobile-responsive-ui-design-ux-inspiration-le-mandorle-hotel
mobile-responsive-ui-design-ux-inspiration-le-mandorle-hotel
mobile-responsive-ui-design-ux-inspiration-le-mandorle-hotel

The website is now live and we highly recommend a trip to Puglia and Masseria Le Mandorle when you next get the chance. It will be a 5 star experience and the region and hotel has something for everyone, whether you're looking for an active holiday with walking or cycling exploration-a-plenty or for a relaxing week  by the sea. Visit the website now to book your stay.

Next Up:

More case studies:

Get in touch with the team to discuss your idea, project or business.

Large Furthermore logo in white