Tiffany Chu UI/UX Design Portfolio

An image of BCIT Library

BCIT Library

UI/UX Design / Case Study

  • Role UI Designer
  • Tools Figma, Adobe InDesign, Usability Hub
  • Timeline 2 months

Project Scope: My goal for this case study is to explore opportunities to improve the homepage to better communicate and advertise the services available online and on-campus. After visiting the BCIT Burnaby Library, I discovered a welcoming environment that gave students a space to relax, hang out, play games, and study! I want to be able to translate the same energy into BCIT Library’s homepage.

Determine whether the libraries’ users could effectively use the website to perform specific tasks.

Research

How can the library’s complex functionality be simplified and developed to meet the main user’s needs?

The library website is used by 2 diverse users; students and faculty members each with their own goals and needs that the website needs to fulfill. The website has a lot of information and resources that may not be properly delivered to the intended user and needs to be reformulated and optimized.

User Journey Map

I discovered that a new student might not know how to start their research paper or studies. This uncovered an opportunity for the library’s homepage to guide the user with steps or links to help them start their research. The library’s website has all the tools and resources however, a new student wouldn’t know where they are or even know that they are available to them.

BCIT Library User Journey Map

User Persona

BCIT Library User Persona
BCIT 2021 Library Services Survey - Online services Awareness vs. Usage

Library Services Survey

In addition to creating a user persona, I also used the BCIT 2021 Library Services Survey to get feedback from current students regarding BCIT Library services and facilities. The key findings that stood out to me in this document helped me gain a better understanding of the current users of BCIT Library’s website.

  • 72% of students only use online services of the BCIT Library.
  • There is a gap between BCIT Library services and awareness.
  • The most commonly used BCIT Library online services are “e-Books” (29%) and “e-Journals” (21%).
  • As a primary means of communication, students prefer to use emails (69%) and online chats (64%) to ask questions.

Competitive Analysis

In this competitive analysis, we can see that there are a lot of features and services that libraries provide. This competitive analysis only scratches the surface of each website. The feature and service might still be available on each site however, they are not immediately visible on the homepage which this case study is focusing on. This chart shows that UBC checks all the boxes and this can help us see how they were able to present their services all on the homepage.

BCIT Library Competitive Analysis chart

Empathize

Usability Test

During each task, the participant is asked to “think aloud” and talk about their experience and thoughts while going through the interface. The research then observes the participant’s behavior and listens for feedback.

Tests Conducted

  • First Click Test - Usability Hub
  • Preference Test - Usability Hub
  • 5 second Test - Usability Hub
  • Card Sorting Test - Optimal Workshop
BCIT Library Usability Test screenshots

Hypothesis

Going back to the hypothesis stated in the beginning of the usability testing, BCIT Library’s bounce rate can decrease by designing a cleaner and visually appealing homepage. Services’ awareness and usage will increase if the homepage is designed to be more visually appealing with design hiearchy in mind, less clutter, and visible call to actions (CTA) buttons.

Conclusion

Visually appealing landing page is crucial to decreasing the site’s bounce rate. Improving the site’s hierarchy can also improve the information presented on the site and can make it easier for user’s to find what they need.

Design

High-Fidelity Wireframes

  • Pain Point #1: Too much scrolling & scattered information

    The BCIT Library homepage has a lot of features and information which the user has to scroll down a lot to see or locate such as the “Quick Links” section. The homepage needs to be updated frequently as it is the first place the user would go to in order to complete their goal or receive news and updates. Although there are sections already in place, there is unused space that can be better used and give room to improve the information hierarchy.

    Proposed Solution #1
    BCIT Library Pain point #1 Homepage solution screenshot
    Proposed Solution #2
    BCIT Library Pain point #1 Blogpost solution screenshot
  • Pain Point #2 Lack of onboarding and awareness of services

    The library has a lot of services that would be useful to students if they were made more aware. Although all the links to these services and features are on the website, students would have to work through the link and search for these services.

    Proposed Solution #1
    BCIT Library Pain point #2 Writing & Research aid screenshot
    Proposed Solution #2
    BCIT Library Pain point #2 Research Plan page screenshot

Validate

Feedback

Ideally, during the validation phase, the mockups and prototypes would be tested with a group of candidates to see if the design and experience have improved or needs improvement. During this case study, due to the time frame, I wasn’t able to conduct proper tests of the mockup designs however, I was able to gather feedback from stakeholders which helped improve some areas of the design. Below are the comments and improvements made on the mockup designs.

Observations

From the feedback, I observed that there was an improvement in design and hierarchy with information and content. With the suggestion and feedback, I was able to do some minor adjustments to the design. These initial designs and mockups are the first of multiple iterations to come, and I hope they can be further tested in the future.

Design’s success depends on its users.

My experience creating this case study taught me that user testing is very valuable, and more time should be spent during research and validation. Talking to stakeholders provided me with different information from talking to users. Maintaining user-centered designs and taking decisions with end-users in mind is also vital. My responsibility as a designer is to create a bridge between the stakeholders and users to meet their goals. It has been a great experience completing this case study, however, it doesn’t end here. Library’s website will need more iteration, and go through more processes of re-evaluation of the goal, design, discovery of new opportunities, and development of new solutions.

An image of BCIT Library

© Tiffany Chu // Privacy Policy