Isi Lens

Isi Lens is the portfolio of a London photographer. Each shoot is a 3D gallery you walk through1. I designed and built the site and its brand.

Role: Designer and developer, through HTA Studio
Built: 2026
Stack: Next.js 16, TypeScript, react-three-fiber, Sanity, Resend, Tailwind CSS

What it does

3D galleries: Each collection is a room you walk through. You drag to look around, walk forward, and click a photo to read its plaque.2
A grid when 3D can't run: Phones and browsers without 3D get a clean grid of the same photos, with a short note.3
Her own editor: She adds shoots, drags them into order and picks a dark or white room for each one. New work shows on the site within a minute, with no developer.4
Booking enquiries: The contact form sends each enquiry from the site's server to her inbox. Her reply goes straight to the client.5
A business card page: One link to save her contact, or reach her by phone, WhatsApp, email, Instagram or TikTok.6

The Jersey August 2026 collection as a 3D gallery: a white room with framed photos of Jersey along both walls, a spotlight above each one and benches down the middle. — **A. The 3D gallery.** Jersey August 2026, in the white room. From the live site.

The same collection as a grid of photos, under a note that the 3D room can't start because graphics acceleration is turned off, with the steps to turn it on. — **B. The grid.** The same collection with 3D switched off. From the live site.

Isi Lens Studio. On the left, the collections in their order, each with a drag handle. On the right, the Jersey August 2026 collection with its category, a choice of Dark room or White cube for its 3D gallery, and the first of its photographs. — **C. Her editor.** Collections in order, and a room picked for each one. Sanity Studio.

How it is built

The site is Next.js 16 and TypeScript. Her work lives in Sanity, and the pages refresh from it every minute, so new work needs no deploy. The rooms are drawn in 3D with react-three-fiber. Enquiries are sent with Resend.

Every photo comes from Sanity's image service, never more than 1,800 pixels wide7. The full-size originals, up to 6,048 pixels wide, never reach a visitor.

Every page passes the WCAG AA contrast check8. I also check by hand what the automated check can't see: text over photos and inside the 3D room.

Security and checks

Pages load only what they should: A content security policy allows the site itself and Sanity's image service, nothing else. Camera, microphone, location, payment and USB are switched off.9
No other site can frame it: Framing is blocked on every page, so no one can wrap the site inside another to trick visitors.
The editor is kept apart: It needs looser rules than the public pages, so it has its own policy.
Bots and floods are stopped: The contact form traps bots and limits how often one visitor can send.
Every push is checked: GitHub Actions runs the type check, lint, 12 unit tests, the build and 4 browser tests. The browser tests open real pages and fail on any page error or blocked resource.

See how it is built, on a call

The site is live, and the code is private. On a call I can show you how it is built: the 3D gallery, the editor and the checks.

Ask how it is built Open isilens.co.uk