Michael Harper

UX and Product Designer

Alfred

Overview

Alfred is an access control application for a mobile devices, allowing venues to perform contactless ticketing, event reporting, and other box office tasks. Originally launched on iPhone in 2018, it has since come to Android and to Boundary Kiosk devices for self-service ticketing.

One of my first projects at Tickets.com, I worked alongside a senior user experience designer. Alfred's stakeholder group, including experts in ticket sales, developers, tech writers, and business analysts, provided assistance with research, requirements, and first-hand experience.

Constraints & Circumstances

  1. Alfred would soft launch on iOS with a small deployment, but it was later decided it would see wider release on Android. Because of this, designs first targeted Apple's user interface guidelines specifically, but the final designs would reflect the change in platforms.
  2. Unlike typical box office applications, which are usually run on computer terminals indoors, Alfred would need to work outdoors. This added more scenarios to test and ultimately played a big part in defining Alfred's aesthetic.

Reporting Functionality

Alfred includes provides the common ticketing tools a box office may need in a portable, phone form factor. While I contributed to the overall visual design of Alfred, I was tasked specifically with designing the interaction and user experience for Alfred’s reporting tool, a utility to provide at-a-glance level event information to venues.

Starting at a high level, I researched similar utilities offered by ticket sales companies, e-commerce storefronts, and customer-managed relationship applications. I combined my findings with the project stakeholders' desired functionality to form a first pass and requirements and then developed rough prototypes. I used simple video prototypes to express how this information could be navigated on a mobile device.

Cohesive Design Language

Once the functionality and requirements were approved and finalized, I began to move the prototypes closer to Alfred’s overall visual language. These designs were iterated on as the visual language itself grew and finalized. First, we targeted native iOS user interface guidelines. Then, we shifted to a more platform agnostic approach which could be implemented on any mobile platform. Finally we landed on a design influenced by both our agnostic design and Android's Material design guidelines.

First Draft Alfred Reporting First Draft Alfred Reporting Second Draft in iOS Visual Language iOS User Interface Draft Final Draft in Material Design Language Agnostic Alfred Draft Third Draft in Material Design Language Finalized Alfred Design

Accessibility

As with any user experience project, accessibility plays a huge role. Color contrast, implementation of voice over, and the ability to use alternate input devices were all important considerations throughout the design process. In addition to these, Alfred presented some accessibility concerns unique to ticketing. The app needed to be visible in all kinds of light; indoor or outdoor, dark or well-lit. To better meet this need, we tested our initial designs on phones in a diverse assortment of lighting situations. As Alfred moved further along, we continued these tests with early prototypes of the scanners. Finally, early pilot programs at baseball stadiums gave us invaluable user feedback, leading to rapid iterations to the color choices. Heading into 2020, the next consideration is a “dark mode” version of the application to better support events in dark rooms.

Conclusion

Since its initial release, Alfred has been well received. It has quickly risen to prominence in Tickets.com's application catalog, and the growing user base has provided us with more insights and data on how to improve the application. Over time, we've tweaked icons, color choices, and wording to iterate and improve on our original ideas. Next I would like to address alternate display modes for lighting situations, like providing a dark mode.

Additional Videos of Prototypes