Novartis Design System

I worked on an agile team to create components for Novartis’s design system. We used Figma to prototype and Jira for project tracking. I was assigned tickets that had requirements for a component and I was tasked to come up with the best solution. My process was to first audit the existing components to avoid overlaps in functionality and interface, explore components used on other sites, and then mock up a few variations that would meet all the requirements. I presented the designs internally, received feedback, reiterated, and narrowed down the options before presenting to the client. There were usually further reiterations necessary, especially with the stringent regulations common of pharmaceutical companies, and once the design solution was approved, I documented the specifications for developers.

Below, I’m highlighting one component I worked on that required some user testing.

In exploring the filter functionality, I created two prototypes using different types of filtering: instant filtering and batch filtering. Instant filtering displays the filtered results live, as soon as the filters are clicked whereas batch filtering shows the results after the user clicks a button to confirm the selected filters. Batch filtering is the best practice for mobile as the results are usually obscured behind an overlay, so here I wanted to see whether it made sense to match this for desktop. In the instant filtering example (Figure A), the applied filter tags appear behind the overlay with each filter selection whereas they are shown within the overlay, as to indicate which filters have been selected, for the batch style filtering (Figure B).

I performed user testing with seven people, three of whom were familiar with UX, and the consensus was that instant filtering was the more intuitive option. This solution was presented and the stakeholders agreed that this was the right direction. I thoroughly enjoyed hearing the different perspectives as people interact digitally in very disparate ways, and conducting user testing allowed me to let user behaviors drive the design solution. The prototypes for this filtering exploration can be accessed here.