Responsive Web Design

Redesigning and replatforming Goodyear affiliate sites to Salesforce

Our objective was to apply the newly defined Goodyear design system to Goodyear Auto Service and Just Tires websites. This effort was part of the larger project of redesigning Goodyear and transitioning all of its associated websites to Salesforce.

Agency: Publicis Sapient, Digitas

Overview

My Role

Senior User Experience Designer

Wireframing
Visual Design
Prototyping
User Research
Asset creation and export
Annotations

Skills Used

Time Frame

5 months

Product Manager
UX Lead
Product Designer
Tech Lead
Project Manager

Team

Tools

Figma

Aligning Goodyear Auto Service (GAS) and Just Tires (JT) with Goodyear (GY)

We began work on the GAS and JT websites during the final few sprints of Goodyear. The design system for Goodyear was established, so it was our goal to begin redesigning GAS/JT and matching styles and patterns to create a consistent experience between sites. We wanted to maintain parity between the three websites as much as possible for customer convenience and to strengthen the brand.

Differences between GAS and Goodyear

There were some notable differences between GAS/JT and Goodyear that did not make the migration 1 to 1. The branding, colors, and visual styling were the same but the websites did not function the same way and served different purposes. For example:

  • GAS would not accept payment on checkout

  • GAS purchases would have an estimated total, with the actual total paid at point of purchase

  • The GAS cart would serve as an appointment scheduler rather than a traditional ecomm checkout

  • GAS would focus more on selling services, such as oil change, rather than on tires

  • GAS would focus exclusively on Goodyear owned shops

  • Both websites would offer Roll By Goodyear services, but GAS could not offer it with services, only tires

  • GAS would automatically geolocate users to their closest repair shop, Goodyear would not have this functionality.

Creating Product category, detail and landing pages

Overhauling the product pages was our first priority with GAS. The services GAS offered were the main focus of the website. To integrate the services into Salesforce, we created product cards for each service in the same style that Goodyear used for tires. These product cards created a flexible and cohesive system that allowed customers to shop and view all services at a glance.

Product landing page before and after. The new design incorporated more visually eye catching product cards. Other services were highlighted with visuals cards as well.

Product Detail Pages

Each service with selectors would get its own product detail page. To improve upon the current design, we wanted the new PDP pages to be more fleshed out with information about the service, show accurate pricing and discounts, additional details, and FAQs.

Product detail page before and after.

Tire Landing and Detail Pages

Although GAS is more focused on services rather than tires, selling tires is still a big aspect of the website. Much like services, we designed a product card for each tire offered. The new design was a big improvement as it showed more tires at a glance and required less scrolling.

Tire landing page before and after.

Tire detail page before and after.

Cart and Appointment Scheduling Flow

The Cart and appointment scheduling flow for GAS was unique in that it did not require payment. Many services for GAS were not priced, and required inspection. The services that were priced sometimes had variations, and the price was subject to change upon inspection. Due to this, we were not collecting payment on the GAS website and it wasn’t a traditional ecomm checkout. Instead of a checkout, we would be Scheduling Appointments for our users, who would then pay their full amount at the point of service.

GAS cart design before and after

Appointment scheduling flow before and after

Homepage

We updated the homepages for both Goodyear Auto Service and Just Tires. Compared to the old designs the new homepages were consistent with each other and much more dynamic. We incorporated the Tire Finder in the top half of the page, allowing users quick and direct access to purchasing the right tires for their vehicle. We added modules that explained Roll By Goodyear indepth, as well Goodyear’s price match guarauntee.

Goodyear Auto Service homepage before and after.

Just Tires homepage before and after.

Takeaways

This project was a valuable experience in executing a “lift and shift” for multiple websites on a tight schedule. We worked with an established, yet evolving, design system to update and migrate Goodyear and Just Tires websites to Salesforce. Having worked on many B2B experiences prior, I appreciated the experience of working on a consumer brand and a more traditional ecommerce website.