Clearstream

Video Advertising Management Platform
  • User Experience Design
  • Data / Information Design
  • Frontend Engineering
In the summer of 2014, I had the opportunity to redesign one of the largest video advertising campaign management platforms in the industry, which provides retargeting services for hundreds of international brands.
Video
advertising
on demand.

If you’ve ever browsed on a website for some kind of product or service, and then switched to a different site, only to see a video advertisement playing in the sidebar for that same product, then you’re familiar with the concept of ‘retargeting’.

In the summer of 2014, I had the opportunity to redesign one of the largest video advertising campaign management platforms in the industry, which provides this same retargeting service for hundreds of international brands.

Market Leaders in

Digital Video Advertising
Clearstream is an advertising technology company whose primary service is video campaign management, built on top of an advertising exchange to provide real-time bidding and serving of ad impressions based on a website visitor’s location, technology and device. In essence, the service Clearstream provides allows brands & marketers to place targeted video ads based on a user’s browsing behavior all in real-time, and receive real-time analytics on the ad’s performance.

At the time, the primary service that Clearstream provided for their clients was at the cutting edge of advertising technology. To give their clients an edge, Clearstream’s consultants used two (2) different, yet similar, demand-side advertising platforms for managing bids for video ads and deploying the creative to campaigns.

Clearstream had reached a point in their business where switching back and forth between the tools was costing them thousands of dollars a day.

The cost
of context

switching.
Unifying & visualizing big data
The primary objective of the Clearstream project was to provide their clients with a premium, streamlined experience for executing targeted, real-time video advertising. Additionally, the client also wanted to focus on creating a clean and modern user interface that simplified their existing processes and unified data for reporting and visualization.

The Process

Discovery

For the initial Discovery process, I had the opportunity of flying to Chicago, along with an engineering consultant, to lead a 1-week UX intensive research session with the client and their staff to kick the project off.

We organized each day into working sessions to cover several distinct areas of user and technical research including stakeholder interviews, goal definitions, experience audits, user profile definitions, competitor analyses, branding workshops, and system architecture.

Insights

Unlike most typical client projects, the Clearstream project was purely an internal tool used by their consultants to assist their clients with video campaign management. As such, the Discovery process yielded some interesting information about the goals and motivations of the people using the product:

The current platform(s) provides the business with the most capabilities/flexibility available in video advertising demand side platforms. This in turn allows the company to stay ahead of the curve and provide tailored (“non-cookie-cutter”) solutions for their clients

The head of operations relied on accurate and relevant data from the bid management platforms to determine how best to optimize yields and increase margins for the company as a whole.

At the time, they did not have any accountability within their platforms, i.e. if two people were working on the same campaign, they had no way of tracking who made the changes and when.

Information Architecture

With a project of this nature and domain complexity, the initial step in defining the IA was to establish a common vocabulary to represent objects and entities within our system, ie. advertisers vs agencies vs brands, campaigns vs placements vs flights, etc.

Once we had a consensus on terminology, we were able to start laying out the different components that communicate with each other and make up the system through user flows and wireframes.

Frontend Engineering

Once the visual design had been approved, my focus turned to reporting, where I developed custom interactive data-visualizations in the form of charts & graphs. The application interface was developed using AngularJS + Foundation Framework, while the charting component was built on top of Kendo UI’s charting components.

Kendo UI provides Angular UI components with built-in data-binding, so all of the pieces worked nicely together, and I could focus on customizing the experience of the charts rather than just getting them to work.

Our final solution was an all-inclusive dashboard for managing bids, campaigns & customers (CRM), as well as provided custom, real-time reports and charting using HTML5 technologies and served from the cloud.

60 million rows of data every day
The final results after launching the initial phase of Clearstream’s project was a platform capable of processing more than 60 million rows of data based on user behavior per day and serving video advertisements in milliseconds for multinational brands like McDonald’s, MGM and British Petroleum.
Visit Website
Credits
  • Client: Clearstream.tv
  • Agency: Ikayzo, Inc.
  • Engagement: January 2014 — October 2014
  • Technology
    • Frontend: AngularJS
    • Backend: Ruby on Rails
  • UX Design: Mike King
  • UI Design: Chris Ota
  • Frontend Development: Mike King, George Lee
  • Backend Development: Chris Kobayashi, George Lee, Leo DeCandia