I was assigned a task to redesign a product for Convention Data Services. It was an onsite lookup and print webpage where registrants can scan their badge to enter an event. They wanted to add new functionalities like a mobile check-in feature and facial recognition, however the hardware was outdated and limited. Some clients suggested to build kiosks which are better suited for facial recognition. Others preferred tablets to cut costs on logistics and to offer a more efficient setup of hardware onsite. My objective was to come up with a solution that covers the needs of each client while maintaining a reliable desktop alternative.
Outdated Images and UI
Typography needs some work
Webpage is not mobile friendly
Modern UI with less clutter
Improved typography and alignment
Proper display on desktop or tablet devices
Much of the creative content addressing scanners involved the user scanning a QR of a product, rather than having a QR scanned from their device or a printout. As much as we wanted something different, the concept of guiding the user on how to scan their confirmation email was still relevant, especially for those users who don’t fall under the millennial/gen-z age group. The problem here was how dated the assets were and the placement of said assets. iPhone 4S, pixelated scanner, and the perfectly manicured hand. We needed a makeover, so below are some of the concepts:
After deciding the UI elements to update, we went ahead and rebuilt the code to new standards. The graphic was converted to a Hero section which no longer has a “click me now” appeal and we added some nice CSS animation transitions to eliminate the “butchered hand” effect. We were able to add the new scan features and tested the UI on our tablet kiosk prototypes where they rendered to perfection. Overall the event services team were excited to see the much needed improvement and the prototypes are off to the developers for production!