Start a Project
Home / Work / SupremeForged

Automotive & E-commerce · Fullerton, California

SupremeForged

Silver Porsche 911 GT3 in side profile

Context

Sector

Automotive / E-commerce

Scope

Storefront & Custom CMS Build

Year

2026

SupremeForged make forged wheels in Southern California, twenty series across Monoblock and 3-Piece configurations, every one built to order. The site had to do two jobs at once: sell a considered purchase to enthusiasts doing real research, and let one non-technical admin run the entire catalogue without ever opening a code editor.

There is no platform underneath this. No WordPress, no headless commerce backend, no site builder. PHP with no framework, a flat-file JSON data layer, vanilla JavaScript, and a hand-built design system. Every page is a real file. Every product URL is real and indexable.

The flat-file decision was deliberate rather than a compromise. Twenty series and a handful of admin users did not justify what a database costs in operational overhead: backups, migrations, hosting requirements. JSON that lives in version control and can be hand-edited in an emergency turned out to be exactly the right amount of infrastructure for the actual problem.

The data model went through one significant migration. Mono and 3-Piece originally shared a single set of fields per wheel, which fell apart the first time a wheel needed genuinely different pricing and photography per configuration. Splitting them into independent sub-objects meant writing a one-time migration tool that could preview the change before committing it. That pattern held for the rest of the build: no destructive data change without a dry run first.

Worth Noting

Visibility runs as a three-step hierarchy rather than a single draft flag. Published, then front page, then featured, each step dependent on the one before it in the data and disabled out of order in the interface rather than validated after the fact.

Wheels available in both configurations cross-link to each other, so nobody researching a Monoblock misses that a 3-Piece exists. Per-size pricing resolves automatically to a starting-from figure, and centre-lock pricing correctly reports a different number on Monoblock pages than elsewhere, pulled from one shared variable rather than hardcoded twice.

Every contact submission is written to a server-side record before the email send is attempted, so an API outage never means a lost enquiry.

Heading

#111111

Brand

#eb4f43

Brand Dark

#c43a2b

Subtle Box

#EFEFED

Page

#F4F3F1

In Image

In Motion

Deliverables

Store

Public Storefront

One real page per wheel per configuration, each with its own hero, spec grid, gallery and shareable URL. Catalogue pages, company, gallery, contact, open box and legal, all purpose-built rather than templated.

CMS

Custom Admin Panel

Six sections built from nothing. Dashboard, per-type wheel editors, a visibility grid, gallery curation, open box inventory and an enquiry inbox. Mobile-usable, dark-first, no platform underneath it.

System

Integrations & Tooling

Google Drive image import, Resend transactional email with server-side capture before send, Google Sheets bulk sync, and a price-prefill tool that fills blank fields from the real size-based pricing table without overwriting anything set by hand.

Typography

Aa

Mona Sans Wide

Display & Headlines

Weight 900 across headings, prices, product names and numbers. A forged wheel is a heavy object made to close tolerances, and the extended width carries that presence without decorating it.

ABCDEFGHIJKLMNOPQRSTUVWXYZ   0123456789

Aa

Helvetica Neue

Body & Interface

Everything below the headlines. Body copy, labels, buttons and form fields, chosen to stay legible through long spec tables and pricing breakdowns without competing with the display weight above it.

ABCDEFGHIJKLMNOPQRSTUVWXYZ   0123456789

Client Testimonial

"We can run the entire catalogue ourselves now. Pricing, photography, what shows on the front page, all of it, without waiting on anyone."
Eric Nareshni

Eric Nareshni

Owner, Supreme Power

Start a Project

Define the brief.

I need
Next →