Project Overview
As part of my UXD/Product Design Practicum course within the Rutgers University Masters of Business and Science (MBS) program, I collaborated with my team to conduct research, assess user needs, and improve the usability and accessibility of the RCSB 3D Sequence Annotations Viewer.
Our primary solution was introducing an "Explore with SAV" button, which streamlined the user experience by offering a more direct and efficient path to the SAV tool.
Timeline: January 2024 - May 2024
Role: UXD/Product Designer
Tools: Figma
Team Members: Thalia Lantin, Tianyi Zhang, Elie Janeteas, & Srinidhi Paruchuri
Mentors & Advisors: Dr. Rupa Misra, Dr. Paul Craig, Rachel Green, Maria Voigt, Amy Wu
Background
Understanding the Impact of RCSB PBD
RCSB PDB (RCSB.org) is the US data center for the global Protein Data Bank (PDB), housing an archive of 3D structure data for biological molecules like proteins, DNA, and RNA.
With over 200,000 experimentally determined structures of biological macromolecules and 1,000,000 Computed Structure Models (CSMs), the RCSB Protein Data Bank serves as a one-stop-shop for researchers, educators, and students across diverse fields such as fundamental biology, health, energy, and biotechnology.
One key feature of the RCSB PBD website includes the 3D Sequence Annotations Viewer, which allows users to visualize sequence annotations directly onto the three-dimensional structure of a protein.
The insights gained from RCSB PBD and its 3D Sequence Annotations Viewer have a widespread impact on our understanding of key topics like human and animal health, disease dynamics, plant biology, food and energy production, global prosperity, and sustainable development.
Problem Statement
How might we effectively evaluate and enhance the accessibility and usability of the Sequence Annotations Viewer (SAV) tool?
Key Considerations & Guiding Questions:
1. Navigation: Is the transition between 1D sequence features and corresponding 3D structures intuitive and user-friendly?
2. Affordance: Is the selection process straightforward and precise?
3. Interactions: Is the highlighting mechanism accurate and responsive?
4. Exploration: Is the exploration between ions and ligands in the 3D structures comprehensive?
5. Intuitiveness: Do users find it easy to locate and interpret annotation information (such as glycosylation, active sites, mutagenesis)?
Research
Critical Analysis
Our team began our research process with an in-depth examination of the RCSB 3D Sequence Annotations Viewer from the perspective of 5 design elements.
User Research
Our user-centered research employed both online surveys and live interviews conducted over Zoom. The goal was to understand participants’ experiences while navigating the Sequence Annotations Viewer (SAV) page. The participants were asked about their usage patterns, navigational strategies, and understanding/interpretation of the sequence annotations information. Tasks included exploring hemoglobin, working with multiple proteins, and interacting with annotations within the 3D view.
User Personas
Empathizing with Our Users
RCSB PBD serves millions of users worldwide worldwide. As a result, the target users of the website are not only diverse in their backgrounds/professions but they also vary in their proficiency of 3D modeling/molecular visualization tools. This range of proficiency (intermediate to expert) highlights the need to address the needs of various user groups and to evaluate the usability of the tool from the perspective of each group
As seen below, our team defined 3 main personas the majority of RCSB users can fall into: students, educators, and researchers.
Ideation & Prototyping
Exploring Possibilities for an Enhanced User Experience
Based on the feedback from the RCSB advisors, our team narrowed down our concept ideas and created an interactive prototype that contained the following key features:
Redesigned Sequence Annotations Viewer
Blank-Slate Access from the Homepage allows users the option to access SAV first, then search molecule.
Improves efficiency by reducing the number of steps required to enter/access the SAV tool (from 4-6 steps —> 2 steps)
Addresses the navigation predictability issue by connecting the “HomePage—> Visualize—> Sequence Annotations Viewer” flow to the SAV tool rather than the documentation
The integrated search bar reduces redundancy & improves efficiency
The flow for using the SAV when starting from a blank slate can be seen below:
New SAV Button in Structure Preview
Improves efficiency by reducing the number of steps required to enter/access the SAV tool (from 4-6 steps —> 3 steps)
Quick & easy to implement from a software engineering perspective
Intuitive for users as it is consistent with current user flows to access SAV (Homepage —> Search Molecule —> Explore with SAV in 3D)
User Testing
Putting Our Designs to the Test
To ensure our designs were both friendly & effective, our team conducted a round of user testing through live Zoom interviews. The interview involved questions about the participant’s occupation, RCSB/SAV usage patterns, and general impressions of the new designs. There were also 2 tasks, which involved deliberately using the re-designed SAV feature and the new button.
Key Insights
1. Users initially did not notice the new feature while being asked to perform tasks; however, they noted that the button would be a useful tool. As a result, the visibility of the "Explore SAV in 3D" button needs improvement to ensure users can easily access them.
2. While there is a predictability issue with the “Homepage —> Visualize —> Sequence Annotations Viewer Pathway” users do not find the concept of directly entering a blank-state SAV view useful as they always search for a molecule and study its summary page before working with the SAV feature.
3. Within the redesigned SAV view, users had difficulty finding the search bar/did not find the new location of the search bar intuitive since they were used to its original location.
4. One user highlighted the desire for tooltips and the capability for more isolated ligand interactions.
Iteration & Final Design Recommendation
New “Explore with SAV in 3D” Button & New Feature Alert
Based on insights from the second round of user testing and feedback from RCSB mentors and experts, our team determined that the "Explore with SAV" button was valuable to users but needed to be more prominent, especially for seasoned RCSB users
Our solution?
Introducing a pop-up tutorial and walk-through when the feature is first launched. This interactive guide ensures that users, especially those familiar with RCSB, are immediately made aware of the "Explore with SAV" button and understand its functionality. By providing step-by-step instructions and highlighting key features, the tutorial enhances user engagement and helps integrate the new tool seamlessly into their workflow.
Reflection & Takeaways
Importance of user testing - User testing provides valuable insights into user preferences, behaviors, and pain points, guiding the development of user-centered solutions.
Diversity of users -Given the widespread use of RCSB, there is also a wide diversity in the experiences, backgrounds, and perspectives of RCSB users. As a result, our team was not only able to uncover a wider range of insights but also understand the importance of ensuring that the final product caters to a broad audience.
Balancing insights from both stakeholders/clients & target users- Through the process of evaluating & enhancing the RCSB 3D Sequence Annotations Viewer, our team recognized that successful product development hinges on integrating the goals and objectives of clients with the needs and preferences of end users.