The UI/UX design project for Cell Press focuses on enhancing the digital experience for researchers, scientists, and academics engaging with their extensive collection of over 50 scientific journals. The project aims to create a seamless, intuitive interface that simplifies navigation across a wide range of disciplines, from life and physical sciences to earth and health sciences. By prioritizing clear, organized access to research articles, tools, and resources, the design ensures that users can easily discover, read, and interact with cutting-edge scientific content, fostering a more efficient and engaging scholarly experience.

Article Page Redesign

User Research

I conducted user interviews to evaluate the usability of the existing scientific article page and identify key pain points. Through these sessions, I discovered that essential functions—such as export, citation, save, and PDF download—were difficult for users to locate. Additionally, users found the organization of supporting content like article metrics, related articles, figure viewer, supplemental materials, and digital objects to be unintuitive and scattered. Based on these insights, I created a concept redesign and conducted A/B testing to validate new layouts and interactions. The improved design prioritized accessibility of key tools and introduced a clearer information hierarchy, significantly enhancing usability and content discoverability.

The Context

The article page is one of the most visited and critical parts of The Lancet’s digital experience. However, feedback from users and stakeholders revealed that the existing design made it difficult to locate key tools such as export, citation, save, and download PDF functions. Additionally, the supporting article content—including metrics, related articles, figure viewer, supplemental materials, and digital objects—was scattered and lacked a clear hierarchy.

The redesign was initiated to solve these usability challenges, improve content organization, and enhance the overall user experience for researchers, clinicians, and academic readers. The goal was to create an interface that supports efficient access to information, seamless interaction with research tools, and greater engagement with related content, all while aligning with The Lancet’s editorial and business goals.

The Problems

Key actions are hard to find: Users struggle to locate essential tools such as export, citation, save, and PDF download, impacting research efficiency and user satisfaction.

  1. Poor content hierarchy: Supporting elements like article metrics, related articles, figure viewer, supplemental materials, and digital objects are scattered and inconsistently placed, making the page feel cluttered and overwhelming.

  2. Low discoverability: Important features are either buried or visually de-emphasized, leading to underutilization.

  3. Inconsistent user experience: The layout doesn’t guide the reader through the article or support different reading behaviors (e.g., quick reference vs. deep reading).

  4. Accessibility issues (color contrast)

The Research Objective

To understand how users interact with the current scientific article page in order to identify usability pain points, content discoverability issues, and unmet needs—especially related to core functions like export, citation, save, and PDF download—and to inform a redesigned layout that improves user experience, supports research workflows, and aligns with business and editorial goals.

Methodology & Participants

  • User Interviews: Conducted semi-structured interviews to observe how users interact with the current article page, uncover usability challenges, and understand their research workflows.

  • Card Sorting: Used open card sorting to explore how users categorize and prioritize content elements such as metrics, figures, related articles, and supplemental materials.

  • Click Testing: Ran click tests on key tasks (e.g., finding citation tools, downloading PDFs) to evaluate the intuitiveness of the page layout and measure success rates and time to action.

  • A/B Testing: Presented two concept designs to users for comparison, gathering feedback on usability, content clarity, and visual hierarchy.

  • Heatmap Analysis: Reviewed engagement data (e.g., scroll behavior and click hotspots) to understand which parts of the page users interacted with most and least.

  • Iterative Design Feedback: Applied user feedback in multiple design iterations while collaborating closely with the product manager, developers, and UX team members.

  • 522 participants

  • Locale: Global

The Result

  • Before

    Users struggled to locate key functions like export, citation, save, and PDF download; Low engagement with supporting modules such as article metrics, figure viewer, and related content; Color contrast didn’t pass accessibility test

  • After

    +42% increase in click-through rate for key tools (e.g., download PDF, citation); Improved task success rate in click tests: from 55% to 90% on average; Users described the layout as “cleaner,” “more intuitive,” and “easier to explore”; Supporting modules saw notable rise in interaction (e.g., related articles +30%, figure viewer +25%); Page design better aligned with business goals by highlighting high-value content and improving user retention

Next
Next

The Design System