Live Adobe MAX – The Creativity Conference
Learn from the best in the creative industry.
Watch now
  • Add to Collection
  • Tools Used
  • About

    About

    Rubicon Project is a leading technology company automating the buying and selling of advertising. I was responsible for the UX on the global plat… Read More
    Rubicon Project is a leading technology company automating the buying and selling of advertising. I was responsible for the UX on the global platform. Working with product management and engineering teams I was overseeing User Experience, Interaction Design and Visual Design. Employing activity-centered design methodology, goal oriented task flow analysis and expert review, I'm designing for ease-of-use, optimum user task-flow and seamless interaction. In order to design the best user experience I'm drafting user-journeys, building screen-flows, designing wireframes and mockups, overseeing visual design, interactive prototypes and user testing. Read Less
    Published:
Ad-tech enterprise platform experience design
I was given a great opportunity to work on a new flagship product for Rubicon Project, an ad-tech product called: “Automated Guaranteed.” On this universal login screen for the platform, I wanted to do something a little different from the typical "two form fields on a page" design. The login screen is seen by all users and presents a missed opportunity since it has valuable real estate. It was a great opportunity to introduce new products. I introduced a marketing window next to the login area in which we rotate various new product features and products we wanted to raise awareness about.
As a proponent of customer-centered design thinking, I usually begin with experience maps after going trough a process of research, user personas, team ideation, scenarios and storyboards.

At its core, a customer experience map is a tool for plotting the entire set of actionable touch-points the customer experiences in the context of engaging with a product or a service. The word actionable is most important to keep in mind, since actions are measurable.

The experience map below examines the four main components of a new product and the customer’s concerns, thoughts, feelings, stress-points and the overall potential emotional experience throughout the journey. 
This low-fidelity dashboard mockup was part of our product ideation and design process. By no means final, it represents an intermediary stage where we're trying to come up with the best design that would serve our customer's needs the most optimum way possible. Customers would see this dashboard after logging in and have all their customized information presented to them at a glance. Clicking on the cards (cursor would change to a hand) or on the magnifying glass would bring up an overlay window with more detail.
An example of an overlay with more detailed information (from the dashboard above).
One of the particular challenges in working with vast amounts of data is how to construct the information architecture and present choices in an easily understood way to customers. Here is a media buyer's view of advertising inventory available for specific targeted devices, audiences, Comscore rating, etc. which can be defined by filters on the left side. I intentionally designed it like an e-commerce UI with which people are familiar to ease the burden on browsing the offerings.
To put relevant information at the customers' fingertips an activity feed can be quickly accessed from anywhere within the application at all times. Important alerts are also integrated into the interface so customers are alerted about critical event-driven tasks to be performed as they're using the application.
This screen demonstrates the previous advertising property browsing interface with an overlay of an advertising property detail. There is a lot of information buyers are interested in that would be impossible to present on the small cards in the browsing interface. The decision to bring up an overlay over the browsing interface was driven by the desire to "stay in the same place" with all filters and settings intact the user can quickly return to.
It was important to our customers to be able to see a different view of the offerings (switch view icons on the black pagination bar) that allows buyers to dig deeper, see more info and sort offerings in a table. Clicking on the selected property will bring up a detailed overlay (as above).
Media buyers can view an individual publisher's "storefront" populated with their advertising inventory.
A media buyer's media plan view of a complete advertising campaign in a "notebook" type design. Massive amounts of data and information, negotiations, campaign details, setup, etc. go into an ad campaign in the ad-tech world. I wanted to design a UI with a notebook metaphor to match between system and the real world. This mental model would assist users a great deal in navigating a campaign's setup and all it's related business dealings.
Once a campaign is live, detailed reporting is provided within the media plan. My aim here was to provide an appealing, clean interface for a quick evaluation on how a campaign is doing. This "interim" design in an overlay would provide a lot of functions and useful information yet keep the users in the same place (without leaving the media plan). If desired, a full report can be accessed from this overlay. An important benefit of this design choice was to provide a set of functions at users' fingertips and not have to go to another page to see detailed data.
Advertising orders can be negotiated within the media plan between buyers and sellers. This was an important feature to include in the media plan interface for a more efficient and effective user experience. Again, an important benefit of this design choice was to provide a set of functions at users' fingertips and not take them to another page to conduct a discussion about the media plan in question.
A publisher's view, providing analytics of a certain advertising property.
Notification emails were designed to be inline with corporate branding for a unified, cohesive user experience. The email below was a confirmation of a customer's sign-up and outlining the next steps in the process.