SCREEN

Why Scientific Websites Lag in UX and How We Can Fix It. Making scientific resources accessible and easy to use
Redesigning a research-heavy tool to make genomic data more accessible and usable for scientists.

Introduction

SCREEN is a web-based tool that allows researchers to search and visualize candidate cis-Regulatory Elements (cCREs) from the ENCODE dataset. While the platform is scientifically powerful, the existing interface was difficult to navigate—especially for users without a computational background. This project focuses on reimagining how complex genomic data can be surfaced and navigated more clearly, without compromising the depth researchers need.

My Role

Led the end-to-end redesign: user research, stakeholder alignment, wireframes, and product strategy

Team

1 Designer (Me)

2 PI's (Stakeholders/Product owners
2 Engineers

Timeline

Work in progress
(currently at the wireframing stage)

Defining the problem

The current SCREEN interface lacked usability and modern UX patterns. Despite its powerful dataset, users often struggled to:

Users were unclear on what the tool could do
Find and filter relevant genomic data
Use key features without feeling overwhelmed

Like many scientific tools, SCREEN was built around data—not users. The challenge was to create an interface that could balance scientific rigor with intuitive UX, making genomic exploration more accessible without oversimplifying.

Screenshots of old interface

Problem statement

How Might We... help researchers & scientists confidently explore complex genomic data—regardless of their computational background?

Research

Coming from a non-scientific background, I began by building a foundational understanding of genomics—enough to confidently navigate SCREEN’s interface, terminology, and common user workflows. This early learning phase was critical in identifying usability issues and ensuring my design decisions would align with real-world scientific needs.

I met with the lab’s two Principal Investigators (PIs)—who also served as product owners and expert users—to understand their goals, constraints, and vision for the redesign. These conversations helped clarify the tool’s intended audience, current pain points, and the level of scientific fidelity expected.

Key points they cared about

🧬

Keep it scientific

Stakeholders emphasized the importance of maintaining a scientific look and feel, even as we simplified the experience.

👩‍⚕️

Know your audience

The core users are clinicians and researchers exploring specific gene regions. Many are highly skilled in biology, but may not have computational expertise—making accessibility a priority

🎯

Prioritize clarity & usability

There was a shared desire to make SCREEN intuitive and efficient without oversimplifying complex data.

The stakeholder meeting helped me understand not only what the product owners wanted but also who the platform ultimately serves. Based on these conversations and early exploration of the existing tool, I created a representative persona to guide design decisions.

Insert User Persona

Heuristic Evaluation

I conducted a high-level heuristic evaluation of the existing SCREEN platform to identify usability gaps. This helped highlight areas where the interface lacked clarity, or created friction for first-time users.

UX Priorities

Search Is Critical, But Visually Deprioritized.

Search is the main entry point for users—whether they’re looking up a gene, genomic region, or cCRE. While it is present on the homepage, it gets visually lost among dense information and competing UI elements. This makes it harder for users to quickly orient themselves and begin their task, especially when search should feel like the natural starting point.

Dense Layout, Low Visual Hierarchy

The interface presents large amounts of complex data without clear grouping, prioritization, or progressive disclosure. This results in visual overwhelm, making it difficult to scan, focus, or understand what to do next.

No Onboarding or First-Time Guidance

The site assumes prior familiarity, offering no onboarding, walkthrough, or contextual guidance. For new users—especially those without computational backgrounds—this creates a steep learning curve and increases the risk of user drop-off.

Navigation Lacks Orientation and Flow

At multiple points, it was unclear where I was within the site’s hierarchy or how to return to a previous screen. Page titles were hidden within side drawers, and the back-navigation relied too heavily on browser functions rather than built-in UI cues.

Competitive Analysis

During stakeholder meetings, I gathered a list of related industry websites to better understand the current design landscape in scientific data tools. I analyzed their onboarding flows, UI patterns, and navigation structures to identify what works—and where common usability issues persist

Key insights

👍 User Onboarding Matters

Some websites offered helpful videos or FAQ sections that made getting started much easier for first-time users.

👎 Navigation Was a Common Weakness

Most platforms lacked clear, intuitive navigation. Only one (Open Targets) stood out for having a well-structured layout.

👍 Communicating Updates Is Rare, but Valuable

Few platforms clearly showed version history or updates in data—something that could build trust with users.

👎 Outdated UI Components

Many tools relied on outdated design systems, resulting in a dated look and poor usability, especially for complex tasks.

UX Goals

Based on stakeholder input, heuristic evaluation, and competitive research, I defined four guiding UX goals for the redesign. These helped anchor my design decisions and ensure alignment with real-world user needs.

UX Goals

Make search the hero

Bring search forward as the primary user entry point, clearly positioned on the homepage.

Clarify navigation

Introduce stronger hierarchy, visible page titles, and more intuitive backtracking.

Support discovery

There was a shared desire to make SCREEN intuitive and efficient without oversimplifying complex data.

Simplify data interaction

Design intuitive filtering and customizable data tables to help users explore and extract insights without friction.

Ideation

I brainstormed a wide range of ideas to improve SCREEN’s usability, accessibility, and overall user experience—especially for researchers without computational expertise. These ideas aimed to reduce friction, clarify navigation, and support users across varying levels of domain knowledge.

Initial idea generation based on research themes and UX pain points.

These ideas laid the foundation for my first design explorations—focused on making SCREEN more intuitive, navigable, and user-friendly from the start.

Restructuring Information Architecture

To improve clarity and orientation, I redesigned SCREEN’s site structure to better support user goals

Wireframing and iteration

To bring clarity and structure to the SCREEN experience, I explored several layout directions—focusing on making search the clear entry point, reducing visual noise, and supporting users with helpful guidance throughout. I iterated on two homepage concepts, then refined the preferred direction into a full-page layout based on UX goals and stakeholder alignment.

Home screen iterations

What's next?

This project is currently ongoing, with early wireframes and structure complete. Next, I’ll focus on:

🔹 Designing onboarding and support experiences

🔹 Developing high-fidelity UI

🔹 Collaborating with stakeholders and engineers to define and build the MVP

🔹 Conducting usability testing and refining the design based on feedback

What I've learned so far?

Working on SCREEN has challenged me to balance design best practices with stakeholder expectations in a highly scientific context.

I’ve also refined my ability to simplify complex data interactions—such as filtering and table customization—without sacrificing functionality.
I’ve learned to adapt visual design decisions for an audience accustomed to bold, diagrammatic styles—balancing clarity with stakeholder expectations around scientific visual norms.
As a solo designer, I’ve become more confident in articulating my design rationale and navigating differing opinions through thoughtful discussion and compromise.
Finally, I’ve learned the value of building structure early. Reworking the site map and core flows helped align the interface with real user tasks and made later design decisions more focused and intentional.

This project has sharpened my collaboration, communication, and design judgment in a complex, expert-driven domain.

Still Curious?

Dive into my next project!