Adagio

Responsive Webdesign.

Adagio started under another name as a client project made with Gregorio Gasperi and Giulio Zecca in January 2014. This is an evolution of the concept developed in that occasion. I decided after a few months to revive the project and refine a few things in order to put it in my portfolio. This is what came out in the end. As a general information, the service offered by our client is a travel agency that organizes cultural itineraries between Italy and Germany. The name adagio, is the Italian for "Slow" but also a term used in musical composing. Since it's a service that offers slow-form tourism itineraries in the musical world the name fit quite well in the concept.

Some screens of the survey app

Use of Photography

Being a Travel website, I tried to focus on good photography as it's one of the best and most elegant ways to convey the feel of a place. The carousel in the homepage, as well as the hero in the single itinerary, show a full bleed picture. Also the itinerary list only uses the pictures to present the various offers of the agency.

The survey completion The survey completion

The Itinerary

The itineraries are presented with a long scrolling page working with snaps in the desktop version. In order not to bore the user, the slides are equally divided between text screens, fullscreen pictures and lists of Events or Sightseeing programs. At the end, a call to action allows the user to proceed with the reservation. In the upper part of the screen, a submenu will lock itself to the navbar, allowing the user to smoothly jump from one section to one another.

The survey completion The survey completion

The Reservation and the UI

Highly inspired by the amazing reservation interface used in the redesign of Virgin America, I decided to use the same simplicity in the different stages of the registration process in Adagio. Clean and minimal stages allow the user to focus on the completion of the task, whitout cramming the interface with radio buttons and fields to fill in a single screen. Also the UI was designed following this idea of simplicity.

The survey completion The survey completion

Responsiveness

The entire website was designed mobile first. The content is fluidly adaptable in all formats (tablet and smartphone) and in most cases follows a single column layout to semplify code and mediaqueries. The responsive menu stays in the background and is discovered with a slideout movement.

The survey completion The survey completion

Styleguide

Adagio is an exclusive travel-service that offer a totally inclusive package. Having as a target middle to upper class families and couples, the style had to be elegant and clean. For this reason a serif was chosen as the corporate font, alongside a modern and sharp sansserif for a good contrast and the interface elements. Yellow and black were chosen as a good combination to express elegance and exclusivity. Overall the feeling of the brand wanted to be sophisticated, yet modern.

Typography and colors

See on Behance