Booking System Library
Equipment
Project made for SFU SIAT
students who want to borrow
the equipment
Team Members:
Yan Wei
Jasper Ling
Walter Xu
Role:
User Research
Usability Test
Prototype
Tools:
Figma
Usability Study
Project Time:
2024 (Feb - April)
10 Weeks
OVERVIEW
What's the Equipment Booking System?
The SIAT Equipment Booking System allows students from the Faculty of Interactive Arts & Technology to borrow various equipment through the library website in Simon Fraser University. Students can reserve cameras, microphones, lighting kits, and more to support their coursework.
Original Website Screenshot
Context
Our Goal
Our team hoped to elevate the user experience design of this equipment booking system for SFU SIAT's students.
RESEARCH
Client Interview
Our team aimed to understand the challenges of the SIAT Equipment Booking System and the library staff's perspectives. We conducted a one-hour, face-to-face interview with Soo Oh, the equipment supervisor. He values student feedback and wants to integrate the external booking system with the internal library system.
We found that:
• The IT team created the SIAT Equipment Booking System over 20 years ago.
• The booking system is separate from the Circulation Desk system and tracks item requests by specific days.
• Usability issues include the need for manual mediation between systems.
• It only supports 1 to 2-day loans on Monday, Wednesday, and Friday.
• It can handle loans for up to 2 days.
• Students are unaware of the contents of each equipment kit.
Usability Study
After gathering our findings, we designed a heuristic evaluation study for participants to thoroughly assess the website's usability. We aimed to push users to interact with the site as comprehensively as possible through carefully crafted tasks. All participants we asked were IAT students.
Participant Usability Study
We created tasks for participants to explore the entire website, including three difficult or impossible tasks. This helped us observe how users react to challenges. We noted their difficulties and frustrations during the functions. Afterward, they filled out a questionnaire about their experiences. This feedback gave us valuable insights into usability issues. We'll use these insights for a second round of usability testing to keep improving the website.
Pre-Study Questionnaire
6
Simple questions
survey for existing system
Usability Tasks
3
3 normal tasks
3 hard tasks
Post-Study Questionnaire
4+2
4 Likert scale questions
2 Open-ended questions
Usability Testing 2
Redesign
2nd round usability
test after redesign
User Feedback
Participants provided the following feedback: the product descriptions and content lack pictures, there's no due time reminder, the functions of interactive elements are unclear, selecting an out-of-stock item doesn't trigger an error message, no help feature is available, and there's no explanation of how the calendar works.
Pre-Study Findings
It suggests that participants found the system less enjoyable, indicating possible dissatisfaction or a mismatch between the system's design and their expectations.
Post-Study Findings
It suggests that participants found the helpful system but still had negative perceptions about its overall efficacy.
Based on our user research, we propose the approach:
How might we redesign the SIAT Equipment Booking workflow to be more intuitive and visually aesthetic, enhancing the Equipment Booking experience?
ANALYSIS
Competitor Analysis
We conducted a brief competitive analysis of other online library websites to standardize our website layout better. Our study focused on observing several libraries' layout, functionality, and booking details, including Fraser Valley, Vancouver Public, and Burnaby Public Library.
10 Usability Heuristics & Affinity Diagram
We applied Jakob Nielsen's 10 Usability Heuristics and user feedback to identify and categorize all the issues using an affinity diagram. This method allowed us to systematically organize and prioritize the problems, providing a comprehensive understanding of the areas needing improvement.
Key Insights
After our usability study and analysis, we listed the pinpoints where we established the ideating results.
REDESIGN
Style Guide
The style guide follows SFU's Brand Guidelines for colours and typography.
Colour
Parimy Color : #CC0633
Secondary Color : #A6192E
Supporting Color : #54585A
Body Copy : #000000
Primary Button
Nomal
TEXT
Hovel
TEXT
Active
TEXT
Disactive
TEXT
Original —> Redesign
Our redesigned version (Main Page) is presented below based on the research findings.
2nd User Test Found:
Show how to Renew.
Checkout has a due date reminder.
Clearly show on hold to confirm the equipment users booked.
My Booking History can check the items users booked before.
EVALUATION
Presenting
Finally, we presented the entire evaluation process in class. Here is our presentation of the video:
Report
We provided a more detailed overview of the entire process. We meticulously documented each phase, from the process of the study methodology to the recommendation result. Additionally, we conducted a second round of user testing on the redesigned prototype, which is also in the report.
Evaluation Results
Here are the insights derived from the instructor's feedback and the results of the second round of user testing.
Positive Feedback 👍
• The redesigned website is enjoyable and user-friendly.
Heuristic Study and Participant Usability Study methods were compelling.
Recommendations were well-developed and implemented.
The design is appealing, and tasks are easy to complete.
Positive user experiences and practical design improvements were reflected.
Points of Improvement 👎
• Information on renewing needs to be clarified.
Affinity diagramming should find new themes, not just group by heuristic.
Connect design decisions more closely with findings.
Personal Reflections 🤔 ：
01 - Clarify Usability Study:
The application of usability study needed to be clarified. To enhance the overall user experience, it is essential to establish a more explicit connection between usability findings and design decisions.
02 - Complete the Prototype:
The prototype was not fully completed. A comprehensive and functional prototype is crucial for effective user testing and accurate feedback collection, ensuring that design concepts are validated and refined based on user interactions.
03 - Revisit Supervisor's Feedback:
The feedback from the Library supervisor insights can provide valuable guidance, helping to address gaps or areas needing improvement in the design and evaluation process. This step is vital for refining the UX design and ensuring the evaluation process is thorough and effective.
© Yan Wei. 2023-2024
UX/UI Designer