UI & UX DESIGN

Wrapify

UI & UX DESIGN

Wrapify

UI & UX DESIGN

Wrapify

UI & UX DESIGN

Wrapify

UI & UX DESIGN

Wrapify

Wrapify asked me to help streamline their admin and reporting screens. It was different for me to focus on streamlined administrative processes and data visualization, but I'm happy to show off the results.

Wrapify asked me to help streamline their admin and reporting screens. It was a challenge to focus on streamlined administrative processes and data visualization, but I'm happy to show off the results.

Drive. Earn. Live.

Live. Drive. Earn.

Wrapify had an ingenious idea: pair drivers with advertisers to use personal vehicles as a visual communication platform; and to simplify and track results with the latest web technology has to offer. The Driver's Mobile App made it as easy as possible for drivers to sign up and become part of the Wrapify network. But advertisers needed the tools to build the mechanics of a campaign and upload their artwork for Campaign Creation - and track the results in the Advertiser Dashboard.

Campaign Creation

Wrapify's business model depended on a platform that enabled advertisers to create and launch campaigns with an intuitive and automated system - so a clean UX/UI was paramount.

PROJECT REQUIREMENTS

The steps for campaign and artwork submission requirements were well defined by industry standards - but Wrapify’s online experience needed refinement: the campaign parameters had to be established across date, location and pricing; artwork needed to be uploaded against placement type; and a linear process had to be divided into efficient, easily understood steps.

UX MAPPING & PROCESS FLOW

The process of creating a campaign was linear and straightforward, but for the potentially tech averse target user, the steps had to be broken down into small, tight sections.

UX DEVELOPMENT - WIREFRAMES

Extensive iterations were completed in Axure to cleanly define the campaign creation experience before UI work began. One of the tenants we kept coming back to was the need for the UX to be quick and decisive to keep calls to Wrapify's customer service to a minimum.

*Responsive design was not considered for this process - the user would be redirected to their desktop device if they accessed these pages on mobile.

UI SCREENS

Once the UX foundation was set, Google Material was decided upon for the over laying skin. A quick set of iterations followed to define a clean look for this interface.

Advertiser Dashboard

Once the campaigns were set and the drivers were out and about, Wrapify's advertisers needed a monitoring system to guage the reach and impact of their work - and in a quick, customizable overview.

Advertiser Dashboard

Once the campaigns were set and the drivers were out and about, Wrapify's advertisers needed a monitoring system to guage the reach and impact of their work - and in a quick, customizable overview.

PROJECT REQUIREMENTS

Wrapify’s Campaign Tracker Dashboard had to provide a quick primary overview of the user’s active and inactive campaigns and significant detail as the secondary view. As a desktop-only web application, the design had significant technical requirements to accommodate Wrapify’s proprietary data sets and necessary granularity.

The client requested "lots of knobs and dials" to fine tune the data visualization - I was more than happy to accommodate.

Wrapify’s Campaign Tracker Dashboard had to provide a quick primary overview of the user’s active and inactive campaigns and significant detail as the secondary view. As a desktop-only web application, the design had significant technical requirements to accommodate Wrapify’s proprietary data sets and necessary granularity.

The client requested "lots of knobs and dials" to fine tune the data visualization - I was more than happy to accommodate.

UI DEVELOPMENT

The design process went through significant iteration in order to fine tune the technical requirements and satisfy Wrapify‘s aesthetic paired with Google Material. This included multiple passes on data visualization for the secondary tier of campaign data, as seen in these graph concepts. These were done to provide a quicker snapshot of pertinent data while being practical for Wrapify's developers.

FINAL ITERATION

The final iteration gave Wrapify campaign owners the primary information in a concise format, while making secondary but vital data sets easily available through scrolling. For advanced users, we included the option to customize the Dashboard according to their needs and preferences.

UI/UX DESIGNER

Brian Desautel

CLIENT

Wrapify

UI/UX DESIGNER

Brian Desautel

CLIENT

Wrapify

UI/UX DESIGNER

Brian Desautel

CLIENT

Wrapify

YEAR

2016

AGENCY

Infernal Machinery