Campus Intro
IBM CAMPUS APP
Campus Intro
IBM CAMPUS APP
Develop a native mobile app for the employees to reserve their workplace.
Campus app iOS (left)and Carbon react native system (right)
Overview
In the post-pandemic era, numerous IBM offices were still closed, but some workers needed to work at the office for their teams or clients. However, due to limited capacity in some offices, desks and room space became a competitive resource. As a result, IBMers began to seek a way to pre-book their workspace so they could go to the office freely without worrying about desk or room availability issues.
In addition, based on previous research findings, over half of people indicated that they’d use a tool to check schedules and reserve nearby rooms, and 2/3 said it’s essential to be available via mobile.
Challenge
At the beginning of the project, a website (Tririga web application) for booking workspaces was introduced to enable IBMers to reserve a workplace in advance. However, some employees tend to reserve their workspace at the last minute. Many users encountered a less-than-ideal experience when accessing the website via mobile devices due to its non-responsive design. Consequently, a significant number of users were unable to reserve their desired desk or room in advance.
Tririga web-platform tool
Objective
This project aims to develop an MVP mobile app that enables IBMers to find available desks and rooms quickly and without hassle.
The Team
Campus design thinking
Design thinking
Campus design thinking
Design thinking
User Empathy
Based on prior research, we have prioritized improving the desk booking experience for our MVP App. To better understand our users' needs, I conducted an empathy map exercise to learn what they think, feel, do, and say. Listening to their thoughts can give us valuable insights, which will help us elevate their desk booking experience.
User Needs
We have also identified a range of features that our users might need, which include the ability to:
1. Reserve a desk for themself
2. Reserve desks for others
3. Reserve the same desk regularly
4. Reserve a desk on their desired floor and building
5. Review their desk reservation history
6. Get a reservation notification
5. Reserve their favorite desk
6. Reserve a desk for a more extended period
7. Reserve a desk in their default office
8. Reserve a desk in an office near their location
9. Find a new office and receive a desk in a different city
10. Review their teammates' desk reservations
11. Reserve a desk for their teammates
Feature prioritization and MVP
MVP features
1. Reserve a desk for themself
2. Reserve a desk on their desired floor and building
3. Review their desk reservation history
4. Reserve a desk in their default office
5. Reserve a desk in an office near their location
6. Find a new office and receive a desk in a different city
User flow
Our MVP will only allow users to reserve a desk for today and tomorrow.
All design samples are copyright International Business Machines Corp. This material is not for redistribution or modification without consent from IBM.
Due to time and technical constraints, we've simplified the process. In our beta app, users can only reserve a desk for today or tomorrow.
To proceed, they choose their preferred visitation day—either today or tomorrow. Then, they select a floor from those available in their default office, pick a desk from the floor plan, and confirm the reservation. If they need to change their selection, perhaps because their default office is closed or they prefer a different location, they have the flexibility to do so. They can either select from nearby offices or type the name of their desired location. Once an office is selected, users finalize their reservation by choosing a floor and desk.
Campus design solution
Design solution
Campus design solution
Design solution
Design exploration
Based on the different user flows, I conducted several rounds of design explorations and held team discussions. I then concluded five user stories demonstrating how users can book a desk, remain at the same desk the next time they book, switch to new office buildings within the same city or in a different town, and reserve a desk in advance.
1ST ITERATION
2ND ITERATION
3RD ITERATION
4TH ITERATION
User Stories
There are two personas here: the first-time user and the return user.
Basic flow
Change location
Campus user test
user Test
Campus user test
user Test
User scenarios for testing
This test aimed to
Identify design problems and gain insights into users' behavior.
Discover if our users have any preferences when booking a desk.
Understand whether our design concepts align with their needs.
Validate our design assumptions.
Gauge user satisfaction with TRIRIGA(web-based reserving system) and understand the reasons behind their satisfaction or dissatisfaction.
Design assumptions
How I run the user test
Before the usability test, I asked the participants about their booking preferences and behavior.
I then described a scenario to them and assigned a particular task on a given prototype for that scenario.
After they clicked through the prototype, I asked them to rate their experience with the scenario (1: Extremely difficult, 2: difficult, 3: neutral, 4: easy, 5: Extremely easy) and provide the reason and feedback to improve.
I also asked the participants to rate their task experience compared to TRIRIGA (1: Extremely worse, 2: Worse, 3: Neutral, 4: Improved, 5: Extremely improved) and ask them why.
Executive summary
The design/features that users like
Book a desk for today, tomorrow or in advance in the default office
Book the same desk
Change location and select office from the map
Design improvement (In detail)
Campus-Iteration
Iteration
Campus-Iteration
Iteration
New direction
After conducting a user test, the project was temporarily put on hold. Later, it was resumed, and the team regrouped to review the design and development work that had been done and identify areas for improvement based on the feedback from the user test.
The research findings showed that most users (85.7%) visit their offices mainly for meetings. In addition, most IBM offices had reopened at the time, and reserving a desk was optional in many offices. The policy was first come, first served. Therefore, the team decided to switch to reserving meeting rooms instead. I created a new basic flow for reserving a meeting room, and then we developed a new timeline.
Regroup workshop
Reserve a meeting room user flow
New Timeline for reserving a meeting space
New design for reserving a meeting space (iOS)
Basic flow for reserving a meeting space with iOS Design system
Switch from iOS system to React Native
As the lead designer for this project, I was designing new wireframes to reserve a meeting room for iOS users. However, the design department decided to switch from iOS to React Native for all the company's native apps. This change meant that we could now develop for Android users as well. As a result, both the design and development work had to be redone. To accommodate this change, I needed to refactor the design with our new IBM Carbon design system.
iOS Design system
All design samples are copyright of International Business Machines Corp. This material is not for redistribution or modification without consent from IBM.
All design samples are copyright of International Business Machines Corp. This material is not for redistribution or modification without consent from IBM.