Background

This project was initiated to solve a pain-point for high-revenue, large-scale customers and to help CallRail become more competitive up-market. Users with parent accounts managed integrations on child accounts, often repeating the same task flow 50 times. We designed a one-to-many solution to manage multiple Google Ads integrations across child accounts in a single task flow, and during this project we also designed an extensible pattern that improves the usability of integrations setup.

Scope

UX Design
UX Research

My role

Research
UX design

Tools

Figma
Zeplin
Invision

Overview

What is Google Ads?

Google Ads is a PPC(pay per click) platform that is used to promote a business, help sell products or services, increase awareness of the business.

Problem

Who are we building this for?

Goals

Research

During the research process, we looked back at user interviews that were done in 2021 through EnjoyHQ to better understand the issues our customers had with the current Google Ads integrations. We then looked at Fullstory, which showed us how the user currently interacts with Google Ads, how many times they are clicking, and how they are finishing the tasks.

User: Ann Carpenter
Industry: Agency
Role: Account Manager

User Interview Recordings

"If there are parameters that are listed out here [Google Analytics page] for how to use [Integration Triggers]. I definitely think that we would use that more. It would be much easier instead of having to go to a separate place to get these set up. I kind of experienced that with a few other things. So if it was all in one, I do think that would motivate us to use it or at least look at it as a possible option."

Based on the interviews we found from 2021, we learned that the biggest pain points were the integration triggers, how the alerts can better communicate how to solve the problem they are having with google ads, and not understanding why the integration is broken.

Auditing The Current Product

We looked through the current state of the application, specifically the pending state and the failed state of the integration. What causes the integration to be pending, what causes it to fail? We discovered earlier through our research that the integration failing has caused issues for our customers . The users are not aware of the integration failing and it their time is wasted when they find out the integration has failed.

Mock-up Exploration

Low Fidelity Wireframes

The user experience team held a working session to expand and refine ideas from our cross-functional design thinking session. I drew basic fat-marker sketches to facilitate our conversations, and we added details and built out flows with the goal of presenting this concept to product leadership for our gut-check milestone. Ideally, we would want to test these concepts with users, but since we didn’t have a researcher or participants, we had to be resourceful. So after we iterated further with our cross-functional team, we shared this concept with customer success managers to learn if this meets our target users’ needs. We collected the feedback we received in stickies and Figma comments, and were ready to continue refining our design.

Final Solution

Step by Step Configuration

Multiple users have shared they want information and convenient links to everything they need for configuration, specifically our JavaScript Snippet.
Like a wizard experience - this is extensible pattern that supports complex multi-feature, multi-day, and multi-user tasks.

Active Integration

The modal introduces subtle friction to prevent accidental updates, while keeping main page cleaner.These settings are currently on the pending page where we have observed users edit settings without saving because the integration wasn’t active.This design provides clear feedback when settings are applied.

Failed Integration

Some of the integrations in this group have failed, but not due to a Google account update. We need to offer visibility into which have failed, as well as a path to fix them.

Status pill and banner alert user to issue. Icon and color treatment highlight the troubled accounts. Links (company name, gear icon) offer pathway to fix on single company page.

Next Steps

Our solutions were presented to stakeholders, product managers, and fellow designers and have been approved for development. The updates to the Google Ads Integration have been pushed to production and set up can be viewed

here