Responses by Mediasoul.
Background: The Lorelei Londres website is the digital home of one of the most important and historic hotels in Italy. An ancient villa first belonging to members of the Roman imperial court, it became the privileged refuge of artists and poets who were fascinated by the unique charm of its view of the Gulf of Naples. The hotel has fervently inspired narratives, travel diaries and legends dedicated to the myth of the sinuous mermaids of this land—a myth that flows through the origin of the hotel’s name: Lorelei Londres, legend and charm.
Its guests—mainly Americans and Brits traveling in Italy for honeymoons, culture and enogastronomic tourism—are enchanted by its suggestive position. The official website emotionally resonates with the target audience by enabling potential guests to savor all the variations of a memorable journey and discover an extraordinary territory.
Design core: The center of the project is the visual storytelling to which we wanted to assign a decisive role. The images were organized with a precise logic that catapults visitors into the story.
To do this, we studied a typographic style that captivated the eye using a palette of sober and harmonious colors. This defined the development of the page layouts and gave rhythm to copy, enabling us to develop a more incisive visual storytelling approach. We aimed to surprise visitors, stimulate them with reading the copy and keeping them visually engaged on the website.
Divergent paths: For the hero page, we had initially imagined the use of a female face—taken up with the rule of thirds—intent on “breathing” the breeze that envelops the Gulf of Naples. It was decided, however, to emphasize the importance of the history of this hotel instead and enhance its memory in accordance with the wishes of the management and the property. We kept the copy in the direction of arousing synesthesia, while simultaneously preserving the will of the management by using a background image that frames a facade of the historic hotel overlooking the sea.
Navigation structure: The navigation menu was designed in continuity with the visual approach. When the hamburger menu is selected, a panel opens that hosts the sections of the site. We created a microinteraction on the desktop version to preview the content by clicking on the section to make the invitation to learn more appealing.
The navigation of the pages is accompanied by a light, sober, noninvasive motion design that helps improve the pleasantness of scrolling. This point has been preserved and maintained in the responsive layouts to make visiting the mobile site effective.
Technology: The keywords for this project were efficiency and effectiveness. We used WordPress to give the client a certain degree of autonomy in managing content and allow them to master the use of an open-source platform in total freedom.
We’d also like to reiterate this concept from our previous feature on the Capo La Gala site for this project as well: We at Mediasoul like to consider ourselves “web artisans.” We love to start all our projects from scratch. There is no visual composer, no projecting tool or any kind of template: only well-written code. Apart from the well-defined basic skills we all know about—HTML5, CSS, etc.—we tried to take advantage of everything we had at our disposal in order to enhance the UX and UI.