Forecasting Tool
Imagine you're a user, eager to dive into your work. You need to run an accurate forecast and share the data with your team later in the day. But that excitement quickly fades when you realize the datapoints you need are scattered across different areas of the tool you're using. It’s a frustrating delay that takes away from your focus and productivity.
Business Challenge:
Publica by IAS is a CTV ad server platform that helps publishers optimize ad breaks, unify auctions, and boost streaming ad revenue with transparent data insights.
Currently, forecasting is fragmented across the UI, with unclear output values and missing key input options. User feedback confirms that the forecasting experience is spread across multiple pages, with confusing output and a lack of trust in the forecasted values. “They don’t love all of these red flags of stuff that don’t get included in the forecast, particularly the audience segment.” Additionally, our users (Publishers) rely on forecasting to plan for their upcoming quarters, so it's crucial that we provide accurate projections.
Objective:
The goal of this project is to create a single tool that users can rely on for accurate forecasting data, incorporating all key inputs.
Role:
Lead Product Designer, Publica by IAS
Strategic Approach
Research
Secondary Research
Competitive Analysis
Internal and External User Interviews
I led the user interview process from start to finish: creating the research plan with a script and questions, facilitating the findings and brainstorming session with the PM, and driving ideation for solutions. The insights gained were invaluable.
User stories:
As a user, I need to be able to know my “reach” before committing to a campaign or deal. Forecasting can help with understanding the audience reach.
As a user, I need clarity on what the forecasted value mean and the likelihood of achieving that value.
As a user, I need the ability to filter the forecast based on all the targeting parameters available in the UI, such as content, audience segments and frequency capping.
(Targeting parameters set by users on their campaigns or bidders determine which ads can or cannot be shown on a channel.).
Solution Framework:
UI/UX Overhaul: Simplify the interface, clarify the output, and introduce a visual component to enhance understanding.
Update Forecasting Calculation: Integrate new input options to improve accuracy.
Backend Data Enhancements: Include additional targeting parameters for more precise forecasting.
Measurable Results:
Improved Experience: Increased usage of the main forecasting tool.
Data Accuracy: Enhanced precision with the addition of new key inputs.
Visual Evolution
Design exploration:
With a strong foundation from research insights, it was a matter of blending existing components with new visuals.
UX goals:
Simplify Input Selection (Targeting Parameters): Clearly display available forecasting options and allow users to customize forecast inputs.
Make Output Easy to Digest: Include a graph to visualize the data, enable users to define their view, and present relevant information in a table.
Wireframes
I started the ideation process by creating wireframes to establish the page’s information hierarchy and organize the content layout effectively.
Component Breakdown
I reviewed the existing components and explored new UI concepts to enhance the user experience for the updated design. This included:
Forecast Input: Analyzing the "buildable" input fields for targeting, such as dates and delivery settings, to ensure flexibility and ease of use.
Forecast Output: Designing a table to display the forecast breakdown, prioritizing clarity and quick insights.
Forecast Output Graphs: Exploring data visualization options, focusing on how to break down the data by tiers or channels, to enhance user understanding and decision-making.
Lo-Fi Mocks
With the layout already outlined, the Lo-Fi mocks came together quickly, allowing me to focus on the overall structure and flow of the design.
Design Iterations
After reviewing the initial Lo-Fi mocks with my design manager and the PM, I gathered valuable feedback and clarification on key questions, which guided further iterations of the design.
Through several more rounds of iteration and brainstorming, we arrived at a solution that effectively addressed the user pain points and aligned with our goals for the UI and overall experience.
Decision Points
I presented the design solutions to the engineering team, where we discussed feasibility, constraints, and the implementation plan for both the V1 and potential V2. Based on these discussions, I made necessary adjustments to the mockups.
After aligning on the details, we reached a strong place to hand off the design for development. Simply put, there was actually a lot of discussions and communication involved!
Final Design
Loading State: I designed a clear loading state to keep users informed while data is being processed, ensuring a smooth and transparent experience.
Input: The input fields were made intuitive with clear cues to guide users through the process. I also added missing key inputs to improve the accuracy of the forecast.
Output: The output presentation was crafted for clarity and usability, making it easy for users to interpret and act on the displayed data. I included the option to download the table and added a “View By” feature to allow users to break down the data from different perspectives.
Loading State
Populated
Next phases…in development
The frontend work is almost finished. I’ve had the chance to QA the UI and provide iterations based on any blockers or constraints identified during the engineering process. We’re on track for a beta launch by the end of Q1 2025!
Working on this project has been incredibly rewarding. Leading the entire design process gave me a deep understanding of the forecasting tool, ensuring that the new experience truly enhances the user journey. Frequent check-ins and constant communication with the PM and engineers were key to staying aligned on changes and maintaining momentum throughout the project.