ASA Photographic

A Boston-area theatre photographer's site, with a gallery page for every school and company it shoots, plus event and drone work.

What they came with

A show closes on the Saturday and by Monday a few hundred families want the pictures. Each school and theatre company needs its own front door, with its own crest, its own current production and its own order code, and none of them should have to pick their way through anyone else's. The same studio also shoots corporate events, flies a drone and runs a portrait brand on a second domain. The site had to route all of that without making a parent read a services page first.

What the build had to do

A page per organisation

Theatre Galleries is a grid of client crests on black, each one opening a page named for that company. The line above it tells the visitor to click their own organisation's logo, so the grid has to be scannable by someone who knows one crest and none of the others.

Order codes that live on-page

Each organisation page carries its own discount codes and expiry dates, with a second tier for thumb drives and custom products. This is the copy that changes every production cycle, so it sits where the photographer edits it directly rather than behind a settings screen.

Current show and the archive

Every organisation page offers two routes, the current production and the past shows, each pointing at its own gallery. A family arriving late in the season lands on the right set instead of a general portfolio they have to search.

One menu across two brands

The services menu holds theatre, events and drone in-house and sends family, senior and headshot portraits to the sister portrait studio on lucozziportraits.com. The visitor moves between two domains without being asked to understand that there are two.

Long galleries on a dark ground

Theatre and drone run masonry Pro Gallery layouts that continue well past a screenful, each frame carrying a copyright line. Stage photography is mostly dark, so the grid had to hold separation between frames at full width and still stack sensibly on a phone.

Technical detail

Server-rendered Wix, then hydrated

HTML arrives server-rendered from the edge, cached at Fastly and hydrated by Thunderbolt on the client. The theatre page runs many screens deep at 1440 wide, so the first paint has to carry the hero and the copy while the gallery fills in behind it under lazy loading.

The commerce boundary is Zenfolio

No print order is handled on the site. Each organisation page hands off to a Zenfolio gallery identifier on asaphotographic.zenfolio.com, so pricing, fulfilment and payment stay in the lab's system while the site owns discovery and routing. The one thing that can break is a gallery identifier that moves, and that is a single-page edit rather than a schema change.

Routes instead of collection rows

Organisation pages are separate routes in the sitemap rather than rows in one collection. That keeps every show's copy, codes and links independent, so a change made mid-season for one school cannot reach another, and each page is editable without a build. The trade is that the shared furniture, header, footer and cross-sell blocks, is repeated per route.