Project Summary
A suite of products to make it easier for trade-show attendees to browse, save, and revisit exhibitor content during and after trade-show conferences as well as the exhibitor content management systems.
Project Stats
Role: UX Designer – research, wireframes, UI design, interaction design, information architecture, user testing, paper prototyping, feature creation and prioritization, stakeholder presentation and interviews
Team: 01 UX Designer, 01 UI Designer, 02 Product Managers, 01 Back-end Developer, 02 Front-end Developers
project ongoing…
UX Challenges
- Create a seamless and responsive experience for users both on mobile and desktop hardware
- Balance product design between minimally viable features and scalable growth
- Design within the “Tangible Guidelines” for all Freeman products
Personas:
Exhibitors
- People who have purchased booth space to show their product, brand, or service at a trade-show
- Pain points:
- Booths can get too crowded to give each attendee individual attention
- Physically printing out information is bulky, time intensive, and not environmentally friendly
- Needs:
- Upload and manage their content, as well as associate that content with QR codes that attendees can scan while at their booths
- Pain points:
Attendees
- People who come to trade-shows to learn about and connect with exhibitors
- Pain points:
- Conferences are crowded so it can be hard to visit all the exhibitors you want to see
- Remembering every exhibitor you saw and what they presented in their booth can be difficult
- Viewing interesting information and content post-conference can be done in a myriad of different formats: physical flyers, bookmarked websites, white-paper links
- Needs:
- An easy way to select and view content both during and after trade-shows
- Pain points:
Onboarding
Or, How do you teach someone to how to scan a QR code when the application itself begins after the code has been scanned?
One of the interesting problems of this product was its lack of dedicated tutorial steps.
The solution: Iconographic instructions on the code itself
First design 
Final design
The final design was arrived at for a number of reasons:
- Stroke weight was a less overpowering way to highlight the intended interaction for each step
- Having real QR codes at that small a size created visual confusion
- Arrows were added to reinforce the linearity of the process
- Written instructions were shortened to their simplest forms
Exhibitor CMS
Testing and Design
After designing the initial content management system for Exhibitors and reviewing with the internal team, I set out to confirm our assumptions with informal paper prototyping.
Interview Methodology for Paper Prototyping
I created a simple interview script that would tell volunteers the key points of the testing session:
- The persona they would be role playing during testing (an Exhibitor)
- The tasks they needed to perform (use the CMS to upload content and associate that content with a QR code)
I asked volunteers to complete these tasks using printouts of the 4 main pages of the CMS wireframes:
Survey Responses
Overall some very interesting and useful feedback was given by our volunteers. Some feedback:
“I’m looking all around at the instructions and cannot find the buttons”
“Adding content to a QR code is confusing! There’s too many buttons and options on this page.”
After reviewing the full survey responses with the team, we arrived at these solutions:
- Add descriptive labels and iconography on all buttons to make actions more clear
- This had the added benefit of reducing the amount of instruction text on pages
- Make the QR Code Editing/Content Association layout easier to use by changing the position of key UI elements
Redesigned CMS after Incorporating Testing Feedback
UI Designs
Attendee Mobile Designs
The mobile experience for the attendees parallels the experience for exhibitors using their CMS. Starting with the events, attendees can from there browse all their exhibitors, view all of the saved content, or they can specifically view content saved from one exhibitor.
Mobile Content UI and Functions
Wireframes for mobile content browsing and associated functions, designed to be in-line with feedback from the exhibitor CMS paper prototyping.
Interaction + UI Prototypes
Mobile instructions expand/collapse behavior
Exhibitor information expand/collapse behavior
https://projects.invisionapp.com/prototype/cjri374lk004zq5016p2t4ecx/play
Responsive desktop CMS designs forthcoming…
Tyler Wilson : Designer + Strategist 