UI design for MRM for Health

Janssen needed a new design for the Xarelto HCP website, which integrated photography and branding in a more prominent way, while maintaining access to the detailed information that physicians look for on the site. Key to this approach was the Adult Dosing Navigator, an interactive device to simplify the process of determining patient dosage. Although this site was not built, I’m really pleased with the full component library and design system that I designed. I also created prototypes to demo the Adult Dosing Navigator, as well as menu and search interactions.

Client: Janssen
Design Director: Abby Protopapas
UI design and prototyping: John Kitses

Page layout

Figma library

An organized resource of design capabilities

Each design project presents unique challenges and requirements when establishing a library of components that can serve the widest range of content. I leverage Figma’s component variant feature alongside variables and semantic tokens to solve the “what if” questions that arise as content deploys across different responsive states. Organizing these resources with a meaningful taxonomy and layout is essential so the designers can work freely yet within the design.

Dosing Navigator prototype

Simplifying complex dosing instructions

The central feature of the Xarelto HCP website design is the Dosing Navigator. I created this prototype to demonstrate the user flow through stages of decisions and patient profiles, to arrive at a downloadable set of dosing instructions.