WebMD PracticePro Branding

Timeline

March - April 2021

Summary

With 76 million monthly website visitors to WebMD.com and unprecedented domain authority, WebMD PracticePro is uniquely positioned to boost a practice's online visibility. The company's comprehensive platform enables doctors to be discovered by more patients online and to engage patients throughout the patient journey.

My Role

As the product design lead for WebMD PracticePro, I white-labeled the Demandforce mobile and Live apps for iOS and Android. These rebranded apps are now used by thousands of medical providers and practices nationwide.

What I did

  • Utilized the official WebMD PracticePro style guidelines to white-label the Demandforce Live desktop application along with the iOS and Android apps
  • Worked with the WebMD and IB marketing team in order to make sound decisions on brand logos and icons
  • Identified core deliverables with the developer team in order to meet product launch dates
  • Leveraged feedback from executives while progressing along the planned timeline
  • Launched the WebMD PracticePro on April 7, 2021
LIfecycle_619x620

WebMD PracticePro's Scope and Impact

The Problem: "How to brand the new WebMD PracticePro product suite to align with existing WebMD products and webpages."

The Business Problem
Businesses need access to the full product and app suite for the new WebMD PracticePro launch. Therefore, all new designs must adhere to the company's strict brand design standards. Providers and patients also need to use products that resemble the WebMD brand.
From a Human Perspective

WebMD is a widely recognized brand that resonates with new and returning users. It is crucial that practices, providers, and patients easily identify the new products by their colors, text, and logos.

My Design Thinking

I connected providers and patients by branding products that properly represent the WebMD brand.

Understanding the WebMD PracticePro Business Goals

Analyze the WebMD product suite brand and style guide

Inspect important Demandforce screens for Live and mobile

Stakeholder Interviews

Key screen identification with dev teams

Alignment with IB Marketing and WebMD

Present white-label objectives to executives

I had only two weeks to familiarize myself with the brands. A simplified timeline was necessary to deliver the white-labeled products by the end of March for its early April release.

T-Minus 2 Weeks until Launch.

I developed an efficient approach for this project. By vetting through the WebMD product suite and its style guide, I pinpointed potential colors to use. 

I sat down with the dev team to identify key screens in order to expedite the reskinning process while giving the devs sufficient indicators on what colors changed.

 

Platforms

3

Platforms

Stamp

2

Logos

WebMD PracticePro Style Guide

After speaking with the WebMD product and IB marketing teams, I obtained the current style guide for the new product launch. We walked through the website in order to better understand the utilization of each individual color along with common pairings. Here are the color and typography guides that I was equipped with for the next two weeks.

WebMD-PracticePro-Colors
WebMD-PracticePro-Typography

Key Screens & Dev Needs

With over 100 screens that could potentially be reskinned, I identified 32 original screens to outfit with the new WebMD PracticePro branding, allowing the developers to begin as soon as possible.

DF-Home
DF-Secure
DF-Texts
DF-Calendar
DF-Patient-Info
DF-More

Selection of Key Screens

Dealing with Inputs and Feedback

Due to the importance of this launch, communication and an open mindset were key when working with WebMD and IB executives throughout the creative process. It was imperative that I demonstrated to them the significance of color usage and how to strategically implement color in order to make the apps WebMD-like. It was a successful effort as it helped me build trust across the board and allowed me more creative freedom to experiment.

Product Branding Color Requirements

WedMB blue must be the primary color

Header section must remain a gradient

Must feature at least one accent color across the products

All Demandforce brand logos must be swapped

Experimentation

Header and Navigation Experimentation
Exp-2
Exp-6
Exp-7
Exp-3
Exp-1
Exp-4
Exp-8

New Logos

With the white-labeling process in motion, the second phase of the brand design for WebMD PracticePro was to create two new logos for the App and Play stores along with a new favicon. After hours of collaborating with the marketing and WebMD teams, we developed this set of logos.

Logo_WebMDPracticePro_Logo_Stacked
WebMD-favicon

Tying it All Together

As color experimentation ended and the launch approached, I successfully handed off all necessary screens to the dev team for the iOS, Android, and desktop apps. Welcome to the WebMD PracticePro iOS app!

First Impressions 

Users are greeted with the new login screen boasting the WebMD PracticePro logo and their beloved primary blue text links and buttons.

Leadership's Favorite

I made sure that we kept the executive-favorite gradient, but tweaked it slightly to reflect a color pattern commonly seen throughout WebMD products.

New Look, New Badge

I introduced subtle hints of color by implementing the lavender accent which can be seen on the 'New Patient' badges.

And... Action!

Two of the most important changes to fit the new brand were modifying the floating action button to the primary blue and altering the two tiles which are revealed with a swipe gesture. The segmented control was also reskinned to boost accessibility.

WebMD PracticePro Live (Desktop App)

The desktop app is the widely used tool by practice managers and front desk staff

Launching a Flagship Product

On April 7, 2021, WebMD successfully launched WebMD PracticePro!

As this release article states, WebMD PracticePro provides medical practices the most comprehensive set of growth tools available to engage patients at every step of the patient journey. As an all-inclusive, fully-integrated solution, WebMD PracticePro helps medical practices: 

Attract patients with a Customized Website, SEO, Online Search Marketing, Social Media Services, Reputation Management and Listing Management.

Manage more appointments with Online Booking, Automated Reminders & Confirmations, Two-Way Texting, Appointment Hot List, WebMD Phone Service and more.

Automate patient visits with Patient Portal, Mobile App, Online Forms, and Mobile Check-In.

Engage and retain patients with Automated Recall, Targeted Campaigns, Patient Education, and more.

Play-Store-Preview

Google Play Store Preview of the WebMD PracticePro Android App

The Impact 

99%

200+

3

$170,000+

Satisfaction rate from providers who adopted PracticePro at release

Installs of the WebMD PracticePro apps across the App and Google Play Stores

Packages that all utilize the WebMD PracticePro apps 

Amount of revenue generated by IB from the WebMD PracticePro launch through the end of 2021

A Brief Summary & Reflection

The WebMD PracticePro launch was one of the flagship releases of 2021. Since I just joined the IB team in early March, this was my first project. Despite a tight two-week deadline, I was able to absorb all the knowledge while still balancing the business needs of both Internet Brands and WebMD.

I collaborated with the dev teams to figure out an actionable plan and provide enough time for them to tie up loose ends. Effective communication in idea exchange and feedback kept the project on track. In the end, the white-labeling was a success. I shipped all necessary products and supported the marketing and dev teams with the logos and key screens.

My key takeaway from this project is effective communication and collaboration inspire progress when on a tight deadline for a large-scale project. 

I'm thrilled you are here. 😊

Let's Connect!

Joshua Abesamis

Product / UX / Visual Design

Contact Me

Email / Linkedin / Resume

Made with ❤️ and 🍵

Copyright © 2022 Joshua Abesamis. All Rights Reserved.