Alfa bank
User flow design for meeting room booking in a corporate office
- Objectives and InputsDesign the flow and define the target screens for a one-time booking scenario of an available meeting room in the central office for three employees and one guest, with additional filters such as a flip chart and a projector.
- Problem StatementA large, well-structured organization sets strict requirements for its internal services. Alfa-Bank already operates a unified internal office management system that consolidates core processes. As part of its ongoing development, the system requires a new feature: meeting room booking.
01. User Research Insights
The product is a B2B service, and its primary audience consists of company employees who are already accustomed to established booking patterns from other corporate systems (Microsoft Teams, Outlook, Google Calendar, Jira). Therefore, preserving familiar user patterns was critical to reducing cognitive load and speeding up the booking process.
Mind map
02. Key Considerations
Proper handling of filters
Confirmation of Successful Booking
After booking, the user needs to understand:
Potential Risks
- highlighting the key parameters — floor, time, booking duration, number of participants, and equipment;
- Reducing the risk of booking errors and unsuccessful scenarios;
- Designing a lightweight and intuitive flow without a complex multi-step structure. In an overloaded booking scenario, users may forget critical steps.
Confirmation of Successful Booking
After booking, the user needs to understand:
- the meeting room has been successfully booked;
- the booking status is clearly visible;
- the required equipment is included in the reservation;
- a guest pass has been issued;
- notifications have been sent to other participants.
Potential Risks
- uncomfortable meeting conditions;
- inefficient use of meeting rooms (shortage for other teams, user may book a room that is too small or unnecessarily large);
- employees spend excessive time cycling through options;
- guest pass not issued (the guest will not be able to access the office).
03. Key Problems
Before generating ideas, I identified three priority problems that needed to be addressed within the meeting room booking flow.
- How can we help users quickly find and book a suitable meeting room so they don’t waste time searching and comparing options?
- How can we integrate guest pass issuance for external visitors into the meeting room booking flow so that users don’t forget important related steps?
- How can we clearly confirm a successful booking and all associated steps, ensuring users are confident that the meeting is fully organized?
Flow
04. Idea Generation
In the initial stage, I used simple sketches to define the basic structure for all screens. After selecting the approximate layout of key elements, I proceeded to outline the main functionality for each screen. The focus was on identifying the steps the user needs to take and on which screens.
The result was a compact user flow detailing the user journey, reflecting the key actions at each stage. Additionally, for the test project, I captured all major insights in a Customer Journey Map (CJM).
The result was a compact user flow detailing the user journey, reflecting the key actions at each stage. Additionally, for the test project, I captured all major insights in a Customer Journey Map (CJM).
Эскизы, формирование структуры экранов
CJM
05. UI Mockups
Main Updates and Refinements
When creating the mockups, I initially focused on the basic scenario of selecting an available meeting room and adding participants. While considering how I would personally want to book a meeting room quickly, I encountered some solutions that required reworking. A more detailed analysis revealed that not all key steps and dependencies were accounted for—for example, choosing an office shouldn’t distract the user or take too much time. Therefore, I revised the user flow and adjusted the screen structure, fixing the user to a specific office and moving the office-switching function to the top of the interface.
When creating the mockups, I initially focused on the basic scenario of selecting an available meeting room and adding participants. While considering how I would personally want to book a meeting room quickly, I encountered some solutions that required reworking. A more detailed analysis revealed that not all key steps and dependencies were accounted for—for example, choosing an office shouldn’t distract the user or take too much time. Therefore, I revised the user flow and adjusted the screen structure, fixing the user to a specific office and moving the office-switching function to the top of the interface.
During the prototyping phase, I implemented several major adjustments to improve usability and perception. One of the key changes involved the placement of the filter system. Initially, the filters were located at the top of the screen, which seemed logical for quick access; however, with a large number of parameters (floor, capacity, equipment, etc.), this approach led to visual overload.
To make the selection process more intuitive and familiar, I moved the filters to a side panel while keeping only the most important sections at the top. This approach was inspired by booking service interfaces, such as Booking.com and Airbnb, where a sidebar allows users to easily compare available options without losing context.
To make the selection process more intuitive and familiar, I moved the filters to a side panel while keeping only the most important sections at the top. This approach was inspired by booking service interfaces, such as Booking.com and Airbnb, where a sidebar allows users to easily compare available options without losing context.
Варианты структуры
06. UI-kit
As part of the project, I created a UI kit based on existing interfaces and visual solutions from Alfa-Bank. To develop it, I analyzed corporate references to ensure consistency of interface elements, components, and visual patterns with the bank’s overall design system. This approach accelerated the design process, maintained a unified style, and allowed existing components to be adapted for new meeting room booking scenarios.
Ui-кит
07. Additional Considerations
The meeting room booking functionality has potential for further expansion and optimization. There are numerous opportunities to make the process more intuitive, efficient, and personalized. Below are several ideas and suggestions that, in my opinion, could further enhance the user experience and increase the system’s value for employees.
- Interactive office map: to quickly understand the location of a meeting room in relation to the workspace and key office areas.
- Booking history and templates: to allow users to quickly book a room for recurring meetings or repeat previous bookings. This could be incorporated into the "My Bookings" section.
- Additional filters: Based on testing, additional filtering needs may be identified. Following the “7 ± 2” rule, no more than 7 filters should be displayed at once; if there are more, an “Other Filters” icon can be added to house the remaining options.
- I considered implementing a priority system for bookings (low/high). For example, if a booking has low priority, the user could contact the person who made it to discuss a possible reschedule. Currently, I have implemented the ability to navigate from the main bookings table directly to a chat with the user who booked the meeting room, allowing them to discuss rescheduling if needed.
08. Reflections and Conclusions
Working on this task was an exciting opportunity to explore user patterns and anticipate all needs within the given context. The project highlighted the value of drawing inspiration from existing services, as well as the need for unconventional approaches when designing complex B2B systems.
Additionally, working with a real—but incomplete—design system (more precisely, a UI kit) presented a minor challenge: I had to adapt existing components to new scenarios and find solutions for missing elements, all while maintaining interface consistency.
Ultimately, the project demonstrated that combining user research, careful flow design, and adaptation of familiar patterns enables the creation of functional solutions that genuinely address user needs and improve efficiency within the company. Moreover, additional collaboration with the team could help refine decisions and generate new ideas, making the final product even more polished and aligned with employees’ needs.
Additionally, working with a real—but incomplete—design system (more precisely, a UI kit) presented a minor challenge: I had to adapt existing components to new scenarios and find solutions for missing elements, all while maintaining interface consistency.
Ultimately, the project demonstrated that combining user research, careful flow design, and adaptation of familiar patterns enables the creation of functional solutions that genuinely address user needs and improve efficiency within the company. Moreover, additional collaboration with the team could help refine decisions and generate new ideas, making the final product even more polished and aligned with employees’ needs.
Forming the structure of screens
Forming the structure of screens
Mobile screens
Figma Prototype Animation