Professional WorkCase Study

AMP Ticket Add-On Flow

A production feature designed to improve add-on visibility, checkout usability, and user flow clarity within an existing ticketing ecosystem.

Full-Stack ApplicationsProductionReactTypeScriptTailwind CSS

Role

Sole Developer

Status

Production

Focus

Checkout UX + Feature Integration

Type

Professional Production Feature

Overview

What this project is

This project was a production feature built within an existing ticketing environment to improve how event add-ons were surfaced during the purchase experience. The work focused on usability, accessibility-conscious interface refinement, integration constraints, and feature implementation inside an established system.

Problem

Why this project exists

Add-on opportunities can be missed when they are not clearly surfaced in the purchasing flow. The goal of this work was to improve add-on visibility and usability without disrupting the surrounding ticketing experience or creating unnecessary friction for users.

Goals

Project goals

  • Improve visibility of add-on options during checkout
  • Integrate the feature cleanly into an existing ticketing environment
  • Preserve usability and accessibility while extending the flow
  • Support a production-ready implementation within platform constraints
  • Balance business goals with user clarity and checkout continuity

System

Feature integration flow

Because this was a feature integration rather than a standalone system, the architecture centered on extending an existing frontend flow while respecting current platform boundaries, dependencies, and user expectations.

User enters checkout flow

Add-on feature UI

Existing ticketing integration

Selection / state handling

Checkout continuation

Stack

Technology used

  • React
  • TypeScript
  • Tailwind CSS

Features

Key capabilities

  • Integrated add-on visibility within the purchase flow
  • Usability-focused frontend interaction patterns
  • Feature implementation inside an existing production ecosystem
  • Accessibility-conscious UI refinement
  • Improved alignment between business goals and user flow
  • State handling for add-on selection within the checkout experience

Technical Decisions

Important implementation choices

Why integrate instead of rebuilding

The existing ticketing environment already had production dependencies, so the feature had to extend current behavior without destabilizing the broader system.

Why TypeScript for the feature layer

TypeScript helped keep state and interaction behavior more predictable while integrating the feature into an existing frontend codebase.

Why UX clarity was central

Because the feature depended on visibility and decision-making within a purchase flow, interface clarity, placement, and user continuity mattered as much as implementation details.

Constraints

Challenges and limitations

Feature work inside an existing production system is constrained by upstream integrations, surrounding UX patterns, existing business rules, and the need to avoid regressions. This project required balancing product goals with system stability and user experience.

Outcome

What this project demonstrates

This work demonstrates production frontend development, feature integration within an established system, accessibility-conscious implementation, and thoughtful alignment between user flow, technical constraints, and organizational priorities.

Next Steps

Future improvements

  • Measure interaction performance and add-on engagement more deeply
  • Refine feature placement based on user behavior
  • Expand analytics around add-on selection patterns
  • Document implementation considerations for similar feature work
  • Use this case study to show how product clarity and system constraints shape implementation decisions