Simple Booking

1. Introduction

This project started with a minimum viable product to reduce the spread of the virus during the COVID-19 pandemic. At the beginning, we wanted to find an existing product that met our initial requirements. However, we tried twelve existing products but didn’t find anything that met our needs. Therefore, I created Simple Booking. While creating the program, I developed an engineering mindset that was integrated into my design and teaching:

• Thinking in systems
• Designing in Constraints
• Discovering the structure under the surface
• Creating reusable modules

The first version has been available for students since 2019. In the past two years, it has been used by SoDAA students and faculty more than one thousand times. After two years of use, more needs were revealed from the user groups. So, in the second iteration of the project, my goal is to improve the functionalities and design to meet the growing needs.

This project was used as the case study in my UI/UX design course that demonstrated the user-centered design approach.

User Groups

My goal for this project is to build a management system that includes the front page, management dashboard, and system administration. So, the project has three user groups: end users, space managers, and system administrators.

I have finished the design for the front page of end users. In the next steps, I will complete the design and development for the space management and system administration.

---

2. User Research

Survey

To collect the user feedback on the old version and their expectations for the next version, an online survey was sent out to about one hundred students across three departments. As a result, fifteen completed responses were recorded.

Based on the responses to the survey, most users make schedules on computers. The participants also provided their comments on the open-ended questions. To find the use needs and the design requirements, I used an affinity diagram to categorize the topics.

Affinity Diagram

Value Proposition

Based on the categorized themes on the survey analysis, the following value proposition was created that lists the expected features for the system.

1. Make a reservation
2. Check space information and current status
3. View reservation history
4. Receive email notification
5. View space announcement
6. Add the reservation page to mobile phone home screen
7. Scan a QR code to open the reservation page

3. Low-Fidelity Design

Sketching is my way of thinking. When the functionalities were confirmed, I started to explore elements and the interactions with a pen and paper. This helped me quickly produce the various solutions and document the design process.

Digital Wireframes

From the sketches, I selected the ideas that best met the design requirements and started to build the digital wireframe with Adobe XD. In this step, few details were considered so that I could test and iterate the design rapidly.

4. High-Fidelity Design

After some iterations on the low-fidelity design, I started to think about more details of the interactions and visual design.

Interactive Prototype

If the prototype is no loaded, please go to https://xd.adobe.com/view/008f7a57-7e17-4405-b009-bd37a01da70c-55dc/?fullscreen&hints=off.

Visual Design

5. Reusable Design Components

The reusable design components, or a design system, can help a team quickly extend the project and keep a consistent design language. At the end of the design, I created the color scheme and the basic UI elements, such as cards, buttons, and navigation. The creation of the design components also made the development more manageable and maintainable.

6. Implementation

The system is being implemented with ReactJS, which is a UI-component-based framework. I have finished the major functionalities of the reservation page. I am applying visual design to the system. A demo project has been deployed on a web server. This is an incremental development. I will continue completing the manager and admin pages.

7. Future Work

Currently, Simple Booking has been proven to be successful by a small group that has about one hundred users in a design school. In the future, I plan to further optimize the system design and make Simple Booking a product that meets the needs of bigger user groups. The following tasks will be done:

• Conduct marketing research and extend the user scenarios.
• Create marketing positioning map and discover more benefit of Simple Booking over existing products
• Complete the system documentation and user manual to ease the maintenance.