A digital first hotel with a contactless experience
citizenM

A digital first hotel with a contactless experience

Project Summary

citizenM’s cheerful interiors and super friendly staff have earned them many avid fans amongst their guests. The project translates these values into a complete overhaul of all digital platforms, including the website, in-room tablet, checkin kiosk, and a brand new mobile app at the center of it all.

Services

Strategy, Concept, UX/UI Design, Mobile Development, Architecture, Application Monitoring and Hosting.

Video

About the app

The new citizenM digital ecosystem is centered around the mobile app, which lets guests do everything from booking, to checking in, opening room doors (Android only), controlling lights, blinds and temperature and ordering food.. This “contactless” journey has never been more relevant than today.

The app enables a complete A-Z mobile hotel journey. From booking, to checking in, opening room doors, controlling lights, blinds and temperature, ordering food, and going on curated tours of the city.

A “contextual card” sits prominently on the dashboard, offering the most relevant next action based on where guests are in the hotel journey. Less time wasted clicking around menus means more time left for real-life conversation and smiles. 

The journey can be picked up seamlessly on other touchpoints. An in-room tablet features room controls that pick up where you left things on your phone, all in the same familiar design.

A city guide section curated by citizenM and its employees expands the journey into the city, and creates conversation starters between staff and guests. Another fun feature is the “citizen passport”. Guests can collect stamps, for example by visiting hotels, just like the good old physical passport days. 

A stand-out feature of the project is how visual design and animation translate the lively, fun and colorful vibe of the hotels to the digital experience. From custom-produced animated photography used in headers, to joyful yet informational moving background textures of the room controls.

Easy checkin in less than 30 seconds
Easy checkin in less than 30 seconds
The dashboard shows the most relevant action
The dashboard shows the most relevant action
Control the blinds, climate, curtains and mood
Control the blinds, climate, curtains and mood

Our goal

The objective was threefold. First of all it was to bring the joyful and playful brand DNA to life throughout all digital journeys and platforms. To bring smiles, color and playfulness, while at the same time being absolutely functional and easy to use. 

Secondly, the goal was to re-invigorate and once again live up to citizenM’s image as an innovative hotel that wants nothing to do within lines at check-in, stiff hotel staff, dreary curtains and continental breakfast.  

An additional strategic objective was to expand the citizenM experience beyond the walls of the hotel, and into the city.

citizenM is your local guide, highlighting the best spots in town
citizenM is your local guide, highlighting the best spots in town

Strategy and process

As citizenM’s guests hold the brand values dearer than guests of most other hotels, it was those values that formed the foundation to the project. A roadmap and strategic document was created around them. 

Instead of starting from features, lots of time was taken to build a digital UI brand book first, so all touchpoints would go together seamlessly.

Some of the spearheads were:

  • Design that is playful, colorful, and even a little odd at the time;
  • UI that makes mundane tasks such as check-in more efficient;
  • Having a curated city guide section, so guests can rely on the citizenM’s impeccable taste not only within the hotel, but throughout the city

A lot of time was spent understanding the brand and journey. From sleeping at the hotel, to back-of-house tours, to talking to staff and the customer support team.

In monthly design workshops, which were often held at the hotels, design, brand, tech, management and hotel staff came together. One of the goals was to continuously re-evaluate the overall vision of the app and other platforms to adapt to recent developments. 

User testing was done periodically and in-situ to keep validating assumptions.

The app offers an easy and fun booking flow
The app offers an easy and fun booking flow

At last

Functionality and playfulness can often be at odds. The citizenM platform, and the mobile app in particular, marries focused, super functional UI, with color, animation, imagery and copy that makes you smile. The citizenM brand in a nutshell. 

Bringing all levels of the company together in one space (design workshop) over and over has gradually transformed citizenM’s thinking and way of working. From wildly creative, but chaotic and fragmented digital initiatives, to equally creative ideas now finding their way to well-planned roadmaps, to be iterated on and realized through scrum. citizenM is now, well and truly, ready to keep living up to their brand values.