# Kiss Tony

> I turned our amateur CS2 team's shitpost-heavy branding into a live community site with browser games, recorded runs, persistent leaderboards and a working merchandise store.

- **Role:** Site Creator & Sole Developer
- **Category:** Personal project
- **Status:** Live
- **Human-readable case study:** https://lutherminshull.com/projects/kiss-tony

## Context

Kiss Tony is our amateur OCE Counter-Strike 2 team: a group of mates entering a league for fun and joke-posting on social media. The site takes that deliberately unserious brand further with browser games, persistent competition, tie-ins to what the team is doing and a merch shop for designs we cooked up together. Underneath the joke is far more engineering than the premise could ever justify.

## Luther's role

- Designed and built the complete product independently, including the interface, games, backend services, commerce integrations and production setup.
- Turned our shared jokes and team branding into interactive games, competition and a deeper home for the things we make together.
- Built the merchandise journey around designs the team created together, from product discovery and checkout through fulfilment updates and transactional communication.
- Continued to improve production behavior as game replays, leaderboard traffic and merchandise functionality expanded.

## What Luther built

- Several branded browser games, including reaction-time testing and a first-person aim trainer with flick and tracking scenarios.
- Clerk authentication and Convex-backed leaderboards, recent attempts, display names and synchronization of locally earned personal bests.
- Compressed replay capture with embedded three-dimensional playback for leaderboard and recent-score attempts.
- A Printful-backed catalogue with product and jersey pages, variants, image galleries, size guidance and a persistent cart.
- Stripe checkout, verified webhooks, Printful fulfilment, order-status handling and transactional email through Resend and React Email.
- Responsive and touch-friendly interactions, haptic feedback, route metadata, sitemap coverage and cached product delivery.

## How it works

- Next.js and React application combining ordinary product pages with React Three Fiber game loops and replay rendering.
- Convex data design separates replay payloads from frequently queried score metadata so leaderboard reads do not load full recordings.
- Game state spans anonymous local play and authenticated persistence without discarding a player's existing personal bests.
- Failure-aware Stripe webhook handling keeps payment and Printful fulfilment behavior recoverable when downstream order creation fails.
- Printful catalogue data is normalized into a custom storefront while Zustand maintains a resilient client-side cart.

## Outcomes

- Shipped and still operate a live home for the team, our jokes, community games and merchandise.
- Created game experiences that visitors can use without an account while giving returning players persistent scores and replayable attempts.
- Connected the public storefront to payment, fulfilment and customer communication rather than stopping at a catalogue prototype.

## Technologies

TypeScript, React, Next.js, React Three Fiber, Convex, Clerk, Stripe, Printful, Resend

## External link

- [Visit Kiss Tony](https://kisstony.com)

## Contact

- [Discuss an opportunity](https://cal.com/lutherminshull)
- [Email Luther](mailto:luther@lutherminshull.com)
- [Return to the portfolio overview](https://lutherminshull.com/index.md)

## Scope note

This case study covers Luther's own contribution and omits private repository data, credentials and private user information.