E-Commerce Experience
Associate Creative Director
End-to-end purchase journey — responsive web
Overview
I led UI and product design alongside the UX and strategy teams across all five steps and the confirmation page. That covered the core screens plus the modals, cart views, takeovers, and entry screens that support each step, and keeping design aligned with product, development, and Brightspeed stakeholders as requirements changed.
Every screen is built from one shared foundation. Steppers, plan cards, offer tags, toggles, and the persistent cart are reused throughout the flow, so it stays consistent and each new screen is faster to design and build.
Step 1
Step 1 · Selecting Your Speed
Compare at a glance. Every plan card puts speed, price, router, and key benefits in the same place, so customers can scan across tiers without hunting. Filter tabs for Popular, Gig+, and All plans narrow the options fast.
Clear pricing, upfront. Promotional pricing, prepaid card offers, and Autopay requirements sit right on the card, with terms and broadband facts one click away. Nothing about the price is hidden until later.
Built for every screen. On smaller viewports, the plan cards become a swipeable carousel with speed tabs, so the comparison still works on a small screen.
Steps 2–3
Customizing Your Plan
Show the value before the upsell. WiFi Enhancements opens with the premium router every plan already includes, then offers Whole Home WiFi and WiFi Protection as optional upgrades. Customers see what they’re getting before they’re asked to add more.
Simple toggles, honest offers. Customize Your Package uses the same card and toggle pattern for Digital Voice and Total Home Tech Support. Offer tags like “First month free” stay consistent, and the terms sit right next to each product.
A cart that’s always there. A persistent cart shows the running total and promo code field throughout, so the price never comes as a surprise at checkout.
Steps 4–5
Installation & Checkout
A clear choice for installation. Customers pick between free self-install and a scheduled technician visit, laid out side by side with the cost and benefits of each. On mobile, the two options become a simple toggle.
Simple, secure payment. Payment comes down to one choice between card and PayPal. The same method covers future monthly bills, and the subscriber agreement is confirmed before customers continue.
No surprises at review. The order review separates recurring monthly charges from the first bill, showing every included item, discount, and credit line by line, down to the final total due.
Order Complete
Order Complete
A confident finish. The confirmation page gives customers their order number, a step-by-step timeline of what happens next, and a clear prompt to set up their account and unlock the Autopay discount.
Consistent at every step. Modals, cart views, takeovers, and entry screens use the same components as the main flow, so customers can dig deeper without losing their place.
Order Complete
Designed for the device customers actually have. Most first-time Brightspeed customers don’t have home internet yet. They sign up on their phone, relying on their mobile plan until their service is activated. So the full purchase journey was designed mobile-first, from choosing an installation method and adding services like Total Home Tech Support to the final confirmation. Plan cards, add-ons, and the persistent cart adapt to smaller screens without losing the details customers need to decide.
Guidance without pressure. Clear tags like Recommended and Most popular point customers toward the best fit, while every alternative stays one tap away, keeping decisions quick and transparent on any screen.
Outcome
A cohesive end-to-end experience. The redesigned flow took customers from plan selection through confirmation, contributing to a 77% checkout rate and 2X year-over-year fiber growth.
Simpler decisions at every step. Clear visual hierarchy, mobile-first interactions, and responsive layouts made complex product and service choices easier on every screen.
A foundation that lasted. Shared UI patterns kept the flow consistent with Brightspeed’s design system, and the web foundation behind it is still the one Brightspeed’s teams use today.
More Projects
Follow me
All rights reserved | ©2012–2026 | Michael Miller
