PANS Interactive

Pediatric Acute-Onset
Neuropsychiatric Syndrome

During my time with the EdTech team at the Stanford School of Medicine (Technology and Digital Solutions), I re-designed the online interactive three-part PANS (Pediatric Acute-Onset Neuropsychiatric Syndrome) course in Articulate Storyline 360. I aimed to elevate user experience and improve educational outcomes for doctors and other medical professionals. In particular, I focused on the following:

  1. Reduced cognitive load by enhancing text readability and utilizing white space, restructuring content into digestible chunks to alleviate click fatigue, and replacing cluttered interfaces with a more internally consistent and user-friendly visual language (fonts, colors, animations, etc.).

  2. Completed a full accessibility overhaul by implementing Universal Design for Learning (UDL) principles, enhancing learner autonomy, and integrating screen reader compatibility and alt text functionalities.

  3. Created internal consistency across the three sub-modules to build user trust and streamline navigation, resulting in a smoother and more intuitive learning experience.

The final course, in aligning medical content with best UI/UX practices, is significantly more accessible, visually cohesive, and learner-centered.

In the original course, information is presented in short, slowly animated segments (see video demos below), leading to click fatigue and disrupted learning.

In the updated course, information is presented in concise boxes, reducing click fatigue and making content more visually and cognitively digestible.

PANS Modules: Video Demos

Before: Review of Physical Systems

Before: Review of Neuropsychiatric Systems

Before: Physical Exam

After: Review of Physical Systems

After: Review of Neuropsychiatric Systems

After: Physical Exam

In the original course, information can only be accessed in a particular order. The user is unable to revisit information cards, go back to the previous screen, or skip to the next screen.

Further, color coding (red = symptoms present, blue = no symptoms present) is not only inconsistent with the prior module (which used green to indicate symptoms present), but is potentially confusing if read and unread cards become indistinguishable.

In the updated course, information can be accessed in any order, information cards can be revisited at any time, and user controls have been integrated, increasing learner autonomy.

Further, color coding (red = symptoms present, gray = no symptoms present) in conjunction with a legend (see video demos below) clarifies potential confusions about what a green (may arguably be interpreted as symptoms present OR not present) or blue (unread) card might indicate.

Previous
Previous

Explore the Four Core!

Next
Next

Tang Dynasty Refrigerator Poetry