Designing an interface for all reservations
PRODUCT DESIGN
PROTOTYPING
UX CASE STUDY
Macbook Pro
our project
in a nutshell
1.
context
Libraries serve as essential community hubs that provide access to knowledge, research support, and public programming. As patrons of the San Diego Public Library system, we became interested in how these institutions use technology to manage daily operations, facilitate community engagement, and support their members.
Over the course of 10 weeks, a team of project managers, product designers, and UX researchers collaborated as freelancers with the San Diego Public Library system to redesign LibraryMarket - the central platform where library staff view comprehensive event details, create and approve pending events, and manage community programs.
role
Product Designer
timeline
Winter 2025, 10 weeks
skills
UI/UX Design
Product Strategy
User Research
team
Marie Nguyen
Irene Joo
Janhavi Shah
THE PROBLEM
Library staff members need to make precise room scheduling decisions in order to avoid frustrating scheduling errors caused by mentally cross-referencing multiple calendars and accounting for hidden event details.
the goal
To improve event management efficiency, enhance usability, and streamline the creation, approval, and organization of library reservations.
how might we...
How might we simplify the process of creating and approving events?
How might we improve the interface of LibraryMarket to make event details more easy to manage?
How might we integrate better communication and collaboration tools for event reservation planning?
Create Reservations
Never worry about
double bookings again
Macbook Pro
New reservation
Macbook Pro
Deny
Approve
Manage Reservations
Approve and stay updated on
reservation details with one click
understanding
our stakeholder
2.
Initial stakeholder interview with the Branch Manager at La Jolla Public Library
the goal
To gain a better understanding of our stakeholder’s typical workplace tasks and responsibilities, obtain insights regarding their experience with library technologies, and identify opportunities to improve existing technologies.
Stakeholder Interview Guide
Introductions + Consent (5 min)
Hi [stakeholder name], thank you for taking the time to help us with our project.
My name is [XYZ], I'll be moderating this interview and my teammate [XYZ] is going to be taking notes. Our project objective is to extend or redesign a feature of a widely-used web/mobile app or tool that library staffers might benefit from. So, the purpose of this interview is for us to learn more about technologies used by library professionals and discover insights about your specific experiences as a [stakeholder job/role].
Consent: Do you consent to a voice recording and/or taking pictures or videos of specific tasks?
I'm only going to share it with our team and the data will only be used for project purposes. We won't share the recording with anyone else. Is that ok with you?
Background questions (5-10 min)
What do you do as a Branch Manager at the La Jolla Riford Library?
How long have you been working w/ the Library?
Have you had any other roles prior to your current position?
What types of events or activities do you host at this branch?
What resources or tools do you currently use to manage events?
Task/Observation questions (35-40 min)
Walk me through a typical week at work. What kinds of tasks might you do + why?
To learn what specific tasks they do
When doing task X what technology/tools do you use? (Eg. a calendar application for scheduling events/employee shifts)
If possible, would you mind showing us these tools/software and how you use them for such tasks?
Can you describe your experience using those products?
How do you feel about the features of those products?
To get her general opinion
Are there any aspects of the product you find particularly useful or difficult?
To see if there’s any preferences/frustrations/likes/
(Ask if applicable) Can you describe any ways you overcome or deal with such difficult aspects?
To see if she has any workarounds
Wrap up (5 min)
Do you have any last thoughts, comments, or opinions that we did not discuss during the interview?
And that wraps up the interview! Thank you again for being open to meeting with us today and helping us with our project. If you have any further questions or concerns, feel free to let us know.
data consolidation
I began asynchronously consolidating our findings, color-coding them with categories such as (wants/pain points/opportunities/quotes), and using those to create in-depth summarized notes. Our team then came together for an affinity diagramming session to identify of common themes and finalize what our strongest findings were.
key takeaways
I noticed there was a common issue of a high cognitive load and interaction cost required to use library calendar systems such that our stakeholder required extraneous effort just to make scheduling decisions.
empathizing
with the user
3.
User persona and customer journey map for creating and managing reservations
the goal
After analyzing insights from our stakeholder interview, I jumped into the stakeholder’s shoes and really understand their needs, wants, thoughts, and priorities. Mapping the end-to-end journey enabled me to translate stakeholder pain points into a prioritized, refined user flow.
Tina Nguyen she/her
Tina has been working as a San Diego Library Branch Manager for about 10 years. As the Branch Manager, she helps support her library’s staff, conducts outreach, offers programming, and perform routine administrative tasks.
Goals
Quickly and efficiently book rooms for library-hosted events/programs and members of the public
Increase her workflow when organizing administrative task
Communicate with staff about updates to events and room reservations
Scenario
Tina is at her desk when she receives a phone call from a patron looking to reserve a room for a public event. The patron needs a space that accommodates 30 people and has equipments.
Expectations
Need a more user friendly way to manage event bookings
Needs an functional and intuitive system for programming purposes (one of the main things they do as a library)
Clear communication between herself, her staff, and external partnerships
filng out Reservation form
double booking error
workaround
searching reservation details
tracking pending events
“"I’m happy to help! I just need to input the details and submit."
Opens reservation form
Fills out necessary information (e.g. reservation time, date, description)
An error message appears stating there is a double booking
All previously entered information is lost.
Tina opens a second tab to compare availability
Tina refill the reservation form from scratch.
Tina searches through cluttered calendar to search for newly pending reservation
After finding new pending reservation, Tina opens it’s reservation details
Since there's no notifications page, Tina has to manually check pending reservations, leading to extra work.
Happy
wondering
Frustrated
wondering
TIRED
🙄
😡
😄
🙄
😕
aCTIONS
What does the customer do?
user Thought
What is the user Thinking?
Phase of Journey
user Feeling
What is the user feeling?
"Wait, what? I just spent time filling that out, and now I have to start over?"
"This is so inefficient—why doesn’t the system suggest an available time instead?"
"Where did that request go? I wish I could just filter by status."
"It would be so much easier if I got an alert for pending approvals."
assessing our
market competitors
4.
the goal
To evaluate existing event scheduling and management platforms in order to identify market gaps, key features, and design opportunities for improving Library Market.
Strengths 💪
Weaknesses 🤷
Opportunities ❤️
Threats 🫨
Libraries using the LibMarket system with other branches might be inclined to move to their own separate system
Integrate third party apps (eg. Facebook Events, Instagram)
More calendar view options (eg. calendar, list, card, day, week)
More effective reservation filters (approve/declined/in-progress)
Provide training and customer support services
Better printable view for calendar
No notifications for pending reservation requests or status updates by staff
No approved/declined filtering for room reservations
Lack of double-booking prevention measures
Set up/breakdown time for events is not immediately visible
Requires decent training/walkthrough to learn how to use the platform
Specifically designed for libraries, understanding their unique needs better than generic software
Connects with Integrated Library Systems (ILS) and digital catalogs
Customizable registration tool for programs
third-party event platforms could be a better fit
harder to actually integrate because its already a part of so many workflows
integration with GCal and the room reservation system could elevate
improving the UI and UX for a better navigation
maybe adding AI for automated approval for smaller things to make the process quicker
clunky UI making it hard to learn
limited flexibility and locks after a certain amount of time
not editable after submission
not optimized for mobile
status updates hard to access
provides a one-stop platform for reserving rooms, submitting paperwork, and getting funding
fully integrated with UCSD’s admin side ensuring flow
following UCSD guidelines is easier too because of the integration
other platforms have similar features for scheduling appointments that might offer more features in their free version
heavy dependency on the major platforms like zoom, google, etc. for the integration
allow user to create meetings without having to go through the booking site (as an alternate option)
in the instance that the host simply wants to create a meeting with a client, they can easily set that up
it has good integration features that could translate well into meeting creation and not limit to the booking view
delays in calendar synchronization
free version has limited features
compared to newer competitors, it lacks an AI feature that could help with scheduling optimization
good integration capabilities
links with gcal, outlook, zoom, etc.
automation features (sends reminders and followups automatically)
ability to customize scheduling links and meeting pages
Competition from cheaper or open-source alternative platforms such as Koha
Libraries not using other Springshare tools may opt for standalone platforms
Smaller libraries might find LibCal’s features unnecessary and resort to simpler platforms
Offer flexible pricing plans to accommodate libraries
Better printable view for calendar
Cost: can be expensive for smaller libraries w/ limited budgets
Dependence on Springshare: libraries not using other Springshare tools, might not get the full benefits from LibCal integration capabilities
Highly tailored to library’s unique needs
Online appointment and event integration w/ Microsoft teams and Zoom
Mobile-friendly, responsive
Customizable calendar and event page design to match library’s website
Ability to book rooms and seats via interactive maps
saturation in market with other project management tool
no current market standard
more in depth onboarding
provides novice users with templates for project setup
overwhelming and or complicated UI due to clutter
high level of customization leads to a large learning curve for novice users
offers highly customizable workflow
comprehensive reporting into project timeline and performance
key takeaways
We found TAP’s structured modules and list format particularly useful, while Calendly’s intuitive design and smooth user experience stood out as well.
TAP struggles with a clunky UI and mobile limitations, and Calendly has very limited functions.
LibCal is highly customizable for libraries with a great filter mechanism but comes with a poor way to view the reservations and calendars
While Jira offers project management capabilities, their interface can be overwhelming for new users
LOOKING AHEAD
We plan to integrate the best aspects of TAP and Calendly into Library Market while using Google Calendar as a reference for key features. The biggest opportunities lie in refining the UI/UX, enhancing automation, and improving integrations to compete with major platforms like Google and Zoom.
exploration of
design solutions
5.
drafting user flow and low-fidelity sketches
I took on the responsibility of mapping the user flow to "Create a New Reservation". Given that our stakeholder expressed the greatest amount of frustrations for this flow, I prioritized edge cases as well as implementing confirmation messages and error modals to reduce confusion.
a/b testing on mid-fidelity prototype
In order to guide future design improvements, we created two complete mid-fidelity prototypes by combining our flows and sketches. I spearheaded both variations of the 'Create a New Reservation' frames.
Note: Both prototypes share the same flow, however, take on different approaches to design.
LOOKING AHEAD
Our next step is to create a new prototype that combines users’ preferred features from Prototypes A and B in order to implement a user-centric solution that intuitively addresses our stakeholder’s pain points.
iterating through
final design decisions
6.
the goal
Once we established our plan for the next steps, it was finally time to iterate upon our user feedback and combine our 2 mid-fidelity prototypes into an ultimate hybrid high-fidelity prototype. Since our stakeholder’s primary concerns were the limited accessibility of double booking in the reservation system and the low usability of managing reservations, we designed two variations and conducted a second round of A/B testing.
Create New Reservation
key user feedback takeaways
Prevent Double Bookings Effectively: Stakeholders preferred a mandatory confirmation checkbox. This extra step ensures that users are fully aware of conflicts before finalizing their reservations.
Full-Screen Reservation Form for Better Visibility: Instead of pop-up, maintain a full-screen reservation form, as users preferred having more space to review and input details.
Logical Layout for Clarity: Standardize the form layout by placing patron details on the left and reservation details on the right, aligning with user feedback form all 3 of our interviews.
Managing Notifications and Reservation Approvals
Prototype A
Prioritizes reservation update history and detailed event visibility, featuring a structured split-screen layout
The left panel presents a clear, color-coded list of reservations, displaying key details such as event name and room assignment
The right panel provides a comprehensive view of the selected reservation and reservation details
Prototype B
Leveraged a list view with the most recent action item at the top to highlight updates on completed actions
Incorporated an accordion-style interaction, allowing users to expand reservation details by clicking the “Details” button
Include ‘Edit’ button to edit reservation details and ‘Add To-Do’ button to add tasks into their workflow
key user feedback takeaways
Improved Labeling for Better Navigation: When tasked to review and approve a reservation, all three stakeholders struggled to navigate to the “Notifications” tab. Since the purpose of the tab failed to meet our stakeholders’ expectations, we took their suggestions of renaming the tab from “Notifications” to “Manage Reservations.”
Button and Icon Improvements: Two of our stakeholders questioned whether an “Edit” button was necessary if there was already an “Add to-do” button, which indicated a lack of clarity between the two button functions. Hence we decided to add an arrow icon next to ‘View Details’ to clearly indicate the ability to expand/collapse reservation details.
implementing user feedback
Based on our feedback, we iterated once more to produce our final prototype.
try out our final prototype!
showcasing our
final product
7.
sandiego.librarymarket.com
Macbook Pro
Create Reservation
Create reservations seamlessly while staying ahead of scheduling conflicts.
Get instant alerts for double bookings, giving you full control with a simple confirmation click.
sandiego.librarymarket.com
Macbook Pro
Filter Pending Events
Stay on top of pending reservations effortlessly with the sidebar filter.
Instantly sort events by status, eliminating clutter and ensuring quick approvals with just a few clicks.
sandiego.librarymarket.com
Macbook Pro
Manage Reservations
Take control of your reservations with real-time updates.
Stay organized with project management features like task lists and to-dos, ensuring every event runs smoothly.
my reflection
and takeaway
8.
key takeaways from this project
Good design is thoughtful, tested, and continuously refined. Throughout this project, I learned that design must always be intentional—every decision should be backed by reasoning and that aesthetics alone do not guarantee the best solution. Our team continuously questioned whether our design choices would truly support our stakeholder’s workflow or unintentionally create new challenges. Even small details, like the placement of a button or the naming of a feature, influence how users interact with a product. Furthermore, I recognized that intentional design is achieved from actively listening to users and understanding their specific needs.
Good design is thorough down to the last detail— Nothing must be arbitrary or left to chance.
“
“
— Dieter Rams
contributions
Our team collaborated across various roles to ensure a user-centered and well-researched redesign of LibraryMarket. Together, our efforts ensured an intentional, research-driven approach to improving LibraryMarket’s usability and functionality.
Khoi Nguyen (Product Designer) conducted in-person stakeholder interviews and usability testing, contributed to user flows and data consolidation, and iterated through sketches, mid-fidelity, and high-fidelity prototypes.
Irene Joo (Project Manager) facilitated stakeholder outreach, organized team resources in Figma, managed weekly meetings, and contributed to user research, UI sketches, and multiple rounds of user testing.
Marie Nguyen (Product Designer) conducted three in-person interviews with the La Jolla Library stakeholder, contributed to UX research and design, and worked on competitive audits, sketches, and prototypes.
Janhavi Shah (Product Designer) scheduled stakeholder interviews, visualized competitive analysis, conducted user testing, and contributed to research, sketching, and high-fidelity designs.