Tracy Cheon UI Designer
  • Portfolio
  • Me

UX/IA Event Lifecycle Manager

Background Overview

​UX Research

​
Research & Discover

​
Competitive Analysis

​
Information Architecture

​
Wireframes

Background Overview

eshots hired me to re-create B2B in-house event performance management software products.
​

Each year, there are over 25,000 corporate events and about 3 million consumer data is being captured. The products I have worked on is the management system of these data and the tools to collect both qualitative and quantitative data at these corporate events. It is to create reports to measure KPI for client events ROI.

400 plus internal hours get checked in each month to set up and update clients' programs.​ The project had kicked off with SPR UX agency. The early development was in process a couple months ahead to I was hired.

I was their first UX/UI Designer. 

​Initial State of eshots products

It was important to understand the backend structure of their database system. Each feature lived in different sites/urls, which caused the major issue on usability. Below shows the example screen shots of current tools.
Admin page - User Management and Authentication
Commend Center- The current software is placed in various systematic locations and not usable for non-systematically trained users. Each link directs you to different tool. Some of tools requires set up at the other tool and navigating through these are not intuitive.
Survey Generator platform for QuickCapture and Microsites with consumer merge scope and data elements. Applying logic for branching questions required backend understanding.
EventLocation is selection of chosen products and activities for reporting. This tool should be automatic when events are being created.
This is the UI for creating new client and the brand in the system. In order to set up the campaign, you must have selected client.
This is the UI for creating new campaign in the system. Each campaign has assigned client and one client has multiple campaigns.
This is the Event Creation view.
List of events under selected client and campaign that user has access to.
List of all the client data that has been created.
Real time Event Monitoring(REM) - once the event is set up, The real time monitoring tool is triggered every 20 minutes during the event in order to measure the performance and maximize the results by update the real time data. (i.e. If there is a specific question that offends many users to cause drop out during the survey.
QC is Client customizable iPad/iOS based survey product for clients to collect customer PII at events.
EventIntelligence: Customers inputs their information, and on the backend, API imports these databases into a presentable format on Event Intelligence (EI). Depending on each client’s campaign goals, EI provides the measurable quantitative KPI.
SourceCode Central is the client side database ID that eshots sends to once the consumer API is collected.

Database Architecture Overview

There is a systematic hierarchy among the structure of database system set up.
​

Every year, clients run many campaigns and create their final reports for their ROI. The way each tool is being set up bases on type of clients. For example. The Chrysler has multiple brands like Dodge, Ram, Jeep, Fiat etc., which has many brands. Coke also has brands such as Vitamin Water, Coca-Cola and Diet Coke etc. These clients with many brands have different reporting group set up of campaigns than other clients like USAF, which is a singular reporting set up.
Picture
Event Location is the systematic groups of different activities at events. Each activity types have data elements and gets hooked into consumer API.

This allows us to create the structure of the system in a way that we could logically segregate the data into the format as required.

For example, "Merge scope" is for situations when one consumer registers with the same email address at multiple activities at the same event. The system should count them as one person. But when they attended to multiple event days or events, or even to campaigns, there should be a rule to set up when to consider them as one consumer. ​

Clients can set this up to either consider consumer merge scope to be on one day or one event level, or the whole campaign level. This would mean that reports will be measured and imported in such way.

Each product at least has to have one Event Location. For example, QuickCapture booth registration at the entrance (Where consumers scan their drivers license and inputs their personal data) and the other QuickCapture registration at a different location at the same event, are both using the same product but they can be in different Event Locations. Although these products need to be assigned to at least one chosen Event Location. 

Parent Event Location is for the reporting group, where it is going to be hooked on for the reporting system on Event Intelligence(EI) platform. 

Image below is showing different event locations with activity types. The initial state is user have to manually set up each Event Location, which should be automatically set up depending on the chosen products when user creates the camapaign. 
Picture
A lot of our admin configuration can happen at the individual product config level. I.e. we shouldn't have to create a RR event location prior to setting up an email. This is something that we can choose from/create at the time of setting up the email. The same could go for SurveyGen, microsites, etc.
​- Ryan (Developer)
UX Main Issues
  • Company needed rebranding and establish visual identity for new products See Rebranding
  • 42 key features in one platform Complicated database operation and management system placed in multiple locations, which breaks the workflow.(Shown below)
  • 8 different user types
  1. eshots AMT (Account management team)
  2. eshots Operation team
  3. Client Admin
  4. Client
  5. Tour Manager
  6. Consumers
  7. Agency of Record

Process for collecting data onsite
Authentication token is the security token with the consumer ID, which is often QR code or the wrist band for each consumer. Depending on whether the consumer is being found in the system or not, the consumer can proceed to answer further questions/attend to further activities.
​
Below is showing the different options for clients to save the consumer data depends on the situation. The image on the left is showing the case for one day event or clients decides to put all the data collected throughout the whole event level, and not on the day level. The image on the right is showing the further steps of identifying the event day ID in order to separate consumer data collected on the different days. 
Picture
Picture
Event Scheduler & Source Code Central - ability to enter events and codes at the same time would be more efficient; sometimes you don't always have the source code at the time of entering events, so need to be able to identify which events are missing codes
- Brit (Account Manager)
Background Overview
​
​
​UX Research

​Research & Discover

​Competitive Analysis

​
Information Architecture

​
Wireframes

Research & Discover

eshots Internal User Workflow and Relational Structure
​
Account managers create RFA/RFI (Request for assets and Request for Information) on spreadsheet filled out from clients hand off to operation team to send off assets needed for events (iPads etc). 
​
  1. Production team creates customized tools (survey tools such as microsites and QC, sometimes internally build in EventOS for multiple brands from one client ex. Chrysler Group with Jeep, Ford, Dodge, RAM..).
  2. Event Managers collects qualitative data at events and submits as reports.
  3. Account team creates reporting groups collected from EventIntelligence metrics and present to clients.

Below are the example relationships of eshots to clients such as FCA and USAF as well to other agencies using our platforms.
Picture
I often roughly sketched out the relationships of different platforms across different devices in order to understand how theses systems could and should work among users with different permissions.
Picture
Site Experience
USAF
 events I attended for our product experience is shown below. Consumer registers on the iPads and scans their driver license to enter. This is one way to collect consumer API. API imports these databases into a presentable formats on Event Intelligence (EI). Depending on each client’s campaign goals, EI provides the  measurable quantitative KPI.
Picture
Picture
Image below shows consumers registrating on QuickCapture and scanning their driver's licenses.

Organizing features 
My initial approach was to understanding and organizing the information to structure the relationship between various features for different users. Below is the graph I came up to place all 42 features in to the placement for spectrum of usage for these products. The reason putting this graph together is because of user management system for client licenses admin system.
Picture

Card Sorting
My team used Proven By Users to conduct card sorting with 21 internal users such as account managers and developers and R&D Production team. Below are the three main ones demonstrated the vision for each team members. 
Engineering lead
Picture
Research & Dev lead
Picture
AMT lead
Picture
Event Scheduler should merge with Source Code Central and show Event ID & Event Date ID (I have to use MB Import tool to get at Event Date ID; or run a query). It should also be used with Salesforce (or get rid of salesforce altogether?) Could we use tickets/confluence to request equipment and talk with Sales? All this should be in one place instead of toggling between many different browsers/platforms. - Meg (Account Manager)​
Current Internal User Workflow
Blow is the steps each steps of the tools eshots internal team goes through. AMT mostly sets up the the event and goes to Source Code for the client Database ID, then sets up the Reporting Group in order for the data to be shown on EI metrics. The current tool separate the goal entry tool, which is directly related to reporting group tool. the user management tool allows them to assign users to a have permission to view data. 

​Depending on each situations, AMT then goes directly download the data collected in a spreadsheet formats or view EI and REAM (Real time event monitoring) in clients' requests. AMT hands off the information collected from the clients and Production receives these requests and sets up the requested tools manually because in order to set up these tools, such as QC from Survey Get, is not intuitive for normal users to use and requires certain level of coding knowledge . The goal  is to make this complicated process that takes up extra internal time to have clients do for themselves. 
AMT
Production
Picture
Tools that needs to be combined
Event Scheduler & SourceCodeCentral (Client Database Code)
 Event Intelligence & Data Download
MMS/SMS & Rapid Response
Survey Get & Manage QC Package & Manage Reporting Labels & Flow Helper
RealTime Event Monitoring & EventWatch
Generate EventTokens & QR Code Generator
Incentive Look-up & Browse Photo (Consumer lookup tool)
User Management & User Reporting

Background Overview

​UX Research

​
Research & Discover

​Competitive Analysis

​
Information Architecture

​
Wireframes

Competitive Analysis

Picture
We looked into other companies that are targeting the user for the management systems and these are the main competitiors that we looked into. LimeLight and Cvent are the direct competitors.

​Most of these companies only has the single level of event but not the concept of campaign level. Our team focused into how these companies grouped their tools, visual presentation for informations on each page and their navigation.

Cvent
The concept of "Dashboard" allows users to have their own page where they can track on completion to their tasks. Below shows the event overview page, with the filter to current and past events.
​
Below shows the Overview of the event which shows the main information of the selected event. The organization of the content is is set up above the fold and this makes it easier for the users to navigate through the multiple types of information. 

The planning steps section is interesting as it guides users to keep track on the completion of their tasks once the flow requires users to go to different page to complete the tasks.
Picture

SurveyMonkey 
​
The way they presented the graph and way to compare different datas are organized and easy to view.
Picture
QuickTapSurvey
QuickTapSurvey is the direct competitor for the setting up tools. They provided a great example of the ways to present our SMS/MMS tool.
Picture
 LimeLight
​LimeLight also used the concept of dashboard also has the concept of canvas for the tools, which is similar to dashboard. This view also presents the list of products and able to set up directly. We also looked into LimeLight for their user management set up process.
Picture
Picture
Picture

Airtable
Airtable is the project management / scheduler app for multiple users. We looked into the way they organized the database content and the way they introduce their users to navigate among their management system.
Picture
Picture

Common Groupings of competitors

Cvent, LimeLight and QuickTapSurvey are all planning and management platforms and they each have collectively different navigation and organizations. The way to present informations and setting up process is slightly different although their groupings were consistent.
Picture

Clear Direction
​​

1. Have one grouping for campaign setup
2. One grouping for  client admin , including user management and license management
3. Each tool needs to be accessible from anywhere and be able to navigate from one tool to another
4. Combine or provide backend hooks for Event Scheduler and Source Code Central
5. SurveyGen when redesigned should incorporate Manage QC package, Survey previews, Flow helper and Data previews
6. User Management hooks should be built into Campaign Setup, Event Setup and Reporting Group Tools
Further Research required for development team scope

​1. Should Event Maintenance and Reporting be in one grouping?
2. Hooks into tools frequently used sequentially is key e.g. reporting group tool and user management
3. Rethink Data Download considering all it’s uses and its intersection across journey
4. Should data management be its own group with lookups, moves and marking of test data in it?

Background Overview

​UX Research

​
Research & Discover

​
Competitive Analysis

​Information Architecture

​Wireframes

Information Architecture

Picture
Below shows the two initial ideas of IA. The main grouping were started with Reporting, Manage Events, Admin and Product set. Although some of the products gets set up after campaigns and events are set up, it may break the flow during the initial process.
Picture
Once the idea of campaign needs to be showing the process sets while set up with list of products from the main dashboard, Director and developers has worked together and took the direction below, developer suggested that having all the products on the flat level avoids the API complications.
Picture

Navigation 
In addition to other competitors, we also looked into other management system competitors, such as Google Analytics and JIRA, for the navigation bar design.
The way Google Analytics presented their navigation bar is complicated as they have multiple hierarchy although the placement of the search bar was easy to find and internal team had agreed that this is one of the most significant feature that is expected to use in sufficiently. 

As both of these tools contains multiple and complicated features, they were presented in the different placements. 
Picture
Picture
Our team agreed that everything except the personal profile and the user admin tool, which also can be user management tool oversees multiple clients, and depending on the Client licenses clients purchases, they will have more access to be able to manage their own users, all the other tools requires for the clients to be selected. 
Picture
Picture
Our team talked about different approaches for the Campaign view layouts, below is one of the example view with the navigation applied. This is before our team did Design Studio for each core pages.
Picture
Background Overview

​UX Research

​
Research & Discover

​
Competitive Analysis

​
Information Architecture

​Wireframes

Wireframes

Along with the  Starting off the list of things to include, below are the low-fi sketch for the campaign overview page.

​The goal for this sketches are to understand which features to include on this page as well as the visual groupings and the placements. This was also to discuss with the development team in order to meet the expectation on implementation and scope of the project.
Below are the wireframes of the pages I've designed. Design studio was done with the development team and the product director. We first discussed the feature of the databasses of the content that can be presented on each page then organized structure of the placements.
Below are the sketches that has been done during the Design Studio with our internal team.

My Dashboard
The goal for the dashboard is to be able to overview the active campaigns and being able to view that all the required tools have set up successfully and has completed. One of the developer also suggested the ideas to have the secondary dashboard, which user can manually organize the feature of the page in their matter of preferences. 
​

Required features

- Schedule
- Events without a source code
- Active campaigns with with setup completion %
- ENLs that need data moves for active campaigns
- Data Transfer Authority for active campaigns
- Emails across active campaigns with status and last run
- SMSs across across active campaigns with status and last run
- Recaps received but unpublished
- Recaps overdue 
- Recent Photos Received ​
Picture
Picture
Picture

Picture
Below is the suggested idea of the personal dashboard. I created the low fidelity wireframes and suggested the flow and the director liked it. Although this may blow up the scope of the hours so we decided to put this on hold.
Picture

Campaign Overview
Campaign overview is not only for users to be able to see the KPI but also to manage data collected and set up the campaign along all the products requested. Below are the content that needs to be included.

Required Features
-Name / Details - Reporting label button
-Metrics 
-To do list for users
-Event Locations / Chosen products 
-Event List / Views with SourceCode / Prior years 
-Consumer Look up button 
-Data download button 
-Files
-Asset management for product setup (Snapshot frame, passes, and QC background) 
-Reporting Groups & Goals entered (Yes/no)
-Comments 
Picture
Campaign Overview with Metrics
Below shows the campaign overview with the metrics across up to date once the data has collected from the field.
Picture
Campaign view without the metrics
Below shows the campaign without the metrics,  before the campaign has started and there is no metrics to be shown.
Picture
Consumer Look Up
This is to view all consumer data and answers for the event, and see their incentive links and photo links if available, and be able to sample out chosen consumers, and move them to another event 
Picture

Event Overview
For events that have completed, be able to see a full summary view of the event to understand how it performed and why, which includes:

- Supporting files/reports uploaded to the event
- Event name, date range, and location (other event details are secondary)
- Sampling of photos from each event day
- All recap answers for the event grouped by question
- Totals for interactions, consumers engaged, registrants, opt-ins, leads for the event broken up by user
- Goals vs actuals for the event for for interactions, consumers engaged, registrants, opt-ins, leads
- Totals for interactions, consumers engaged, registrants, opt-ins, leads for the event broken up by event / event location / for the event shown by hour / compare to the prior year event if mapped / for the event - and these metrics needs to be shown on the day level with the metrics broken up by user (The tour manager). 

- All recap answers for the event day from all users
- All photos for the event day
- Allow agency and AMT to dig deeper and trouble shoot data for the event
- Search for consumers by identifiers in the event and see their incentive links and photo links if available, and be able to sample out chosen consumer records 
- Agency and AMT users need to be able to edit event details and cancel events
- Agency and AMT users need to be able to map prior year events
- Agency and AMT users need to be able to assign source codes to data transfers at the event, event day or event location level
- Users are able to click through to the campaign details view to understand how the campaign as a whole performed and how it was setup to further explain performance
- Comments for collaboration
In order to organize these overwhelming amount of informations, I first sketched out different ways to present these contents in order to create visual structures.
Picture
Picture
The image on the left is showing the content that needs to be shown and I created the hierarchy on different informations. Then I sketched out different ways to present these information.

The relationship between Event Overview and Event Detail view was interesting because they both have similar content but the purpose of looking at each page were different. They are both mobile first view as the purpose of both views are to keep track on the event performances. Types of metrics also look similar although for the Overview, users are to checking on KPI for the whole event and in order to compare from the prior year's KPI and summery of recaps submitted from the field. The Event day view is to keep track on the events that are happening today and possibly compare the metrics in comparison to different days. 

Below are the different directions of designs I brainstormed.
Picture
Recaps
As Recaps is the significant section which require maximized efficiency in comparison to different views. Summary view presents the sum of numeric field and this is the default view for the recaps when "All" event day is selected. 

Users have options to pick either view by dates or the questions and once they select the specific dates or the questions, they can view different answers submitted by different users. It is also important for users to able to publish recaps from this view so we included the publish buttons for unpublished recaps on the day level.
Picture
Picture
Picture
Picture
Users also may edit answers if they need to. Published recaps must be unpublished in order to edit. Image above is the modal view once users click on the user name on the recap chart.
Image below are the final wireframes of event day views. 
Image on the left is the default "All" selected view. It shows the summary of the overall event recorded by the tour manager. Real time monitoring is shown on the right side of the summary which will stack to the bottom for the mobile view. Consumer look up button is following and this will be in the modal form as it was shown previously. 

As purpose of viewing the KPI is different for the Overall event view and the specific day view, the overview of the all event days will show the total numbers and the bar graph will be shown in comparison to the previous year. The reason we didn't give an option for the previous year comparison on the event day level is because the annual year events are not necessarily happening on that specific date. Instead, we chose to show the KPI measured on view by Event Location and different user level, this way, it is easy to compare the data collected by different users.

Photos are distinguished by event day level. Overall, it is simple to understand that All Event is for the purpose of overseeing across the whole event and the event day level is to give an option to see the data collected on that specific day and view the condition of the events of that day.
Picture
Picture

Background Overview

​UX Research

​
Research & Discover

​
Competitive Analysis

​
Information Architecture

​
Wireframes

I left eshots shortly after creating these wireframes. 

The main thing I learned during the process of design iterations and developing Information Architecture was to identify the UX issues based on users' feedback and initiating the ways to solve these problems.
  • Portfolio
  • Me