ZEPOSIA (ozanimod)

2023

TOOLS / APPLICATION

project type

Figma, Illustrator, Photoshop, Miro
UX / UI | Visual + Brand Identity | Responsive Web Design | B2B |

OVERVIEW

MY APPROACH

Bristol Myers Squidd is a pharmaceutical company who produces ZEPOSIA (ozanimod) an FDA approved oral treatment prescription for people living with 2 conditions; ulcerative colitis (UC) and multiple sclerosis (MS). Both treatments website primary goal was to clean up their strategic messaging and update their current and prospective consumers user experience to easily attract and connect to their ideal audience.
I worked as the lead UX Designer for multiple sclerosis (MS) as my co-worker Alyssa A. led the ulcerative colitis (UC) update. We worked in tandem with Copy, Art, Account, RegOps and Developers to approach the clients request. They wanted to update the current website by addressing a new global design system and how the current audience is experiencing the website.

challenge / pain points

There were many global factors that we needed to update. After doing an in-depth brand dive we notice that copy didn't prioritize healthy literacy for both perspective and current patients and it was too copy-heavy. The current visuals on both sites weren't reflective of ZEPOSIA's treatment symptoms and didn't create a compelling narrative. Both sites had disorganized navigation and confusing user flow which led to some pages being looked over and not understood. With unclear CTA's and a lack of unity, both websites under ZEPOSIA's brand looks indifferent

The Main Problem.

How to create a spotlight on ZEPOSIA for deeper product consideration?

Key Research

In the website design, our team focused on addressing the following issues:

Rebranding Strategy

  1. User Flow (Important Factors to Consider) :: UserFlow, Competitor Analysis, Website Structure
  2. Audience Understanding (Elements to Consider):: Personas, Less Copy Content, Restructuring to a mobile - first yet responsive website architect
  3. Identifying key CTA's to highlight for visual interest & direct connection

Re-evaluating Design Elements

  • Design System: This includes understanding the current design approach and building on an existing foundation. To do this we developed a component inventory assessment to assist what elements to keep and remove based on users experience.
  • Responsive Layout: Our research showed that many pages were repetitive and reused imagery & visuals that disconnected with the content. Not too mention the menu wasn't responsive for mobile view and included menu's that weren't being used. Users were skipping pages that didn't interest their needs and ultimately dismissed important information due to the lack of content & text hierarchy. We needed to restructure the layout to be informative and easy to follow along with shifting the contents breakpoints to improve mobile flow.

  • Visual Hierarchy: The current website lacked a unity in visuals & hierarchy of visual content. With an update to the content breakpoints this helped release container control and allowed for icons, content containers, and more control over visual content and for new considerations.

HONEST ANSWER. HERE'S THE SOLUTION.

Creating content for a mobile-first audience that elevates prospective and current support patients. Website needs to reflect target audience that are initiating & adhering to Zeposia.

Key Features

In the website design, our team focused on addressing the following issues:

Updated Navigational System

  • Developing a global component that articulates best UX practices and prioritizes navigational use first

Iconographies & Visual Elements

  • Updating visual elements, branding palette for accessibility, & current components

Design System with WCAG Compliance

  • Streamlining consistent components such as Prescribing Information, Indication Notice, Utility Nav + more
  • Uniformity of font sizes, color palettes, actionable links, modules, + more

Responsive Layout

  • Re-evaluating the current grid layout to reform for responsive use. Prioritizing mobile & tablet usage by developing components and a layout that shifted from desktop to mobile with ease on menus, components, and content.

No items found.

Next Actionable Steps

 

https://www.zeposia.com/

PROTOTYPE WALKTHROUGH