Hotel Arts

Website

Foundation

With reservations and bookings happening through 3rd party integrations, bulk of the functional requirements were already take care of leaving the user experience and user interface to take shape from the ground up. Navigation consolidation proved to be key in figuring out how user categories could be grouped.

For example, "Stay & Play," in one section catered to customers looking to stay at the hotel, enjoy the amenities and dining experiences while exploring Calgary. "Meet & Celebrate" as another section, was catered towards corporate events, weddings, off-site catering, etc. With so many sub groupings, the home page needed to act as a catch-all component to the entire experience. A discreet sub navigation also needed implementing under such broad sections to help guide the user towards other related sections they might be interested in exploring.

Sketches

A series of repeatable grids had to be imagined for various content types which would aid in keeping front end development hours nimble. Early on it was clear that the heavy emphasis on grids in and of itself would act as a refined layout tool capable of portraying a sleek, stylish and polished visual outlook.

Wireframing

Due to minimal overall hours allotted towards the project, wireframing proved to be a relatively quick phase in which a rough indication of the home page and a section for rooms were given the most attention. Pushing the wireframes towards mid-fidelity also helped in keeping iterations short making for the transition towards the design phase much more efficient.

Style Tiles

Style tiles as a method of narrowing down stylistic treatments was utilized for elements like typography, colour, iconography, etc. Hotel Arts already had some robust brand standards in place which made this phase a breeze.

Colour Palette

The hotel aspect of the site was set to incorporate muted tones and let the visuals dominate the sensory experience. Yellow Door Bistro and Raw Bar on the other hand had some personality that needed to come forward which was highlighted by more vibrant tones. All three sites however shared the same colour palette albeit with different forms of emphasis creating a sense of harmony between them.

Typography

Montserrat
With Hotel Arts using Gotham as their primary typeface in all communication material, Montserrat seemed an obvious web safe counterpart. With outward elegance and refined aesthetic, Montserrat with its abundance of weights had no problem drawing attention to and away from headings, sub headings and body copy. The typeface remained consistent even throughout the two restaurant websites.

Iconography

With such an overbearing emphasis on imagery and little need to add iconography in terms of visual support, the defined iconography was extremely direct. It provided visual relief in instances where heavy floods of colour became too dominant and guided the user where appropriate during navigation.

High Fidelity

The team at Hotel Arts were very receptive to the designs that were put forward and the burgeoning response of positivity was immense. A common stylistic thread weaved through the colour palette and typography brought the overall aesthetic towards a well balanced state of harmony.

view it in action

Calbridge Homes

Like their homes, the online presence needed to reflect a level of quality while maintaining unparalleled ease of use.


view project

Hearing Loss Clinic

With an unbelievable amount of content comes an opportunity for consolidation with a focus on education and products.


view project