Screen Shot 2017-08-23 at 10.16.32 PM.png

Brightline Ecommerce - Multi-Ride Products

About the Client:
Brightline, a start-up train service in Florida needed a digital presence, so we created one for them. We designed a fully responsive .com e-commerce site from scratch over a multi-year period that facilitated ticket purchases, ticket changes, user account access, multi-ride product purchasing and booking, and much more.

About the Project:
For this brief the objective was to design a page that would inform prospective customers about multi-ride train products, while allowing them to easily begin a purchase. Multi-ride products come in two flavors — Brightline passes that allow unlimited travel for a given period of time between two cities, and 10-Ride Packs, which offer the customer a lower price on a larger bundled purchase of tickets.

My Role:
As the lead UX designer on the project, I conducted research, gathered requirements and executed wireframes against client briefs working together with visual designer to keep within digital brand standards, and ensuring usability was retained into the design phase. Presented wireframes and designs to C-level clients and their 3rd party developer and worked together implement the designs.

Site launched early 2018.

Learn about Brightline

Multi-Ride Sales Flow

Multi-Ride Sales Flow

This page informs users about the features and benefits of both of our multi-ride products, passes and 10-ride packs. From here, they are able to begin the purchase flow for either passes or 10-ride packs.

Purchase a Pass

Purchase a Pass

The user has selected 'Buy Passes.'

Because passes are priced according to specified city-pairs of travel, the user must first select their route in order to see pricing and purchase.

 The user now sees prices for the route they have selected.  Prices are displayed for both levels of service,  Smart  and  Select .  The area on the bottom of the window instructs the user of the steps needed to proceed.

The user now sees prices for the route they have selected.

Prices are displayed for both levels of service, Smart and Select.

The area on the bottom of the window instructs the user of the steps needed to proceed.

 Once the user makes a selection of the level of service for the pass length they are interested in purchasing, a 'Confirm Purchase' section appears. This area shows the details of what product has been selected, and allows the user to select a quant

Once the user makes a selection of the level of service for the pass length they are interested in purchasing, a 'Confirm Purchase' section appears. This area shows the details of what product has been selected, and allows the user to select a quantity before proceeding to give payment.

Purchase 10-Ride Packs

Purchase 10-Ride Packs

Packs are displayed by route. Because service to/from the Miami station will be delayed, the goal is to communicate this to a user who is trying to buy a 10-ride pack in advance.

 Once the user makes a selection of the level of service for the route they are interested in purchasing, a 'Confirm Purchase' section appears. This area shows the details of what product has been selected, and allows the user to select a quantity be

Once the user makes a selection of the level of service for the route they are interested in purchasing, a 'Confirm Purchase' section appears. This area shows the details of what product has been selected, and allows the user to select a quantity before proceeding to give payment.

PassPack Screen 1.png
PassPack Purchase Pack.png
PassPack Purchase Pass.png