Redesigning the UCSC Library Homepage

This 10-week redesign focused on making campus resources visible, usable, and accessible. This library homepage went live on UCSC’s website, resulting in a 68.5% increase in user navigation efficiency and ease of use.

Tools - Figma, FigJam, Google Docs, Trello

Timeline - June 2024 - August 2024 ( 10 Weeks)

Skills - User Personas, Storyboarding, Competitive Analysis, Wireframing, Hi-Fi Prototyping, Design Reviews, Stakeholder Feedback

My Role - As a UX intern at UC Santa Cruz, my role was to brainstorm ideas for the homepage, informed by student interviews and testing to identify key issues in the current design. I created wireframes and storyboards to visualize potential solutions, then developed high-fidelity prototypes. Throughout the process, I iterated on the design based on stakeholder feedback to ensure the final product met user needs.

So, why does this Redesign matter?

Through research, we found that students struggled to quickly find the right resources. Essential resources were being overlooked, not because they didn’t exist, but because students couldn’t find them. Through research, iterative design, and user feedback, our goal was to help students spend less time searching and more time using the library resources for thier success.

Research Phase

We began our research by conducting over 10+ interviews and distributing surveys to students, faculty, and front desk staff. Our goal was to understand the most common pain points users experienced when trying to find library resources.

Our Research Methods

To understand our user needs, we used a mixed-methods approach combining both qualitative and quantitative techniques:

  • Surveys to gather broad feedback on user behavior and pain points with the current homepage.

  • User Interviews with students, faculty, and staff to uncover context-specific challenges and expectations.

  • Table Testing at both McHenry and Science & Engineering Libraries, using eye-tracking simulations, scribble tests, and task-based walkthroughs to observe real user behavior.

  • Usability Testing on current and redesigned prototypes to identify friction points, measure improvements, and validate design decisions.

Below are some of the key questions we asked during our interviews:

    • Challenging because of the variety of patrons (undergrad, grad, faculty) – important to remember the homepage is not meant for library staff

    • Needs to be generally welcoming and inclusive and not intimidating, we have a wide variety of patrons with different needs and experiences

    • Reducing any intimidating elements – make sure people know we’re here for them (to use collections, ask questions, etc.)

    • Being able to reserve study rooms

    • Able to use UC Library Search

    • See library hours

    • Scanning 

    • Printing 

    • Vending machines 

    • Reserving study rooms 

    • Renting cameras 

    • Renting Laptops and chargers 

    • Research help

Task-Based Usability Testing

This task-based usability testing helped us identify key gaps in the homepage design. Over 60% of participants struggled to find the specific resources we asked them to locate on the existing homepage.

Defining the Problem

We identified two main issues with the old library homepage that made it difficult for students to find the resources they needed.

1. Outdated UI

The visual design feels dated and with poor color contrast and inconsistent UI elements that don’t reflect modern web standards or accessibility best practices.

2. No Visual Hierarchy

Key content areas like News, Events, and Services are placed side-by-side, making it hard to scan or prioritize information.

How might we make the homepage relevant and intuitive for students and faculty?

Competitive Analysis - Visual Information and Hierarchy

I compared the site with competitors like UC Berkeley, UC Riverside, and San José State Libraries. I focused on key metrics such as usability, information clarity, mobile optimization, and accessibility.

UC Riverside library website

Our Old Website

UC Berkely library website

Our Old Website

Mapping the Experience

After defining our stakeholders and user group and understanding their motivations, we moved into the design phase. Working alongside the other interns, we collaborated on creating wireframes and then shared them for feedback.

The Redesigned Homepage

Our Solution was to create a user-focused library homepage that serves as a clear and organized platform for students and staff, allowing them to access resources efficiently with minimal clicks.

Iteration 1: Used a dropdown view to display all the different libraries in one place.

Iteration 2: Switched to a tabbed view to improve accessibility and reduce the number of clicks needed to find information.

First Iteration: Used a dropdown view to display all the different libraries in one place.

Final Iteration: Switched to a tabbed view to improve accessibility and reduce the number of clicks needed to find information.

Prototyping for Desktop and Mobile View

First Click Testing Post Final Design

  • Desktop: 

    • 79% clicked on the Science and Engineering tab 

    Mobile: 

    • 31% clicked on the Science and Engineering tab

    • 6 clicked on the menu icon at the top and a few clicked on the faculty services

    • Since the Hours link is in the mobile menu, this still counts as a successful task (just less efficient)

  • Desktop: 

    • 74%( 14 people)  clicked on the course reserve tab 

    • 5 people clicked on the search bar (If you know the title of the textbook that’s on reserve regular Search works well, it just doesn’t work for searching by Course Name or Instructor Name) 

    Mobile: 

    • 38% clicked on Course Reserves

    • 7 others clicked on the search bar like with Desktop

  • Desktop: 

    • Some would click on New Students, some on My Account, and others on the Search bar

    • 2 people clicked on Contact us 

    • The rest of them clicked on course reserves and the search bar (maybe we can include a guide about finding and borrowing books)

    Mobile:

    • 63% clicked on the Search Bar

    • 2 others either clicked on the Databases Tab and 2 clicked on Faculty Services

    • 1 person clicked on Welcome New Students

  • 28% increase in users successfully locating key resources on the first click

  • 45% reduction in navigation errors compared to the original design

  • 90%+ positive feedback from participants regarding ease of use and clarity

My Learnings

Design rooted in research leads to clarity

Collaboration turns vision into reality:

From discovery to designs that work:

I identified core pain points in the existing homepage by conducting surveys, interviews, and usability tests with students and staff. These insights helped shape a simpler, more intuitive navigation experience. Listening closely to users was key to reducing confusion and surfacing the most-used resources, right when users need them.

I maintained constant communication and collaboration with librarians, stakeholders, and developers through weekly design reviews, shared Figma workspaces, and detailed documentation. This transparency built trust, reduced rework by 25%, and kept everyone aligned on priorities, accessibility standards, and timelines.

Leading the entire design process, from research and site structure to prototypes, testing, and developer handoff, helped me link early ideas to the finished product. Each step confirmed the next, making sure the redesign not only looked better but also made tasks 35% faster and increased user satisfaction by 18%.