UI/UX web design and brand upkeep on global healthcare education site
role
brands
work Categories
overview
I've worked on UI/UX design for JnJInstitute, Johnson & Johnson's healthcare education site for physicians, nurses, and other clinical professionals. It's been several projects over time, not one: new page templates, updated navigation, refreshed course and event layouts, and UI components built to keep things consistent as the site grows. Some of what's shown here was live at one point and may not match what's on the site today; JnJInstitute changes often, and older work gets replaced as priorities shift.
homepage redesign
Replaced the static hero banner with a content slider, so the homepage can spotlight several key sections instead of just one message up top. Built it accessible first: large arrows let people move through it manually, and a pause control keeps it from auto-advancing so nothing scrolls past before someone's actually done reading it.
navigation updates
Explored a handful of directions for the main nav to make better use of the space, surface the content that actually mattered, and get ahead of where the sign-in/register flow was headed. Stuck to the brand guidelines that were in place at the time and built around the site's existing modules, so nothing needed new capabilities to ship. Optimized for mobile from the start.
sign-in/registrion UI/X design
Designed the UX and UI for user registration on JnJInstitute.com, working out the flow before touching the visuals. Stuck to the brand guidelines in place at the time and optimized it for mobile from the start.
user journerydesgin and UI/UX design
Course and curriculum content is the meat and potatoes of JnJInstitute, so I mapped the user journey end to end, from an anonymous first-time visitor to a registered, opted-in user. Stuck to the brand guidelines in place at the time, designed it accessible first, and optimized for mobile throughout.
Education user journey dashboard design
Mapped the user journey for registered users landing on their personalized dashboard, from profile snapshot to curriculum-based courses like VELYS and SuturEd. Stuck to the brand guidelines in place at the time, designed it accessible first, and optimized for mobile throughout.
Virtual reality landing page for healthcare users
Built a landing page to spotlight JnJInstitute's VR training offerings, showing how immersive learning fits into a clinician's career at every stage. Stuck to the brand guidelines in place at the time, designed it accessible first, and optimized for mobile throughout.
Landing page for nurse HCPs
Designed a landing page for EMPOWOR to celebrate Nurses Month and spotlight the program's clinical education and leadership resources for nurses and OR personnel. Worked within the existing modules with no dev support, so everything had to come from what was already available. Stuck to the brand guidelines in place at the time, designed it accessible first, and optimized for mobile throughout.
Events landing page for registered users
Designed the My Events page for registered users to track the events they'd opted into, from upcoming sessions to a running history of what they'd attended. Stuck to the brand guidelines in place at the time, designed it accessible first, and optimized for mobile throughout.
COVID-19 landing page
Modeled this landing page after JnJInstitute's existing UI/UX to spotlight COVID-19 content, from frontline care resources to mental health and well-being support for clinicians. Stuck to the brand guidelines in place at the time, designed it accessible first, and optimized for mobile throughout.
PDF player for learning offerings
JnJInstitute's learning section had no way to view a PDF without downloading it, so I designed a player that loads the whole document inline — swapped in for the thumbnail image — and lets users scroll page by page without leaving the tab. Stuck to the brand guidelines in place at the time, designed it accessible first, and optimized for mobile throughout.