Case Study

Creating a more comprehensive shopping experience for Comcast Business customers

In addition to improving the buy flow experience for Comcast Business, we worked on improving the customer education tools and content on the website. We focused on creating a more comprehensive experience for customers by educating them on all the internet speeds and products available. Our main KPIs were to increase buy flow starts and conversion rates, and increase tier dispersion.

Overview

My Role

Senior User Experience Designer

Experience audit and analysis
Content audit
Competitive Research
Features Prioritization
User flows and mapping
Site mapping
White boarding
Wireframes

Skills Used

Time Frame

2021-2022

Experience Lead
Visual Designer
Product Manager
Copywriter
Content Strategist

Team

Agency

Publicis Sapient

Help Me Decide Phase 2

Adding live offers to Help Me Decide

The Comcast small business shopping experience already had a Help Me Decide quiz which helped a user select the right internet speed for their business. However, the current quiz did not surface matching offers on the website.

The goal of improving this experience was to link customers to actual localized plans and solutions they could purchase right after finishing the quiz. Additionally, we wanted to incorporate the recommended plans throughout the shop experience. This way, if a user finished the quiz, they could always see which plans would be a better fit for them regardless where they were in their shopping experience.

Phasing the rollout across Shop

We phased the rollout of the UX and design improvements in 3 parts.

While Phase 2a focused on the recommendation page itself, Phase 2b focused on incorporating recommended offers throughout the Shop experience–on offer cards, the Shop Offers page, and View Details pages.

User flow chart for Help Me Decide quiz with localized plan recommendations

Phase 2a offer recommendations

In phase 2a we added localized offer recommendations to the results page of the Help Me Decide quiz. This would direct users to live offers which would be a fit for their needs.

Phase 2b implementations

In Phase 2b we included the badging throughout Shop Offers, and View Details. We also called extra attention to the Help Me Decide tool in the left sidebar.

Additionally, we completed user testing. Feedback was positive, with the focus being on showing pricing at the end of the experience.

The full Help Me Decide experience

With the full experience, upon finishing the quiz the new recommendation page for a fully localized user would show the top 3 matching plans to fit their needs. If a user chose to leave the recommendation page and browse plans on their own they would still retain their recommendations.

Plans would have badging to indicate they were recommended. Additionally, a drawer in the toolbar would provide an easily accessible entry point back to the recommendation page.

As a result of our updates and continued work, our Help Me Decide tool won a 2022 dotCOMM Award.

Increasing Speed Tier Dispersion and Awareness

The goal of the Proactive Internet Speed Bump project was to create a greater awareness of available speed tiers and increase speed tier dispersion with our customers.

By working closely with the analytics team, we found that a sizable amount of users (46.2%) were skipping the Shop Offers page to a specific plan, without ever getting exposure to other plans. This meant that these users were missing out on actually browsing offers.

A majority of user paths skip Shop Offers, thereby skipping browsing all of the available plans.

Proactive Internet Speed Bump

Comparing approaches and minimizing disruption

One of our core tenets for this project was to minimize user disruption during the buy flow. Our KPI was still making sure that the user completed a purchase.

During the discovery phase, I created a matrix that helped categorize the various possible solutions on a scale of passive to aggressive in terms of disruption. The x-axis categorized the solutions from those which appeared early on in the buy flow to those which came later.

Designing the solution

We approached the solution from two angles: combining the passive, marketing aspects of “early introduction” with a more aggressive approach of a modal during the purchasing stage.

Taking cues from upselling in the airline industry, we decided to create a modal that would deploy when a user clicked “Order Now” on select lower tier plans. To minimize disruption, we would limit the modal to appear only once, and only for select lower-tier plans.

For the more passive marketing related elements we decided to include a cross-sell to other plans on View Details pages, and a call-out to additional speeds on the Shop Offers page.

This solution was the best compromise between the product team’s wishes, engineering team’s capacity, and UX best practices.

Initial Wires and User Testing

With this project, we wanted to be extra sensitive to customer’s perceptions of how we were marketing this upsell. We decided to do user testing and gather some customer insights, to better understand if this modal was beneficial in its purpose.

We went forward with testing Options 1 and 2.

User testing results

Taking away the feedback from our user testing, we decided to go with the “Offer Swap” design. However, some elements from the “Speed Only” design tested better, such as the “View Plan” CTA. We also decided to do away with plus pricing.

View Details Modal and Explore Similar Plans

To round out the passive/marketing elements of our solution, we included a speed-tiers modal and an Explore Similar Plans section on View Details pages.

The speed-tiers modal would further explain all available speeds to customers, and would be accessible from Shop Offers as well.

Final Designs

The final designs took feedback from user testing and made some adjustments. Users reacted well to the colors of the wires, so we incorporated yellow into the boosted speeds. We hid the legal copy under a chevron to save space, and led with the full price rather than plus pricing. Lastly, we made the CTAs very clear between “Continue with this plan” and “View Plan” for upgraded offers.

Creating clear customer paths to purchase

With both Help Me Decide and Proactive Internet Speed Bump, our end goal was to help create clear paths for customers to purchase the right internet speed for their business. While Help Me Decide guided customers to the right plan, Proactive Speed Bump encouraged customers to purchase a more premium plan, or to course-correct if they were not finding the internet speed they needed.

One of our other hurdles was making sure customers knew how to purchase a specific product or plan. For example, certain products are only available over the phone with a sales rep and cannot be purchased digitally. To clear this up, we suggested designing an updated Lead form.

Updated Lead Form

We proposed a new lead form for digital only products. With this new module, users would be guided clearly to purchase a product, whether online, through chat, or over the phone.

Header consistency

We made sure to create consistency between product headers and footers. Products which were purchasable online directed users to the online buy flow in both their header CTA and sticky nav. Likewise, sales rep only products would direct users to request a quote.

Final Thoughts

By updating both the headers and footers, we applied an incremental approach towards recalibrating the customers journey to the buy flow. By directing customers more thoughtfully throughout the experience, we could convert more users and hopefully sell higher speeds and additional products in the process. It also created for a more seamless user experience, with less questions from users about how to purchase a certain product.