← Back to all work
Case study 04

TwitchCon

Twitch asked for basic wireframes. It became a UX engagement that reshaped how the site sells a weekend, welcomes newcomers, and stays editable right up to the day doors open.

Client
Twitch
My role
UX lead
Stakeholders
10–12 across Twitch
Delivered
Wireframes, IA, flows, components
The finished TwitchCon website

The problem

TwitchCon is the culmination of every Twitch event of the year, seen by millions. The brief was narrow — wireframes to guide development — but the real challenge underneath it was communication: showing new and returning visitors what they'd actually experience, beyond knowing their favourite streamers would be there.

That created a tension. Twitch wanted to sell full weekend passes as well as single-day tickets — which meant giving enough detail to justify a multi-day commitment, while keeping the site welcoming to someone attending their first digital entertainment expo. And the schedule wasn't finalised yet.

What I did

I designed a flow that earns the ask: hero introduction → what the experience actually is → regional detail → tickets. Visitors understand the value before they're asked to buy.

Without a schedule to point at, I made the weekend pass tangible another way — a prominent hero component above the fold, and a short animation on the nav ticket button revealing what the full pass includes: the parties, the exclusive content. Small moves aimed squarely at uncertainty.

I worked in low-fidelity greyscale deliberately. With 10–12 stakeholders across Twitch, greyscale kept every conversation on layout, hierarchy and information architecture instead of colour — and gave the development team a clean foundation to build against.

Accessibility was a principle, not a pass at the end: on-screen content — headings especially — is real HTML text rather than baked into video, so screen readers reach it (and search engines do too). For attendees on-site I designed a mobile schedule with filters for day, time and room, plus search, so nobody has to hunt for the thing they came for.

  • Low-fi greyscale wireframes
  • Conversion flow
  • Reusable component system
  • Accessibility-led
Wireframe alongside the finished TwitchCon page
Greyscale wireframe to shipped page — the structure survived intact.
Deliberate separation of content above and below the fold
The weekend pass earns the space above the fold; detail follows below it.

The outcome

A wireframing request became a system: components that hold up across cities and years, absorb A/B tests and last-minute streamer additions, and let Twitch's editors change the site themselves as the event approaches. On the Travel and Hotels page they could surface a new discount the moment it landed.

What impressed me most was how Vic navigated our complex stakeholder group of 10-12 people.

Cayvon Morady
Senior Technical Program Manager, Twitch