Library Companion App


About The Project
This UX/UI Design project was delivered for the client - Pratt Institute Libraries. The aim of this project was to improve the experience for the patrons of the library, thereby encouraging them to use the many services and resources offered by the Pratt Institute Libraries.
Established in 1887, Pratt Institute is a leading Architecture, Art and Design school, having campuses both in Manhattan and Brooklyn, New York. Pratt Institute has libraries on both locations as well, which are very well established and there to support students and staff to provide an excellent learning and teaching experience.
The mission of the Pratt Institute Libraries is to provide outstanding service and access to a resource-rich environment that facilitates critical thinking and creative teaching and learning in the Pratt community.
Disciplines & Tools
Stakeholder Interviews, User Research (Interviews + Surveys) & Analysis, Persona Creation, User Experience Design (UI/UX), Interaction Design, Prototyping, In-person User Testing, Adobe XD, Marvel, InVision, Balsamiq
My Role & Team
My role for this project was that of a UI/UX Designer working with two teams. 
The first team I worked with consisted of Alexandra Srp, Armando Garcia and Naman Sehgal and our focus was User Research & Analysis. The second team I worked with consisted of Hanyu Zhang and Dilasha Jain and we focused on designing the Pratt Institute Library Companion App (iOS).
My responsibilities were -
> Defining the scope & Strategy + Planning the project
> Conducting Stakeholder Workshop
> Conducting User Research (User Interviews and Surveys)
> Delivering solutions through UX Design methods and techniques
The Challenge
The Pratt Institute Libraries digital presence was outdated and in dire need for improvement. They not only wanted to improve the digital and physical experience for their many patrons but also wanted to spread awareness to other potential patrons who might not be aware of many of the services Pratt Institute Libraries has to offer.
Another challenge was the fact that they had a very limited technical capacity due to a very small team of developers. Therefore, the proposed UX solutions had to be technically feasible based on their limitations.
Stakeholder Workshop
The first step of our project was to conduct a stakeholder workshop. Our stakeholders were the Pratt Institute Library leadership team.
Our Goal
Our goal was to understand the Pratt Institute Library's - 
Vision: What does the Pratt Institute Library aspire to do?
Target Audience: Who uses our services/products?
User Pain Points: What is our target audience’s pain points?
Project Strategy: How will this project solve that problem?
Constraints: What limitations apply to our project?
Goal: What outcome will indicate the success of our project?​​​​​​​
Our Methodology
To conduct this session, we asked the stakeholders first to talk a little about the Pratt Institute Libraries and then fill out a Vision Alignment Sheet. Once they had filled it out, we asked them to talk about what they had filled in, during which we all took notes. Then we discussed key points in a brainstorming session to understand what all were the main findings under vision, target audience, user pain points, project strategy, constraints, and goal. 
Key Findings
After our stakeholder workshop session, we got together as a team, brainstormed and uncovered the following key points categorized by vision, target audience, pain points, strategy, constraints, and goal -

Key findings from the Stakeholder Workshop

Once the Stakeholder Workshop was completed and we had a better understanding of the project's context and what the vision & goals were, it was time to think about the methodology that we needed for a successful project delivery.
Project Methodology Graphic showing the following stages - User Research, Research Data Analysis, Brainstorming & Ideation, Peer Review, Wireframing & prototyping, User Testing and Stakeholder Feedback

Our Methodology for Project Delivery

User Research
Now that we had understood the point of view of our stakeholders, it was time to gain some insight about the target users, their needs, attitudes, and behaviors. Our user research team consisted of myself, Alexandra, Armando and Naman and we set out to gather information about the target audience captured from the stakeholder workshop.
Research Goals
From our research, we wanted to know the following:
> Understand users’ likes, dislikes, expectations and overall experience of the library (online + physical)
> Awareness about the services offered by the library (online + physical)
> Understand how library users interact with library services, what their process is from beginning to end (online + physical)
> Understand users attitudes and behaviors with respect to the Pratt Institute Libraries.

For our research, we categorized our target audience into two groups - Professors and Students (both Graduate and Undergraduate)
Graphic showing Target Audience - Professors/Teachers and Students (Both Graduate and Undergraduate)

Research Goals - Target Audience

We collected a total of 150 survey responses from our target audience. Our strategy for gathering responses was to circulate surveys digitally through internal Pratt groups, contact faculty/departments to send them out, utilize twitter feeds and onsite-recruitment of participants to fill out the survey. 
I, along with my teammate Alexandra, performed the on-site recruitment at Brooklyn and recruited 50 participants of our target audience to fill out the survey by offering them goodies as an incentive.
The key findings from the 150 surveys are as follows:
Bar Graphs showing top reasons for visiting the library - Number 1 being Using a research guide or database, followed by searching the catalog, then basic library information and reserving books

Survey Results: Reasons for visiting the library website

Pie chart showing library patron breakdown - 40% undergrad students, 34% grad students, 18% Faculty and 8% library staff

Survey Results: Affiliation to Pratt Institute

User Interviews
We conducted 30 semi-structured user interviews with our target audience, spanning across the Brooklyn and Manhattan locations (out of which 8 were conducted by me - focussed on Brooklyn). We also targeted users from Pratt's Learning and Access Center, to understand accessibility needs. We requested users to have their voices recorded for analysis and ensured their anonymity. As an incentive, we also offered users goodies to encourage them to be a part of the study. 
After conducting the interviews, we conducted a brainstorming session and analyzed all the data that we had gathered.
Research Synthesis: User Personas
From our research analysis, and brainstorming session, we came up with personas based on user behavior and formed 5 categories - non-user, casual library goer, light/casual researcher, intermediate researcher, and advanced researcher. We use this approach because it is not a good idea to use the user-role paradigm to create personas because that does not capture behavioral aspects, but rather captures user-role related aspects only. 
We, therefore, based our personas by carefully analyzing user behavior traits highlighted from our research. This means that Teachers and Students (grad+undergrad) can fit into any one of these persona categories based on their traits.
Visual Depiction of 5 personas ranging from non-user to advanced researcher.

User Personas

Project Brainstorming 
Once we had completed our research and understood the problem from both the stakeholders' as well as the users' point of view, we conducted a brainstorming session, thinking about what possible solutions we can deliver to the Pratt Institute Libraries to alleviate the various pain points.

Based on our discussion, we split up into 4 teams -
> Website Redesign - Improving the interaction & visual design of the Pratt Library website
> Information Architecture & Content Strategy- Improving the Information Architecture of the Pratt Library website and defining a content strategy for them.
> Physical Space Recommendations - Making recommendations for improving the physical space within the Pratt Libraries (Brooklyn and Manhattan)
> Pratt Institute Library Companion App (Mobile) - Creating a companion app for the Pratt library patrons to assist them in their needs and to reduce the workload on the library staff

I chose to work on the Pratt Institute Library Companion App (Mobile) as it really excited me and I already had a lot of ideas flowing in my mind about how a mobile app can assist patrons & the library as a whole. My team also consisted of Hanyu Zhang and Dilasha Jain, who were also interested in ideating and designing a mobile app. 
Ideation - User Stories
Once we had brainstormed the possible solutions and formed teams, our Companion Mobile App team got together with the Physical Space Recommendations team for an ideation session. 
Our goal was to keep our user personas, pain points and constraints in mind and come up with possible features that the mobile app should have that would be beneficial for the users and the Pratt Library. For this, we defined user stories to help assist with thinking about features - 
Graphic showing the user stories that were prioritized for the project

Ideation Session: User Stories

Ideation - Prioritizing Features
After defining some user stories, we teamed up with the physical space recommendations team (Alexandra Srp, Yiren Xu, Yang Cong, and Elise Fu) and started discussing some key features that would help allow the users to perform various tasks as per the stories. We created a mind map of the ideas and thought about the project constraints, timeline, and thought about how much value would each of the feature bring to alleviate the pain points of the patrons. We also decided to keep the initial app design as an iOS-only variant, since almost the entire Pratt Community uses iPhones, and all other apps by Pratt are iOS-only.
Ideation - Companion App Features
Ideation - Companion App Features
Ideation - Companion App Features
Ideation - Companion App Features
Mind Map: Ideas
Mind Map: Ideas
Ideation - Sketching
We also brainstormed ideas together in the form of sketches and quick wireframes, and came up with the following ideas to satisfy the user stories -
Sketching Ideas
Sketching Ideas
Sketching Ideas
Sketching Ideas
Sketching Ideas
Sketching Ideas
Peer Review
My teammate Dilasha and I conducted some peer reviews with the following:
> Franklin Institute
> Natural History Museum

We selected the above for peer review due to the fact that these apps were aimed at serving patrons and helping them with way-finding and resource/service discovery

Image showing screenshots of peer's apps

Peer-Review: Franklin Institute + Natural History Museum

Peer Review Key Findings
After carefully studying the peers, we learned the following -
Graphic showing Peer review findings

Key findings from the peer-review

LOW FIdelity prototype
Based on our stakeholder workshop data, user research data, user stories, ideation, and initial sketches,
I created the following low-fidelity screens using Balsamiq Mockups tool -
Image showing low fidelity wireframes

Low Fidelity Prototype Screens

Image showing low fidelity screens

Zoomed-in view of our Low Fidelity Prototype Screens

After the screens were created, I connected them to form a click/tap through prototype using the InVision tool.

Low Fidelity Prototype - Balsamiq + InVision

User Testing
Our next step was to conduct user-testing on our low-fidelity prototype, by recruiting users that fit our target demographic. We teamed up with Alexandra Srp and Yang Cong from the physical space recommendations team and performed 8 user tests, out of which 3 were conducted by me.
For the user-testing, Dilasha and I defined 6 tasks to perform on the interface and also added post-task and post-study questions.  The user-test tasks and questions sheet is available on Google Drive. We asked the users to think-aloud and we recorded their voice and screen as they performed the tasks. We ensured them that their data will be kept 100% anonymous.
Graphic showing user testing protocol

User-Testing Protocol

Data Analysis
After conducting all the user tests, we viewed the video and reviewed our user-test notes. I put in all the research data points into a User-Testing Results Spreadsheet. Then I carefully studied all our gathered data and performed analysis by doing affinity mapping -
Screenshot of affinity mapping for user test result analysis

User-Testing Results: Affinity Mapping

Key Findings
After performing the affinity mapping, I uncovered the key findings from the user-testing sessions and made necessary improvements to the low-fidelity prototype. The key findings were as follows -
Graphic showing User Testing Key Findings

Key findings from the user-tests

Positive Feedback
We also heard a lot of positive feedback about the app from the users, which was really encouraging. It helped us validate that we were headed in the right direction and that users would really find a companion app for the Pratt Institute Libraries, very helpful.
Graphic showing positive feedback quotes

Positive feedback from users

Stakeholder Feedback
After implementing the user testing changes to the low-fidelity prototype, I organized a meeting with one of the stakeholders to share the low-fidelity prototype and convey the user feedback and positive points. 
This was an important step as we needed to validate our progress and ensure that we were meeting the stakeholder's expectations.
Overall, the stakeholder was highly impressed with our progress and found the structure and functionality of the companion app very well thought through. The stakeholder was also very pleased to hear the positive comments from the users and was also happy to hear about the improvements made based on the users' feedback. We also received some feedback from the stakeholder to improve the companion app further. 
Key Feedback Points
> Labels for - 'Library instructions' should be more in line with the content strategy team's defined tone
> Having a splash screen for the app is a must to showcase our branding/logo
> Adding search filters is very important to assist with finding things quickly
> ​​​​​​​Borrow history needs to be kept locally on-device rather than on the server due to privacy concerns.
High Fidelity Prototype
After getting all the user and stakeholder feedback in place, it was time to work on the visual layer and bring forth a beautifully designed high-fidelity prototype. 
For this, our team, Hanyu Zhang, Dilasha and I, reached out to the website redesign team to obtain the Visual Style-guide, which we needed to ensure consistency and a seamless experience in all of Pratt Institute Library's digital products. Then, we started designing the high-fidelity prototype on Adobe XD -
Image showing high fidelity prototypes

Adobe XD - High Fidelity Prototype

Final Deliverable in Action
I also made the click-through prototype using MarvelApp, which can be viewed and operated below - 

MarvelApp - Library Companion App Hi-Fi Prototype

Demonstrating Animated Interactions
Our high-fidelity prototype is published and can be viewed on Adobe XD - Library Companion App.
I also created a video, in order to show animated interactions to better communicate our intended design, which can be viewed below - 

A video demonstrating the high-fidelity prototype

Final Presentation & Stakeholder Response
After the whole project was complete, we had a final presentation at the Pratt Institute Brooklyn Library. All the teams got together and created a final slide deck to present to the stakeholders. The stakeholders were extremely impressed with our presentation and deliverables. They were also super stoked about the Library Companion App and expressed a lot of excitement to bring it to life. 
Q&A Session
Due to technical limitations and a small development team, the stakeholders asked us about how the map integration into the app would work. I had already thought this through during the design phase and had two solutions in mind - 
> Google Maps API - An easy to use API to create custom interactive maps, which can be implemented without requiring a very high level of expertise, due to the highly detailed documentation available.
Image showing google maps api

Google Maps API - Custom Maps

> Pratt Institute's Game Lab - The Game Lab in Pratt Institute was developing an interactive 3D map using Unity engine. The library could reach out to the Game Lab during the app development phase for a potential way to integrate it into the Library Companion App.

Pratt Institute Game Lab's Interactive 3D Map

Working in a large team can be very challenging, which was the case for this project. I learned that it is essential to communicate with the entire team, and reach out to members working on other parts of the project, whenever needed. It is also very important to help other teams if they need your support, through careful planning, as after all, we all are working towards the same goal. Following these practices helps speed up project delivery and ensures consistency between teams. 
I also learned that it is essential to stay connected with the stakeholders and reach out to them for validation, as it helps the team understand if they are headed in the right direction and also makes the stakeholders aware of the progress of the team, thereby making them feel confident that they are in the right hands and that we will be delivering as promised. 
Oh, and also, here's a classy Pratt Cat -
Cute image of a cat that lives on the Pratt Campus

Classy Pratt Cat

---    THANK YOU!    ---


Back to Top