BioNTech

BioNTech is a German biotech company known for developing innovative treatments, especially for cancer and infectious diseases. They became widely known for teaming up with Pfizer to create one of the first mRNA COVID-19 vaccines

This project was part of a long-term collaboration with a client over the course of 18 months. Our main focus was developing a sales platform tailored for sales representatives targeting healthcare professionals, such as hospitals and doctors. The platform provides a clear and intuitive interface, allowing sales reps to efficiently manage their outreach efforts, track ongoing engagements, and identify new opportunities with healthcare providers. It streamlines the sales process by offering insights into where to focus their next calls and how to follow up with established contacts.

Role: Lead Designer

Introduction

I joined this project after the initial kickoff, once the early stages of UX development were already in progress. My primary responsibility was to take ownership of the visual design. A key objective was to create a comprehensive design system that aligned with the newly developed website. This design system needed to be scalable and cohesive, ensuring consistency across all user interfaces. My role involved translating the UX foundation into a polished, visually appealing product while also defining reusable components that could be efficiently applied throughout the platform.

Process

We kicked off the project by setting up a small agile team consisting of the UX designer and myself, with weekly calls to align with the development team and ensure our technical progress was on track. Our goal was to build a native app. The UX designer and I began by defining the core concept, after which they sketched the wireframes while I started developing the design system.

Rather than building the design system first, which is often ideal, we had to develop it alongside the app due to tight deadlines. This approach allowed us to stay flexible and adapt as the product took shape, but it also required careful coordination to maintain consistency throughout the process.

Design system

3
2
1

Solution- One ambition - native app

As mentioned earlier, we developed a native app for sales representatives at BioNTech to help them manage and streamline their sales activities. The app was designed to provide a comprehensive overview of their workflow, making it easier to track ongoing tasks, manage client relationships, and optimize outreach to healthcare professionals.

Homescreen and overview

The homepage serves as a comprehensive overview of upcoming tasks. It displays the healthcare professionals (HCPs) that need to be contacted next, along with the type of engagement—whether it’s a scheduled meeting or a follow-up phone call. Sales reps can also track the status of each interaction, including any outstanding information or actions required from previous meetings, ensuring they stay informed and prepared for their next steps.

iphone-web

Begin next call

One of the key features is the "Begin Next Call" function, which allows sales reps to easily schedule their next engagement. There are two ways to add a "next call." When there’s an open time slot in the rep’s schedule, the app prompts them to set up a new call. The rep can then view potential opportunities using the map overview to identify nearby healthcare professionals.

new-call-1-min
new-call-2-min
new-call-3-min
new-call-4-min

Additionally, a new call can be scheduled by navigating through the contact menu, providing flexibility in managing outreach efforts.

HCP profil

Within the app, you can view detailed information about any healthcare professional (HCP) currently in progress. From this overview, sales reps can perform various actions such as documenting the status of ongoing interactions, adding notes about the progress of discussions, or scheduling follow-up appointments. The interface makes it easy to update relevant information, track engagement history, and ensure that all necessary steps are taken to move the relationship forward.

1-min
4-min
2-min
3-min

Product change - Web app

Midway through the development of the native app, we received feedback from the key stakeholder suggesting that it would be more effective to build a web app optimized for iPads instead. Simultaneously, our team was integrated into a larger design team from the DACH region, and we were tasked with incorporating a new design system into the project. This required us to restart the design process, although we were able to leverage the experience and insights gained from the initial development phase.

The Solution

Similar to the app, the core feature of the web app is the "Next Best Action" function. This feature is designed to provide even greater clarity on what tasks to prioritize and guide sales reps through their day. It offers clear, actionable steps, ensuring that sales reps know exactly what to do next—whether it’s making a call, following up with a healthcare professional, or preparing for an upcoming meeting. The feature streamlines their workflow, helping them stay focused, organized, and efficient throughout the day by continuously highlighting the most important actions to take.

Home-1-min

Other features

Each feature has been optimized for the larger screen, offering a more intuitive and spacious layout. You’ll see how the "Next Best Action" function, the map overview, and the contact management tools have been redesigned to take advantage of the iPad’s interface, providing sales reps with a more seamless and efficient experience. These visual examples demonstrate the enhanced usability and clarity that come with the shift from mobile to tablet.

Customers-1-min
schedule-1-min
IPAD-MOCK-4
Schedule-2-min