Responsive UI Design for an Online Booking Web Application

Summary

A European travel and hospitality company building an online meeting-room booking web app had a complete desktop UI design but no mobile-optimized version. INNERLUXES's responsive-design UI specialist created a mobile version from the desktop wireframes in two weeks — introducing mobile-specific patterns while fully preserving the desktop visual style and brand. The approved design went straight into the app's frontend development.

About the Client

The Client is a European company in the travel and hospitality industry. It owns several business centers with multiple conference rooms, which it rents out to companies and representatives who need a place to hold a business meeting.

The Challenge

The Client had a web application under development that would let users select a suitable meeting room, book it, and pay for the reservation online. While it had a complete UI design for the web app's desktop version, the Client lacked a mobile-optimized design to provide a quality user experience to mobile users as well.

The Solution

INNERLUXES's UI designer, focusing on responsive design, took on the task of optimizing the desktop UI for mobile.

In two weeks, INNERLUXES's design expert created a mobile version of the desktop UI based on the desktop wireframes provided by the Client. Even though mobile-specific UI elements (hamburger menu, bottom navigation, etc.) were introduced to ensure mobile user satisfaction, the visual style of the desktop UI was fully preserved and kept in line with the Client's brand book.

The Results

• The mobile UI was approved by the Client and used in the frontend development of the web app.

Technologies and Tools

Sketch, Zeplin, Adobe Photoshop, Adobe Illustrator.