Adadyn

A retargeting ad-tech SaaS platform for mid market advertisers

PROBLEM ADDRESSED

Adadyn was developed to be a powerful end-to-end banner ad delivery system with retargeting capabilities. After the technological proof-of-concept was ready, the product was severely lacking in its user experience front.

The technological proof-of-concept version of Adadyn was severly lacking  on user experience fronts

The product developed was severely suffering from the following

  • Intense feature creep
  • Deep hierarchical navigations
  • Lack of brand image projection
  • Long cumbersome workflows not based on user stories

INSPIRATION

Observing the workflows of the internal users of the product viz., creative designers, account managers, testing engineers was revealing enough that the product was suffering from textbook cases of feature creep and poor usability.

Even a technologically superior product will get slaughtered if user experience isn't up to the users' expectations

And coupled with the UX awareness that was happening at our target user locations (read, United States) that it was concluded that an UX centric overhaul of the product was absolutely necessary. The team  literally went back to the writing pad, to carry out product research in terms of both Adadyn's and competitors' user experience and how the current condition fares with respect to the company's business objectives.

UX STRATEGY

Nearly 10 competitors offering similar and related services were analyzed from product user experience perspective, and a UX SWOT analysis was carried out, with the perspective of the redesign exercise.

Adadyn UX SWOT

The findings of the exercise resulted in the setting the strategy for the redesign process. The key points of the exercise were

  • Adopt the functionality edge Adadyn has, but without sacrificing usability
  • More professional looking than existing Aadadyn and competitors and yet less on cognitive load and interaction costs
  • More usable app than existing Aadadyn and competitors
  • Designed with user’s work style under concern
  • Reflect Adadyn's brand image

USER RESEARCH

One of the key milestones of the UX redesign process was to develop a 'deep empathy' with our target users. Deep empathy cannot be achieved unless we are able to narrow down as many assumptions about the details of our user's everyday life as possible. A very diverse research was carried out in terms of details about our target user's demography, sociology, education, economics, worklife, role and degree of technology, etc. Data was collected from multiple sources, some professional and many social, and a generic user persona was crafted.

GENERIC USER PERSONA

Jane

Maurice

Age - 30-40 years old

Gender - Male or Female, with almost equal distribution

Education - Mostly with a Bachelors in Arts degree, some with a MBA

Location - United States of America

Social Status - Married, and some with kids

Occupation - Account Manager at a mid-sized Online Ad Agency

Economic Status -  Above average, but not well to do. Has a loan (an old education loan or a new vehicle loan) to pay for

Skills -  Online advertising, SEO, Analytics etc.

Technology Familiarity - The user is definitely very familiar with the following list of technology

  • Use of PC, smartphones
  • Email, text/multimedia messaging, video calling
  • Online advertising process stages
  • Office productivity suite viz. Word, Excel, Powerpoint
  • Online shopping and/or payment using credit card,  PayPal etc

Commutation to work -  Substantial commutation involved everyday to and fro the office

Work -  Works at least 6 hours on a working day. A typical day involves

  • Reaching work after a long ride from home
  • Compiling a performance summary of running campaigns and emailing to the boss
  • Discussion on new campaigns to be created
  • Decision making on adjustments to running campaigns
  • Creating new campaigns with new ad designs and new decision rules
  • Occasionally, doing complete exercises for a new client
  • Leaving for home after slightly exhausting day of work
  • Reaching home after a long ride
  • (If a workaholic) Quick check on the status of running campaigns
  • Also, on weekends, does not prefer to do active campaign creation/ editing work. But would like to see the performance occasionally

Work-related Fears

  • Campaign not being successful, by not enticing viewers to click on ads
  • Not able to achieve campaign goals within budget
  • Campaign going off-track or off-trend or becoming inactive, when not monitored (during the remaining 18 hours a day)

Possible Work-related Excitement

  • Mundane tasks being simplified
  • Able to be in control of performance, especially when things go wrong
  • Instant appreciation on milestones when reached
  • Learning new hacks/shortcuts around the software

USER CATEGORIES

For the purpose of crafting user stories, our target users behaviours were categorized based on three categories, into four possible types.

Online Advertising

New to online advertising

Experienced in online advertising

Retargeting Solution

Unfamiliar with a retargeting solution

Familiar with a retargeting solution

Adadyn Exposure

New to using Adadyn

Fairly experienced on Adadyn

User Type Exploration

USER STORIES

Based on the user types crafted, over 20 user stories were framed to construct the workflows necessary for the product. Couple of them are:

Jane is an account manager at an online advertising firm, and has been familiar with retargeting solutions like AdRoll and has been convinced to try out Adadyn, an advanced retargeting platform. She completes the registration process and logins in successfully. She logs in to run a test campaign without retargeting.

Maurice is already familiar with Adadyn. He is an account manager at an ad agency. He has conducted some prospecting campaigns in the platform, and feels excited at the results and also the overall experience in the product. The system indicates enough signals and statistics for him to conduct a retargeting campaign. He does not have a designer in-house and sort of expects the platform to give him some decent design solutions to make him choose from and use it.

UX SCOPE & REQUIREMENTS

The list of user stories and the existing platform features when combined, gave rise to a list of requirements in various departments that was set as the scope of the redesign process. The various types of requirements which were set are

  • Business requirements
  • Functional requirements
  • Usability requirements
  • UI requirements
  • Experience requirements

Note: Details cannot be shared due to client confidentiality.

PRIMARY WORKFLOW

Of all the workflows, the Campaign Creation workflow was found to be the prominent 'redroute' that will dictate the majority of the experience of the product. The existing workflow was trimmed off excess customization steps and replaced with a relatively straightforward one all the while maintaining the unique value proposition of the product.

Campaign Creation Workflow

INFORMATION ARCHITECTURE

The existing version of Adadyn followed a multi level hierarchical model for its structure of information and was following a tree-like navigation structure. For an application where accounts and performance of multiple advertisers (key parent node) are managed monitored, such a structure bore very heavy on interaction costs. Hence a 'matrix' model was adopted, where a sub-section of an advertiser can change into the same sub-section of another advertiser, with a single interaction.

Hierarchical to Matrix model for Information Architecture (Screen from presentation)

CONCEPTUAL MODEL

In the existing version, the user to facilitate with at least five different interactions to get something substantial happening. It was due to the absence of any conceptual model that resulted in such a high interaction cost. One of the major improvements sought out was to implement a simple conceptual model and design the application to reflect the same. The new conceptual model was an uber-generic but quite common one that one can observe in any place where categorical ordering takes place viz., a library, supermarket etc.

Conceptual model for the core workflows of the application(Screen from presentation)

INTERACTION BRAINSTORMING

Based on the workflows designed, various options for various parts of the application were ideated. The team participated with numerous discussions on analyzing the pros and cons of each choice, and evolving the optimal choice for each stage.

UX Redesign discussion room screens

As the information architecture was changed from a hierarchical to a matrix model and the conceptual model was decided to be a choose-pick-act strategy, various navigation designs had to be explored so that they support both the IA and IxD seamlessly.

Adadyn Navigation Design Concepts

In order to implement the matrix model of information architecture, a drop-down based navigation control was designed. It was designed to implement the advertiser switching without changing sub-section context. And it was nicked 'Advertiser at work'

Advertiser-at-work Concept

WIREFRAMING

Each shortlisted concept for each stage were wireframed in medium-fidelity and presented to the team for discussions on improvements and implementation. The core criteria of shortlisting and picking the winning candidate were an optimum balance of interaction costs and cognitive loads.

Wireframes of shortlisted ideas (Blurred to maintain confidentiality)

STYLE GUIDE FOR UI DESIGN

Aside from focusing on making effective information designs, one of the major business objective of the interface design process was to subtly and yet effectively propagate the brand image of the company within the application.

Color guide for UI design

Typography guide for UI design

INTERFACE DESIGN

As the look and feel of the entire product was changed, high fidelity mockups of all screens had to be done and displayed for discussion on development.

Campaigns Dashboard

New Campaign Creation

New Advertiser Creation Form

Creatives Management

Live Creative Studio for creating Dynamic Creatives

DEVELOPMENT

The implementation was carried out over a period of two months. The following technologies were used to rapidly develop a fully functional version of the concept.

Twitter Bootstrap Framework - Front-end framework

Durandal (JQuery, Knockout, RequireJS) - Client Framework

JQueryUI - for the Live Creative Studio

Note: No backend technologies were changed for this project

USABILITY STUDY DISCOVERIES

A structured usability study was conducted on the redesigned platform using the internal users of the platform. The discoveries made during the study were

  • On the very first go, the existing users could not figure out how to navigate between advertisers. But learnt once, the interaction was found very useful and seamless
  • Campaign creation workflow was very smooth and comparatively less time consuming
  • Instant rendering of banner designs in Live Creative Studio was a nuisance. Response after a slight pause was considered better.
  • A lot of sections lacked 'empty states', hence appeared deserted.
  • Some users wished for interfering notifications, and some non-interfering. So a hybrid solution is to be explored.

Overall the new version was reviewed to be a far better design in terms of usability, brand image, aesthetics etc.

AWARENESS PRESENTATION

After the  implementation was done, a detailed presentation was given to all employees in the organization, about the entire project, from strategy to the implementation, justifying every design decision that was made.

Presentation screens

NEXT STEP

Based on the visual design approach handled in the process, a mobile version for a campaign monitor was conceptualized. It would give a quick access to running campaigns data and enable the account manager with minimal controls to take action as required, especially when they are away from the desktop platform.

Campaign Monitor om Mobile (Concept)

LEARNINGS

The key learnings from this redesign project are

  • Functionality coupled with usability leads to better user experience
  • Affordance comes before style, hence make controls obvious
  • Cross-functional teams are better than pure-design teams in rapid turnout of practical designs
  • Empty states are excellent way for helping users to take right actions
  • Brand assimilation inside a product gives the feeling of engaging with the part of the organization itself
  • Stakeholder consensus is key in the success of a design project

Note: This version of Adadyn has been removed from service due to pivoting of company towards offering retargeting SaaS software to self-serving business owners instead of mid-market advertisers.

What do you want to do next?

BACK TO TOP

SITEMAP

FOLLOW ME

RESUME

All content of this website is protected under Creative Commons Attribution + Noncommercial + NoDerivatives License.