Reduced user error by designing an improved ad creation tool

BuzzFeed Ad Manager

Reduced user error by designing an improved ad creation tool
Role
Lead Designer
Duration
3 months
Team
Ad Technology, Product, Sales & Operations

BuzzFeed Ad Manager is the B2B platform ad teams use to build and run ad orders, split into Order Management and Ad Creator. I designed and launched the platform, then led design end to end on the version that let teams build one ad for multiple platforms and tie it to a real order.


A tool that could only pretend

Ad Creator V1 did one thing: produce a mock, rendered for buzzfeed.com only, with no link to a real ad order and no way to become the ad that ran. Ad teams designed each platform by hand, checked specs elsewhere, with no dependable preview. The work was slow and expensive.

BuzzFeed Ad Creator opportunities and problems before the redesign

Two ways to build multi-platform ads

The open question was flow architecture: where platform choice happens, what state the tool holds, how a mock relates to a real ad. Three constraints framed it.

  • BAM pulls and pushes data across many tools, which bounded what any flow could do
  • Ad teams had workflows inside and outside BAM, costly to break
  • Ant Design was a deliberate boundary. Staying inside it kept engineering lift down

1. Select every platform upfront

A tabbed creator: pick every platform upfront, one tab each, borrowing the familiar browser-tab model.

Two things killed it: per-platform draft and save state got complex fast, and a mock still couldn't become an order-linked ad.

BuzzFeed Ad Manager Concept 1, tabbed ad creator, all platforms selected upfront, one tab per platform

2. Guide one platform at a time

Pick the ad type, then one platform, then walk the existing Ad Creator: no tabs, simple state, small engineering lift.

The cost was repetition. Every added platform meant redoing steps the user had already completed, and the variants stopped reading as one ad.

BuzzFeed Ad Manager Concept 2, linear guided ad creation flow, one platform per pass

Designing the ad once, reusing it everywhere

Each concept was half right. The fix was changing what the tool stores: define the ad's content once, reuse it across every platform. Mocking and preview stayed scoped to buzzfeed.com, and one shared definition meant no more per-platform draft state.

Final solution flow: one ad definition, platform-specific outputs

The ad creator that shipped

The shipped flow settles ad type, name and platform up front, before design begins.

  • State is shared across platforms. Adding one later reuses the existing ad instead of starting over.
  • Adding a platform doesn't mean redesigning. Prompts ask only for what differs. The Ads Library was updated to match.
BuzzFeed Ad Creator solution

Proving it before building it

Five one-hour sessions ran a task journey: mock an ad, link it to a real order, add a second platform. Users completed every task. The only changes needed were minor accessibility fixes and one rename, from "Real Ad" to "Associated Ad". Handoff followed the same discipline. We documented edge cases like partial platform approval with engineering before build, and Ant's shared kit kept design and web engineering on one component set.

BuzzFeed Ad Creator updated experience

Results

  • 75% user happiness, a new peak for BAM once multi-platform support shipped
  • 95% of users reported higher productivity
  • Fewer mistakes and no financial errors reported by the teams running ads

These come from periodic surveys and direct feedback, so they're self-reported measures, not instrumented readings of the time-efficiency and error-elimination KPIs the project set.

Takeaways

  • Edge cases are the design work in enterprise tooling. Partial approvals and what a mock is allowed to become mattered more than the screens.
  • Constraints were the leverage. Ant Design capped engineering lift, familiar mental models capped the learning curve, and the budget went to the flow.
  • Feedback needs judgement, not just intake. Reading each piece in context kept established workflows intact while the tool changed underneath them.