Competitive Rates Chart

Problem

Bidding on advertising can feel like a shot in the dark

In the TV advertising world, the price for ad space relies on the principles of supply and demand, but determining the right price to bid can be a gamble. Buyers either rely on spreadsheets of historical data or, at times, no data at all. This creates uncertainty and inefficiency in the bidding process.

Solution

With data comes great power

To tackle this challenge, we launched the Competitive Rates Chart, a tool designed to give users the confidence they need to bid on TV ad space effectively. My role was to redesign an existing tool, improving its data capabilities to help users easily determine competitive bids.

Challenges and Constraints

Navigating uncharted waters

This project came with unique challenges because I became the sole designer for two product managers following a product team restructure.

New partnership: It was my first time collaborating with my new product partner, so I was simultaneously building a working relationship while delivering impactful design.
Inherited project: The project had been passed to my new product partner from another manager, requiring me to quickly get up to speed.
Existing feature: The tool was already in use by internal teams, which meant I had to respect its constraints and work within a form layout that was cluttered and inconsistent.

Design Goal

Streamline the decision-making process when bidding on TV ad space by presenting complex data in a clear, accessible, and easily interpretable way. The tool should make users feel confident and informed.

Design Process

Early concepts to explore effective data representation

In the early design phase, I explored concepts that would allow users to interpret data quickly and effectively. Since visual processing occurs faster than conscious thought, I focused on using retinal variables such as size and orientation to clearly differentiate and categorize the data. I considered each visual element as an aid to helping users see data clarity and trends.

Visualization was the game, but data clarity was the goal

The Rates Tool consists of three main data points: the average of all bids over the last 4 weeks, a sampling of bids per week, and the bid with the highest number of TV airings.

Data display

We decided a scatter plot and a trend line effectively showed changes over time. Users can see both individual data points and the general trend, making it easier to detect patterns or anomalies.

Color choices and symbol differentiation

Color choices: By opting for colors like teal, purple, and pink, the chart avoids conveying unintended meanings. Additionally, these colors were chosen for their high contrast ratio, ensuring that the data remains readable for users with visual impairments.

Symbol differentiation: Differentiating data by shape, rather than just color, enhances readability. This approach provides a clearer, more inclusive visualization than using only one symbol or relying solely on color for distinction.

Transparency and jittering

Testing with real data revealed an issue with overplotting, where data points overlapped too much to be readable. To solve this, I experimented with shapes, colors, and textures, eventually using transparency and jittering to make overlapping points visible.

Final Deliverable

The nature of decision-making is the comparative analysis of pre-filtered data

The Competitive Rates Chart launched for internal users, improving how they assess bid prices for TV ad space. The new design simplified the decision-making process by: 

The success of this launch has laid the foundation for the next iteration, which will expand the tool for use by external clients.

Integrated workflow: Users no longer need to switch between multiple windows or manually input data into spreadsheets, significantly reducing time and effort.
Trend analysis: Displaying data over time allowed users to easily spot trends and make more informed decisions based on both historical and current data.
Data clarity: By pre-filtering the data, users could focus on interpreting the insights rather than processing raw data.The success of this launch has laid the foundation for the next iteration, which will expand the tool for use by external clients.

Takeaways and Reflections

This was the first time data visualization was implemented in our product area and it caught the attention from developers in another squad, leading to a healthy debate. While navigating these discussions, I learned that the strength of any design solution lies in open communication and alignment with your Product Manager. Building strong partnerships early on is essential for ensuring the success of complex projects, especially when working across teams.

TV ad bidding, visualized