Data Collection Site

D2D Cure is a crowdsource tool and informational website used by university laboratories collecting data on protein mutations to understand the relationship between structure and function.

The original crowdsource tool was built from scratch 5 years ago using older technologies (PHP). With the program growing, D2D Cure needs to rebuild their collection site to enhance usability and streamline the data submission process.

Our team transformed complex data sets and visualizations to intuitive solutions, allowing users to easily navigate complicated flows, communicate status updates, and manage mass amounts of data.

Going into this project, we understood there was a lot to learn about how the program ran and how researchers used the current website. We conducted semi-structured interviews with student researchers and the program admin to understand their environment and website needs.

Through these interviews we determined:

• The website is only used by students towards the end of their quarter-long research project.
• The current data submission process works, it just needs refining:
  • The layout of elements, navigation, and back-end code lead to a slow upload process.
  • The website is unforgiving and elements can only be changed from the backend.
  • There is a lack of clarity and communication within the website, leading to confusion and assumptions while students are waiting for their research to be approved.

Working with the program admin, we built out the information architecture of the site to identify areas of improvement. This activity revealed complexities with the relationships between pages, telling us that we need to focus on clarity to help users navigate.

Throughout the design process, we referred back to our user needs to ensure new designs solved major pain points:

Optimized layout:

• Utilized chunking elements in tables and cards to make content digestible.
• Improved visual hierarchy and navigation elements like breadcrumbs to assist wayfinding.
• Maintained uniform design to build consistency and familiarity for users.

Forgiveness:

• Added ability to edit and delete data points, images, whole protein mutation profiles, and comments to allow for mistakes.

Clarity & Communication:

• Introduced status chips tell researchers and lab admin the progress of a project and status of project approval.
• Improved comment section in each protein mutation profile for custom notes.
• Added email notifications for updates on researcher's projects.

A key user flow was the submission process for a protein mutation data profile. A student researcher is responsible for measuring the functionality of a mutation, reporting data points in a mutation profile, and submitting the profile to lab admin for approval.

The improved mutation profile highlights action items, allows for edits, and communicates status. The improved user flow of creating and submitting a profile includes clarifying details and deliberate submission button for review.

Tested our working prototype with student researchers to determine if target users could navigate the new website. Users found the new features intuitive and were able to navigate the application quickly. Minor improvements (additional resource links and displaying most crucial information first) were made based off feedback, and large feature suggestions were added to backlog due to timeline.

With the green light from user testing, we were excited to support our developers in building the new site. To ensure a smooth handoff, we made proper documentation of spacing, components, and assets. Throughout the design process, we worked with our devs to discuss the logic behind each feature, making our lives easier as we annotated final designs to clarify interactions.

We will be beta testing in fall & launch in winter. The project's impact will be measured through student researcher satisfaction and success of data submission process.

This project proved to be a big growth opportunity for me as a designer, introducing me to a new industry and collection of user needs. I was able to work closely with a group of developers who taught me more about the development process and their needs from the design team. I'm proud of what our team has accomplished and the future integration of this application into a university research program!