Scroll Linking

My Role

As the lead product designer, my role involved driving the design process, collaborating with cross-functional teams, and ensuring a seamless integration of Scroll Linking into our medical imaging software.

The Problem

Radiologists often struggle with the tedious task of aligning separate groups of medical images to the same antomical position and frame of reference. Traditional scrolling solutions lack cohesion, leading to image misalignments and time-consuming workflows.

• Series Misalignment: Misaligned groups of medical images (image series) prevent accurate interpretation, potentially leading to diagnostic errors. Radiologists need their frame of reference to be consistent and reliable.
• Navigational Challenges: Radiologists experienece inconsistent scrolling behavior transitioning between connected groups of images (image series), impacting workflow efficiency.

Close collaboration with medical professionals and user interviews highlighted these challenges. Real-world cases underscored instances of misinterpretation and workflow inefficiencies as a result of existing image alignment features.

Solutions Implemented

• Scroll Linking: Introduced an intuitive and holistic navigation feature enabling synchronized scrolling through interconnected groups of medical images (image series).
• Series Registration: Leveraged advanced computer vision techniques to precisely align and position different groups of images (image series) to create a consistent frame of reference.

Design Details

• Toolbar Design:
  • The scroll linking tool evolved from three separate manual configuration tools into a single icon button with dynamic states, indicating the level of linking between images. This design automates the linking, alignment, and positioning of relevant images, ensuring the radiologist always knows what mode they're in.
  • Integrated keyboard shortcuts for efficient and flexible user.
• Contextual Viewer Settings:
  • Implemented a new section in the viewer settings panel, allowing users to configure scroll linking interations to support the most all of the workflows radiologists are used to.
• Viewport Icon Indicators:
  • Introduced a new Scroll Linking icon into viewports that dynamically changes based on the selected viewport and scroll linking mode.
• Iconography:
  • Designed intuitive icons for different linking states, enhancing visual communication.
• User Guidance:
  • Implemented informative tooltips for a smooth onboarding and trouble shooting.

Challenges

• Learning the Tool: Users needed to comprehend the language of linking states. To address this, tooltips emerged as powerful educator for the feature.
• Balancing Complexity: Striking a delicate balance between a feature-rich tool and a user-friendly interface was a significant challenge. The design aimed to avoid overwhelming users with technicalities while supporting a intuitive workflow.

What I Learned

The collaborative effort underscored the importance of not only solving problems but also designing a contextual solution for our users. The project highlighted that a successful design is not just functional; it's intuitive, empowering users to participate in defining the language of the interface.

Quantifiable Outcomes

The implementation of Scroll Linking and Series Registration is predicted to result in:

• 30% reduction in diagnostic time
• 20% increase in alignment accuracy

User Testimonials

"It's become so ingrained in my workflow I wonder how I ever lived without it." - Dr. Stephanie Hou, Radiologist

Conclusion

We created a seamless combination of technology and design that ensured radiologists are always looking at images that are perfectly aligned providing them with a consistent frame of reference. Imagine effortlessly scrolling through multiple groups of images, seamlessly transitioning between anatomical positions as you compare them, all while computer vision ensures perfect alignment. It's not just a design; it's a revolution in healthcare efficiency.