← Our workCase studyCase studyClient: Suzannah James / X New Worlds
Case study

X New Worlds.

Portfolio site and private NDA viewing room for a London AI artist, with her Instagram feeding the CMS automatically.

Client
Suzannah James / X New Worlds
Deliverable
Portfolio site + private client area
Year
2024
Live site
xnewworlds.xyz ↗
X New Worlds homepage: a grid of AI artworks
Cue 01

The brief

Suzannah James makes AI and interactive art as X New Worlds, with work shown at the Saatchi Gallery, in Times Square and at the Busan Museum of Art. She needed a site that put the work first and brought in commercial enquiries, plus a private area where clients could see work still under NDA.

Cue 02

The approach

Suzannah came with the design largely worked out, so our job was to build it faithfully and make it easy to run. We built it on Next.js and Payload CMS, with a Three.js displacement effect on the homepage and GSAP for motion. The NDA portfolio sits behind its own login, so she can share a password instead of a folder of files.

Cue 03

The result

Launched in 2024. New Instagram posts reach the portfolio without her opening the CMS, so the site keeps pace with the work.

Three.js displacement on the homepage

Instagram to CMS, automatically

Cue 01

Zapier watches Instagram

Each new post is copied into Airtable as soon as it goes up.

Cue 02

Airtable holds the posts

Images and captions wait in Airtable, ready for the site to collect.

Cue 03

Middleware caches the calls

Airtable's free plan limits API usage, so we built a small service that caches its responses. The site asks the middleware instead of Airtable, so images aren't fetched fresh on every request.

Cue 04

Payload publishes

Posts arrive in Payload as portfolio entries and go live on the site.

Login screen for the private NDA portfolioFull-screen menu with About, Portfolio and Contact
Private NDA viewing room · full-screen menu
About page with biography and exhibition historyContact page with social links and email
About page with exhibition history · contact
Tech & tools
  • Next.js
  • Payload CMS
  • TypeScript
  • Three.js
  • GSAP
  • Airtable
  • Zapier
Next case studyFusion Glass →
View all work
Cue 04 — Get in touch

What’s slowing your team down?