Optimizing the one-tap purchase flow
As a last-minute ticketing platform, our fans love how easy it is to purchase tickets without hurdles. For some of those fans however, found that they missed important details that could have prevented mistakes on their purchases.
Gametime Purchase Page
As a last-minute ticketing platform, our fans love how easy it is to purchase tickets without hurdles. For some of those fans however, found that they missed important details that could have prevented mistakes on their purchases.
The purchase page before the redesign in 2015.
Ticket quantity and seat information wasn’t obvious.
We noticed that our customer service team was receiving queries on two major issues.
- Customers somehow couldn’t figure out how to change the default quantity. The common question would be, “Do you sell more than two tickets?”
- Some customers thought they bought the wrong seats. Some customers would complain, “Why are my seats wrong? I though I purchased a different sec/row/seat.” This common issue is due to our fast turnover in ticket inventory. If a user is about to purchase, but then closes the app and reopens it—the app will most likely show a similar seat.
To solve these major problems, Gametime needed a redesign that would increase conversion, improve clarity, and support new payment methods like Apple Pay, PayPal, and Venmo.
My Role
This was my first solo project at Gametime and I worked closely with the VP of Product for a month on mockups, and another two-week sprint to review designs with front-end engineers.
Reducing visual load
To reduce the clashing seat map and seat photo, I shrunk the giant seat map into a mini-map. This was directly inspired by Google’s Material Design FAB (Floating Action Button).
I stretched the seat photo to fill up the background edges of the phone. This allowed users to feel immersed in our high-res photos.
All within thumbs’ reach
With larger phones entering the market, I made sure the design was flexible for emerging phones like iPhone 6 Plus. Anything interactive elements are kept as close to the bottom as possible.
In these mocks, the grey boxed areas represented things you could manipulate.
Problems arose when additional ticket delivery information needed to be placed somewhere. This includes “Delivery Only” and “Printing Required”.
Share Button FAB
I wanted to create a Floating Action Button, but since Share wasn’t the primary call-to-action, I integrated it into the top-right of the card. To increase visibility, I saturated the background of the Share button.
We didn’t keep the FAB button style because it would compete with the map.
Final
Design
![]()
Final
Design
A focused purchase page to highlight seat and ticket quantity.
Shrink-Map
The map became too much of a distraction in the final purchase screen. When a user tapped on the map, it expanded into a full-screen map. These users were 10% less likely to purchase.
Simple Payment
New convenient payment options like Apple Pay, Venmo, and PayPal allow customers to pick faster options.
Info Clarity
To increase clarity, I increased contrast and chose heavier font weights. I bolded the section information and centered it below the focal point (the mini-map).
Selecting ticket quantity was transformed into a sliding selector—updating the prices based on quantity.
If a user has Gametime Credit is was defaulted to “On”. The On/Off switch was clearer to use than the previous radio button.
Panorama Views
The images needed to get higher in quality for the incoming large smartphones. We nudged our Venue Team to upgrade our images to 4x the original size.
Due to the crop, we enabled accelerometers to automatically pan left and right when you twist your phone.
Special Delivery Types
Although we prioritize mobile tickets, some venues require patrons to present a printed PDF or physical paper tickets. We disclose this to the user before they purchase the tickets.
