Save scientists' time by summarizing large amounts of information in a digestible way using AI

A computer monitor displaying a scientific research software interface on a blue background. The interface shows chemical structures, networks, and related data.

Overview

The Science Engine is a powerful platform that allows our users to apply ML models to their workflows, creating huge efficiencies and allowing for new capabilities.

Working with pharmaceutical and bioscience customers to improve their workflows with our platform. I was responsible for leading this project's design efforts, including defining the actual problem, ideation through design refinement, contributing to the user testing plan, and handing off the high-fidelity design specs within a tight timeline to meet an aggressive milestone.

Role

Lead UX Designer

Timeline

2 months

The challenge

How can we synthesize data from thousands of medical papers so scientists can find molecules that degrade specific disease-causing proteins quicker?

What is Science Engine?

A platform that helps users make sense of unstructured data through AI

With partners like UCB to empower scientists to speed up the discovery and development of breakthrough medicines

To find molecules that degrade specific disease causing proteins

Three pages of a PDF document titled 'Canada Rankling Recommendations.' The document appears to include a table, text, and sections discussing recommendations, classifications, and assessments. The pages are black and white, with structured content and numbered paragraphs.

Read thousands of research papers

Scientists spend large amounts of times reading through dense literature to find specific models that might be relevant to their use case

A digital interface showing a table titled 'Molecule data' with multiple rows and columns, used for scientific or chemical data entry.

Compile associated data

They collect individual numbers, parameters, and concentrations from numerous external data sources such as PubChem, patent libraries, and models from Science Engine

Table titled 'Molecule data' with rows marked by red X's and one row with a green check mark, indicating data status.

Make final decision on list

After all of this data collection, a full story of each molecule is created allowing the scientist to make an decision on which ones will be likely candidates to move forward

Target users

Two scientists, a woman and a man, wearing lab coats and protective goggles, examine data on computer screens in a laboratory.

SME Scientists

  • Discovering connections

  • Validating a hypothesis

  • Identifying meaningful signals

  • Making informed predictions

A man in a blue suit working at a desk with a computer displaying a bar and line graph.

Info Investigators

  • Finding something similar

  • Comparing resources

  • Summarizing various resources

Why the old Science Engine designs weren’t cutting it

The current flow

To get to AI generated content, users need to import their data onto the platform and apply a model

In the current experience, an entire page is generated per each individual model applied, resulting in many pages with no way of seeing the collection of results in one view

Screenshot of Project Science Engine with dataset and model outputs, showing a focus on Model F Output and relationship data for treatments.
Diagram showing a machine learning model giving input to Dataset A, with an alternative pathway shown as an arrow leading to Dataset B, which is marked with a red X.

Finding models

Model discovery is limited to a user exploring the current model catalog, which places more responsibility on the user to search and find relevant models for their data

Screenshots showing a data table called 'Data' and model results for similar molecules in a project science engine interface, with columns related to treatments and chemical outputs.

Connecting models

Specific models only work with particular data formats and subject matter types within each dataset

This can lead to users unknowingly applying the wrong model to data that is the correct format but not the subject matter leading to null results

Screenshot of a document management software interface showing a document titled 'Document Understanding' by Ali Meyers with updates and tags, and content sections with placeholder text about model description and discussion.

Current outputs

It can be challenging to distinguish between the presentation of data and model results, as there is often little visual distinction

This can make it challenging to recognize the role of AI in the process and hard to quickly understand what's going on

Project goals

A blue square icon with horizontal white lines representing a menu or list.

Synthesize data

Create a full story summarizing all the necessary information about a specific entity

Blue square icon with a white chain link symbol in the center

Provide data access

Allow the user to quickly jump into all of the data associated with each model so they can incorporate it into their workflow

Close-up of a blue square button with a white remote control symbol

Make AI visual

Make it obvious which content is AI generated and make it easily digestible

Why the old Science Engine designs weren’t cutting it

Knowing this project had a time constraint and every moment counted, I initially established points of contact within all teams that would touch this new feature to leverage their diverse perspectives and ideas

A virtual presentation slide showing six colored circles with labels: Design, Research, Engineering, Program Management, Executive Leadership, Scientists, arranged in a grid on a dark background.

Team collaboration

Met with cross functional stakeholders to fully understand edge cases, constraints, and business objectives

A detailed digital diagram or mind map with numerous colored sticky notes and labels, featuring names of people, sections, and categories related to a workshop or presentation, including various organizational and instructional content.
Blue paper with black text that reads "AI-generated TLDR for each canvas/page" and purple and white plus one icons scattered across the paper.
Yellow sticky note with black text that reads, "What if there was a 'view' summarizing multiple models in a top sheet," adorned with three green thumbs-up stickers.
Green sticky note with black text that says, "Make AI Model outputs more editorial & Visual 'Digestible Nuggets'" and a red heart icon.

Ideation design sprint

Facilitated a design sprint to leverage the team’s diverse set of perspectives to generate potential ideas and align expectations

A purple square with text that reads, 'Be able to display relevant model content based on the subject matter of the page data,' decorated with two yellow star stickers on the top right corner.

Design ideation

Ideating through potential solutions ranging from small incremental changes to entirely new design formats

Screenshot of a computer screen displaying a data management or project management software with a table showing file names and summaries. The interface includes menu options for Files, Home, Edit, Help, model catalog, suggestions, copy to scratchpad, export, and view details. The table has columns for File, General Summary, and Query-based Summary, filled with placeholder text and file names.
Screenshot of a computer screen displaying a document analysis software interface with sections titled 'High Level Batch Summary of Documents' and 'Document Level Summary'. The interface shows icons for PDFs labeled 'Pubmed Article 1' to 'Pubmed Article 5' and other document management features.
Screenshot of a data analysis software interface with sections for Model Catalog, Suggestions, Copy to Scratchpad, and Export. The main workspace displays a document summary with placeholder text, and a sidebar on the left showing multiple PDF file icons titled '<Name of the PDF file>'.
Screenshot of a chemical analysis software displaying a molecule structure with a diagram and molecule predictions, including a summary and data on toxicity, patent, and interaction likelihood.
A digital screenshot of a research document management software interface showing a draft guidance document titled 'Guidance for Industry Developing Products for Weight Management.' The document contains marked text, including a black border around a paragraph explaining the purpose of the guidance. The interface includes a sidebar with PDF files, a toolbar with options like save, export, and view details, and a right-hand panel with document summaries and top article references.
Screenshot of a scientific software interface displaying molecular structures, formulas, and related data in a grid layout on a the 'Molecule Prop Prediction' tab.

Design Refinement

Refining the design directions through review and feedback sessions with users and the team. We ultimately landed on a two-column framework that consisted of several different types of sections, making it flexible enough to tell the story of different entity types in an editorial and visual way

A screenshot of a research chemistry software displaying a molecular structure and related data, including toxicity, patent, and interaction likelihoods, with a list of chemical file names on the left.
Screenshot of a scientific research software interface showing a molecule prediction for an organic compound, with a chemical structure diagram, related diseases, relevant papers, and a 3D network model. The molecule is 2-(Ethycarbonyl)-4,5-difluorophenylboronic acid pinacol ester.
Screenshot of a scientific analysis tool displaying data about a specific molecule, including its chemical structure, relevant disease connections, similar molecules, and related research papers, with labels indicating features like descriptive data, relevant model outputs, and related content.

Validation

Getting our customer's affirmation that the designs would solve their specific needs. UCB was able to help organize and order the various sections to how they would want to consume them in their workflow.

Screenshot of a molecular understanding software showing information about aspirin, including its chemical structure, synonyms, predicted side effects, related diseases, and relevant clinical trials.

Bioscience Customer

“This would save us so many hours of work…”

Pharmaceutical Customer

“I like how this tells a story
of each molecule.”

A computer monitor displaying a scientific research software interface with molecular data, chemical structures, and connection graphs, set against a blue background.

Final design

The new AI Hero experience showcased relevant ML models based on the data the user imports onto the platform. Once the molecules from the data are identified, we surface digestible and editorial sections representing entire outputs from various models. The user has all the information needed about a single molecule eliminating the need for the user to scour numerous resources for this desired data and showing just how valuable these models can be for their workflows.

A digital infographic showing a network graph of chemical compounds related to aspirin, with a sidebar listing details such as chemical structure, synonyms, side effects, and clinical trials.

Telling a story

We organized related content in two separate columns based on what scientists would use it for. After validating the content itself and the order in which it appeared, the experience of the molecule AI hero view tells a complete story of the molecule in focus.

Chemical analysis report for Aspirin including its molecular structure, synonyms, toxicity prediction, absorption, distribution, metabolism, excretion, predicted side effects, and retrosynthesis prediction with chemical structures and SMILES notation.

Descriptive data column

This section groups all the information we could pull for a specific molecule. All the complicated data points that scientists scour for in one spot in a framework that gives the user what they need to know.

Screenshot of a biomedical research webpage showing a network graph of molecules related to aspirin at the center, with links to clinical trials, similar molecules, and relevant diseases, including diagrams of similar chemical structures of Coumadin and Clopidogrel.

Relevant data column

We added all related content to the selected molecule in the right column. Any related, similar, or relevant information can easily be skimmed and added to a scientist's workflow, all from one view.

Flowchart showing categories of models for a section, with dropdown to view relationship types and a focus on viewing underlying data. The chart includes labeled options for existing and predicted diseases, with clickable links to details about each disease.

We synthesized the data

Creating a framework that communicates top relevant information that a user can quickly skim allows them to scan for interesting bits before diving into the entire dataset

The underlying data is always just a few clicks away allowing users to incorporate interesting information into their workflows

Provided data access

Each section is a condensed highlight of an entire page of data. We made it extremely easy to access the underlying data of each section. This enables them to efficiently incorporate data relevant to their use case.

Diagram showing data flow from three datasets labeled Data A, Data B, and Data C into a table with sections labeled A, B, and C. Arrows indicate data moving from the datasets to specific sections of the table.
Screenshot of a scientific data table showing chemical structures, with molecular formulas, related clinical trial information, and a diagram of the chemical structure of the drug clopidogrel. The background is blue and includes text related to drug hydrolysis prediction, clinical trial references, and chemical information.

Made AI visual

Visually anchoring the image of the selected molecule helps users quickly identify the connecting factor between all the information. We also added visual elements such as document thumbnails and entity images to sections to make the results easier to consume.

Diagram of molecules connected by lines, with a central node labeled 'Aspirin' and multiple other molecules branching out. Different types of lines indicate top connections, related topics, confirmed relationships, and suggested relationships.

Displaying the knowledge graph!

We display a visual representing relevant connected molecules and the neighboring clusters with confirmed and suggested relationship paths. We pulled this data from the GNBR++ database, a commonly used resource by scientists.

Being able to pivot the sections

Each section is a model output and sums up the results in a digestible way

Screenshot of a digital database interface showing a list of diseases and their associated treatments, with a dropdown menu highlighting the option to 'Alleviates, reduces' under treatment effects.

Following the release…

The first version of the molecule AI Hero experience was successfully launched by the target deadline and met all the significant needs of our users while aligning with business objects. Some compromises needed to be made with engineering to make this milestone include not having underlying data appear on its own tab, more interactive capabilities within the related molecule knowledge graph, and adding more visual representations of the editorial sections. These elements are planned to be incorporated into future versions of the experience.

Impact

  • Saved scientists countless hours in their process of developing life-saving medicines

  • New platform feature that summarizes mountains of data in a visual way

  • Allows access to all connected data from each model

Lessons learned

  1. When moving fast, communicate with as many stakeholders as possible and frequently

  2. Temporary compromises are worth it to move toward the end goal

  3. Prototypes are your friend when working under a tight timeline