Start a project
All work

Concept Branding studio · Rotterdam · 2026

Ninefold

A branding studio whose identities are built to survive the next post, because every post moves the whole grid.

Recorded from the live site at ninefold-studio-kappa.vercel.app

The brief

Every post you publish moves every other tile one place. Ninefold designs identities that still look right after it happens, and the site performs that shift everywhere you look.

Ninefold is a fictional branding studio in Rotterdam for restaurants, makers and shops whose first impression is a profile grid. Its visitors come from a link in bio, so they arrive on a phone, and the phone layout was designed first. The brief I set: show five clients as the feeds they live in, and prove the studio thinks about the grid harder than anyone.

Type
Concept, self-initiated
Role
Concept, Brand identity, Art direction, Web design, Development
Built with
Astro, GSAP, Lenis, Vercel
Typefaces
Switzer

How it was made

  1. The shift is the signature

    Posts land top left, every tile slides one cell, and the tile at the end of a row slips out and comes back one row down. Each client's grid rule, a checkerboard, a stripe, a diagonal, visibly survives it.

  2. One counter runs everything

    A single post count drives the hero feed, the four rule diagrams and the shift test on every case page. Scrolling publishes a post, and at rest one lands every 2.8 seconds, with a hairline counting down to it.

  3. The studio owns no colour

    Ninefold is grey and ink, the colour of a tile before its image loads. Each client brings its own palette and typeface, and the page transition borrows the colour of the client you open.

Ninefold: A layout that moves

Chapter 1 of 4

A layout that moves

Since January 2025 profile grids crop every tile to 3:4, and each new post pushes all the others one place along. A feed is a layout that rearranges itself every time it's used. The hero shows it happening: Kade's oyster bar feed posting live, with the post counter turning over.

Ninefold: Five feeds, five rules

Chapter 2 of 4

Five feeds, five rules

The work is an index of five clients, each set in its own typeface beside a small glyph of its grid rule. Pointing at a row makes its preview post once, so you see the rule hold before you even open the project.

Ninefold: The shift test

Chapter 3 of 4

The shift test

Every case page ends its story with a live grid that keeps posting as you scroll. Col, a cycling brand from Girona, puts a ride on every fourth post, so the yellow tiles draw a diagonal that slides down a row each time and never falls apart.

Ninefold: Four rules, and one to avoid

Chapter 4 of 4

Four rules, and one to avoid

The home page teaches the system in four small diagrams that shift along with the hero, plus the one trick the studio refuses: the nine tile puzzle, which looks wonderful once and is torn one post later.

Colour and type

The palette and typefaces Ninefold ships with.

Switzer

  • Ground#EFEFEF
  • Ink#0C0C0C
  • Muted#5C5C5C
  • Tile#E2E2E2

Up close

  • Ninefold, screen 1
  • Ninefold, screen 2
  • Ninefold, screen 3
  • Ninefold, screen 4

On the phone

Most visitors meet Ninefold on a phone, so the phone layout was designed, not squeezed.

  • Ninefold on a phone, screen 1
  • Ninefold on a phone, screen 2
  • Ninefold on a phone, screen 3
client identities, each with its own grid rule
5
tiles, the way profiles crop them since 2025
3:4
nine tile puzzles, because they break one post later
0

Want a site like this for your business?

Tell me what you do and who it is for. You get a free first call and a clear quote.

Start a project