New Ticketing and E-commerce Platform

California Academy of Sciences,
San Francisco

2019

When migrating to a new e-commerce platform we had an opportunity to rework information architecture, site UX, and visual language for web transactions. The goal was to make the broad product stack easier to navigate and focus the ticket buyer to the right products based on how many people are in their party and when they want to visit. Part of this project was also implementing dynamic pricing for ticketing.

Redesign of the industrial design innovation studio New Deal Design’s company web experience. As you scroll down the page photos transition from duotone to full color.

Updated User Flow

  • 1. Select ticket quantity

  • 2. Select type (daytime, night events, special events)

  • 2. Select type - expanded (daytime, night events, special events)

  • 3. Optional product upgrade

  • 4. Select date

  • 4. Select date continued. Indication of how busy the day is expected to be which impacted the ticket price.

  • 5. Add-on products

  • 6. Cart

  • 7. Confirmation. This includes all of the purchase information as well as ways to extend the museum experience.

Design includes advertising/promotional spaces for branded graphics

Error screen, while not part of the purchase flow these branded moments added humor to make stressful moments easier.

This ticketing platform also caters to different types of donors, one time donations, re-ocurring donor levels (like an expanded membership), and estate planning donations.

Membership purchase and upgrading page example. Includes expandable content and a link to a dynamic membership comparison chart.

An interactive slider created for a “pay what you can” day. This slider changed the prices of the tickets below and the text along the slider changes at price intervals. This was so successful that “pay what you can” days became a regular part of the events calendar.

As a later phase of this project we designed and implemented mobile ticketing via QR code. Previous version was a printable barcode.

Previous Website

  • Old Buy Tickets page

  • Old Ticketing page

  • Old Membership page

A mobile-friendly chart created to help visitors understand the differences between membership levels. Easy purchase buttons included in the chart.

GIF of the Hours and Admissions page as one of the entry points to the ticketing purchase flow.

The Team

Andrew Sawyer – UX, Visual Design & Strategy
Nick Colin – Content
Amie Wong – Project Lead and PM
Ashlei Temena – Web Development
Julia Dolgoszyja – Web Development
Greg Rotter – Web Development