Planning Tool: The Missing Link Between Sales and Execution

Estimation functionality had fallen behind from years of targeting features that weren't completely implemented on the back end and not given any exposure on the front end.

User Research

IN-DEPTH Conversation

Systems Thinking

Prototype

Cross-functional Alignment

Background

The gap that cost us money

Our sales team would demo our DSP capabilities and win deals. Then those deals would land with the campaign operations team, who'd spend 6-8 hours translating sales notes into actual campaign configurations.

Sometimes the translation was wrong. Sometimes it was impossible because sales had promised something we couldn't deliver. Either way, it created friction at the worst possible moment: right after the client signed.

We needed a tool that let sales capture plans in a format that operations could actually use. But it had to work for two completely different workflows:

  1. Sales + Solutions Managers: Needed to explore options, adjust budgets, show clients the map, export proposals

  2. Campaign Managers: Needed to convert plans into campaigns with one click

One tool, two audiences, zero margin for error.

User's Must Have Features

I worked with our Director of Research and Executive Director of Product to map out requirements. We talked to 15+ users across sales, solutions, and operations.

The pattern was clear: everyone needed to build plans, but they needed different things from those plans.

Sales rep during a demo: "I need the map to look impressive. Clients want to see where their ads will run geographically. The data behind it doesn't matter as much in this stage."

Solutions manager building a proposal: "I need to try different combinations of channels and budgets. What if we add Connected TV? What if we cut the budget by 20%? I need to model this quickly."

Campaign manager after the IO is signed: "I just want to click a button and have the campaign framework built. I'll fine-tune from there, but I shouldn't be recreating work that already happened."

Provide intelligent estimations

A new back-end service is being developed in parallel, which has already shown dramatic improvement to the current estimation service.

Spotlight the map

The targeting map's visual depiction is occasionally functional for the campaign, but enhancing its presence in the UI was necessary for sales use.

Dial in different options

Users need the ability to formulate different combinations of elements and balance budgets with estimations.

Click to convert

A feature that converts the plan by building out the framework of a campaign provides vital efficiency gains.

Systems Thinking

Big chunks first

  • We established the larger items that needed to be factored into the tool.

  • Identified a need for a "library" to independently manage objects used in a plan or campaign.

  • There were several iterations of nesting and connecting elements in different configurations.

Challenged by the details

We would make strides balancing the amount of detail a user could configure one day and paint ourselves in a corner the next.

  • Too few options, and the new tool doesn't move the needle enough.

  • Too many options, and they might as well set up a full campaign.

By mapping out the full lifecycle, we were able to identify the necessary elements to include in the planning tool.

Prototype

Visually organizing it all

In the campaign execution tool, there are many options that all culminate in a single purpose. The inverse was true of the planning tool. The options are trimmed down, but there is no single purpose in the stage of the process that this tool serves.

  • Sales will use it to demo the capabilities to clients, but they might also want to capture details and pass them along to solution managers.

  • Solutions managers need their own sets of options to explore channels and variations of combinations to export for a proposal.

  • Campaign managers need the plan to convert to a campaign but in a way that breaks down differently than a proposal.

I tried using tabs for the different elements, but clicking back and forth made it a clumsy experience. I kept pushing the map in and out of different sizes and views. I tried card layouts for the channel options instead of a table, but users wanted it to replicate how they used the exported .csv in Excel.

We had a goal of keeping it to one screen if at all possible. That helped me iterate to a concept product that we could agree on and that tested well with users.

Alignment on a concept

How to start

Creating a plan starts by showing users the two buckets they will be adding to. The wireframe hints at using the blank plan to help any new users get started.

Add targeting

We give the user the ability to use objects that have already been created and used in other plans and campaigns.

The need for contextual targeting to be exposed in the pre-sales stage is addressed with the option to add new or existing contexts to a plan.

Highlighting the map

I used a drawer to allow proper representation of objects used in a plan without bouncing the user entirely from the plan screen. This provides the necessary real estate for the needed UI, and it gives us a chance to make the map a focal point.

Cards keep the user informed

The targeting cards get added to ensure the user knows what is available when setting up channels. This also keeps a thumbnail of the maps of each item within view, and with one click, they can expand that map for a detailed view.

Adding channels

Adding a channel works similarly to targeting, where the user is presented with the inputs in a drawer. This one is a bit simpler and smaller.

Users enter foundational settings here. Some can only be configured here, while others can be changed per channel option later in the process.

Making it make sense

Channels and their options are represented as tables. This mimics how solution managers export a plan to a .csv file. Users greatly appreciated keeping this harmony.

Adding and adjusting options

Channel options are where users get to tinker with those foundational channel settings. Anything in the gray button with a down arrow can be customized per channel option.

Each time one of these settings is modified, the user needs to confirm it because it's going to change the calculations for impressions, reach, and possibly budget.

Selecting to convert

When an insertion order gets signed, a user can select the channel options to include and click the convert to campaign button.

Testing and iteration

We prototyped this in Figma and tested with 8 users (3 sales, 2 solutions, 3 campaign managers).

First round feedback:

  • Sales: "Finally, the map is prominent. This is what I need for demos."

  • Solutions: "The table view is perfect. This matches my mental model."

  • Campaign managers: "The convert to campaign alone would save me an hour."

Second round, we refined the drawer interactions and added keyboard shortcuts for power users.

Results

Successful hand off

I handed off a concept for a tool that will change the dynamic of the platform. In the simplest form, it was the missing piece in the platform, but the variety of issues it solves impacts every user at every stage of the system.

This tool works for internal users with managed service needs, such as presenting options in a proposal. It also works for self-service external users utilizing the planning tool to ease into setting up a campaign. In each case, the tool caters to their individual needs but provides the efficiencies they both require.

Looking back

What I'd do differently

Some of our meetings went in circles because we couldn't agree on priorities. Looking back, I should have created a decision-making framework earlier (user value × business value × technical feasibility). Would have saved us from rehashing the same debates.

Also, I'd push harder for quantitative success metrics up front. We had good anecdotal feedback, but I wish we'd instrumented the tool better from day one to track exactly where users were getting value.

75% Faster: Building a Design System That Actually Gets Used

Retooling the design system from the ground up by customizing an open-source React component library

Reshaping Team and Culture: How I Amplified Collaboration

Leading a shift in our team's dynamics, which positively impacted our culture and performance