select work

Google VR

Mixer Match

Snag

Showbase

Latch

Neon Surf

Find concert tickets at the price you want to pay

Launch site

Design consulting

2019

Project time

6 months

The Stock X of concert tickets

Headliner allows users to discover nearby concerts and bid the price they’d like to pay for a ticket. The team contacted me to refresh their design system and design their mobile app experience from scratch.

I kicked this project off with several in person design exercises and sprints with the CEO, resulting in a groomed backlog of features and a set of planned monthly sprints.

I was the only designer on the project and responsible for all the pixels shipped, design strategy, implementation polish, and product vision.

The core experience

The main landing point for the user is the home page, an algorithmic feed of all the relevant shows/events for the user. The page learns a user's interests after onboarding, favoriting artists/genres, and sharing their location. Once it understands those interests, it will generate collections of upcoming events. the goal here is to be a bit more browse heavy than the average ticketing app.

Detail pages

When I did the initial competitive audit, I noticed that the majority of ticket sites focused their detail pages on seat selection and the actual ticket buying experience. I wanted Headliner to focus on the artist (without delaying the ticket conversion flow). If we focus on the artist, it supports a new browse driven use case (discovering new artists through Headliner) and just creates more of a soul for the product.

The detail page ended up being a bit of a story describing the artist, a collection of facts, songs, videos, merch, and venue information.

Slide to set price

Headliner's core differentiator is the ticket bidding flow. The UI needs to show the overall bidding market and allow the user to easily place a bid. I landed on a slider because it felt ownably novel, was a fun interaction, and preserved the most amount of space to show the bid leaderboard.
Once the bid price was set, a user can add the bid to their cart and kick off the purchase flow. The whole interaction pattern is built around a set of bottom sheets to maintain context and generate an easy (gestural) back stack.

Search

Search is relatively self explanatory. The goal is to feel predictable/familiar, while offering helpful zero state suggestions.

The search query returns event pages, artists, and genre pages.
The empty state for search was filled with genre entry points. These entry points act as a catalyst to artist/concert discovery. They can also be found on the home feed.

We opted to compose the genre's with 3 emojis, it felt conversational and fun. I was concerned it would feel gimmicky, but I actually think it adds personality to the otherwise simple UI.

My tickets

This is where a user can access their purchased tickets, their active bids, and any of their old ticket stubs. The page is optimized for current tickets and ease of entry at events, which involved both designing the page layout and the digital tickets themselves.
Under the current tickets, a user can find their active bids. This lets the user see their bid price in comparison to the market and modify/cancel it if needed.

Settings

As you'd imagine, the settings page is where the user can manage all of their preferences. The main ask here was to modernize the UI for mobile and establish a bit of hierarchy, just to make the page easier to visually parse.

Onboarding

Onboarding is one of the last sprints I worked on with Headliner. Unless the project specifically calls for it, I usually tend to plan the onboarding work for the end of the design timeline. The reason for this is it benefits from the design revisions happening on the rest of the product. It allows me to approach the "intro" experience fully understanding the product that's being introduced.