Bureau of Innovation
A digital gallery for bespoke designer furniture, lighting, and art objects. Editorial collections, designer features, rotating curations and exhibitions, and BOI's own limited editions, built to feel like a gallery rather than a store.
Collections by category
Gallery-grade experience
High-fidelity image delivery
Project Snapshot.
The essential facts. Sector, timeline, surface area, and where it lives in production.
Brief, Build, and Outcome.
The Challenge
Bureau of Innovation represents bespoke designers. Furniture, lighting, storage, art objects. And the work is the entire point. They needed a digital home that felt like walking into a gallery, not scrolling a catalog. Most e-commerce templates flatten beautiful, large-format photography into a product grid and bury the curatorial voice. BOI needed editorial layouts, designer spotlights, rotating curations and exhibitions, and a way to publish their own limited editions. All while serving heavy, high-resolution imagery without making visitors wait.
Our Approach
We designed the experience in Figma first, in strict black and white, then built it on Next.js with an AWS S3-backed image pipeline so the photography could stay large and sharp without dragging the page down. Everything is content-managed, so the team can publish a new designer, collection, or exhibition without an engineer in the room.
The Outcome
Bureau of Innovation is deployed and live, presenting curated collections, featured designers like Corpus Studio, and a rotating curations-and-exhibitions surface inside a single editorial platform. With the team adding designers, pieces, and shows themselves as the gallery grows.
What changed.
A side-by-side of what the client had before we engaged, and what we shipped.
- Galleries like this usually live on Instagram, where a museum-grade piece scrolls past between a reel and an ad
- Lookbooks went out as PDFs that nobody opened twice and search engines never saw
- When there was a site, it was a generic store template that treated a sculptural chair like a SKU
- High-resolution photography got crushed by platform compression. The grain of the marble gone before anyone saw it
- Designers were credited in a caption, if at all, never given a page of their own
- Exhibitions and curations had no home online. They happened, then disappeared
- Limited editions sat in the same grid as everything else, indistinguishable from stock
- A gallery-grade site where the work is framed, not listed. Whitespace doing the job a frame does on a wall
- Server-rendered pages so a collector searching for a designer or a piece can actually find BOI on Google
- Editorial layouts built for the photography first; the catalog logic lives underneath, out of sight
- Large-format imagery preserved at high fidelity and served fast from S3
- Every featured designer gets a real spotlight. Bio, practice, and their pieces in one place
- A Curations & Exhibitions surface where shows can be staged, dated, and rotated like a real program
- BOI Editions as its own destination, so the gallery's published work reads as the statement it is
Achievements & deliverables.
Most furniture sites are catalogs that happen to be online. We built Bureau of Innovation as a gallery that happens to be a website, where the photography is the architecture and the navigation gets out of its way.
Editorial design system
A restrained black-and-white visual language designed in Figma. Generous whitespace, a fixed left-rail wordmark and navigation, and layouts that frame the work like a gallery wall.
Collections by category
Seating, Tables, Lighting, Storage, and Art Objects. Each a browsable collection with large-format imagery and room to breathe.
Designer features
"Designer to Know" spotlights, like Paris-based Corpus Studio, pairing studio bios with their pieces so the people behind the work stay visible.
Curations & Exhibitions
A surface for time-based, gallery-style shows so curations and exhibitions can be staged, dated, and rotated without a redesign.
BOI Editions
A dedicated home for the gallery's own published, limited editions. First-class content, not a footnote in a generic store.
AWS S3 image pipeline
Large, high-resolution photography served from S3 with optimized delivery, so the work stays sharp and the pages stay fast.
How We Built It, Phase by Phase.
Every project follows a deliberate sequence. Discovery, design, foundation, build, and launch. Here is exactly what happened, and what was delivered at each step.
Reading the Room
Before any design, we worked out what kind of place this had to feel like. A gallery, not a shop. That one decision drove everything: the threshold splash, the restraint, the refusal to slap a "Buy Now" button under a piece that costs more than a car. We mapped the content the gallery actually had. Designers, collections, curations, editions. Into a model the site could grow into.
- Content model. Designer, collection, curation, edition
- Information architecture for the left-rail navigation
- Reference board of galleries, not e-commerce sites
- A roadmap framed around the program, not features
Black, White, and a Lot of Space
The design phase was mostly subtraction. A serif wordmark, a quiet left rail, and photography given room to dominate. We tested the layouts against the worst case and the best case. A tiny art object and a wall-filling sofa. To make sure the grid held either way.
- Figma design system, strict black and white
- Collection, designer, and exhibition templates
- Type and spacing scale tuned for editorial reading
- Motion notes. Slow, deliberate, never bouncy
Next.js + the Image Problem
The hard engineering problem in a gallery site is always the images. They're enormous and they're the point. We built on Next.js and wired an AWS S3 pipeline so large-format photography stays sharp but never blocks the page, with responsive variants and lazy loading doing the quiet work.
- Next.js app with server-rendered collection and designer pages
- AWS S3 storage with optimized, responsive image delivery
- Lazy loading with placeholders for image-heavy grids
- Base UI built from the design system
Collections, Designers, Curations
We built the surfaces that make it a gallery: collections by category, designer features, and the curations-and-exhibitions program. Each is content-managed, so staging a new show or adding a designer is the team's job, not a deploy.
- Collections by category (Seating, Tables, Lighting, Storage, Art Objects)
- Designer feature pages with bios and works
- Curations & Exhibitions surface with dated shows
- BOI Editions destination
The Threshold and the Polish
We added the splash entry last, once the rest earned it. A quiet threshold that sets the tone before the first scroll. Then a performance and accessibility pass, because a gallery that loads slowly stops feeling expensive.
- Threshold splash entry
- Performance pass on image-heavy pages
- Accessibility review (contrast, keyboard, alt text)
- Newsletter + Instagram integration
Inside Each Feature We Built.
Not just what we shipped. How it works under the hood, and the engineering decisions behind each piece.
The Threshold
Most sites drop you straight into the storefront. BOI opens with a quiet splash and a single ENTER. A threshold that tells you this is a gallery before you've seen a single piece. It sounds small. It changes how everything after it reads.
- A deliberate splash entry to /home, set apart from the main experience
- Kept featherweight so it never delays the real content behind it
- Brand wordmark and a single call to enter. No clutter, no nav
- Sets the editorial tone the rest of the site cashes in on
Collections, Framed Not Listed
Seating, Tables, Lighting, Storage, Art Objects. Each collection is a browsable wall of large-format photography, sized and spaced so a sculptural chair never reads like a SKU in a grid.
- Five category collections, each its own surface
- Large-format imagery with generous, gallery-style spacing
- Responsive layouts that hold for both tiny objects and wall-filling pieces
- Server-rendered so each collection is independently discoverable
Designer to Know
The people behind the work get their own spotlight. Corpus Studio, the Paris practice behind the BB Chair, is presented with its story and its pieces in one place. Not credited in a caption and forgotten.
- Designer as a first-class content type with bio and linked works
- Feature layout pairing narrative with the studio's pieces
- Reusable template so a new designer is a content entry, not a build
- Cross-linked to the collections their work appears in
Curations & Exhibitions
A gallery runs a program. Shows that open, run, and close. We built a surface where curations and exhibitions can be staged, dated, and rotated, so the site reflects what's on now instead of freezing at launch.
- Time-based exhibition entries with dates and locations
- Editable and rotatable without a redesign or a deploy
- Designed to sit alongside the permanent collections, not compete with them
- Room for both physical shows and online-only curations
BOI Editions
The gallery publishes its own limited editions, and those deserved more than a row in a product grid. Editions get a dedicated destination that reads like a statement of what BOI itself stands for.
- Editions modeled as their own content type, separate from represented work
- A dedicated surface rather than a filter on a generic store
- Designed to carry the gallery's voice, not just list inventory
- Extensible as the editions program grows
Heavy Images, Fast Pages
A gallery site is only as good as its photography, and great photography is heavy. We leaned on AWS S3 and a responsive image pipeline so the work stays sharp at full size while the pages stay quick.
- Originals stored in S3; optimized, responsive variants served to the page
- Lazy loading with placeholders so long collection pages never stall
- Image sizes tuned per surface. Thumbnail, collection, feature
- Performance budget held even on the most image-dense pages
Every Tool, and Why We Picked It.
A grouped breakdown of every technology in the build, with the reasoning behind each choice.
Frontend
- Next.js
Server-rendered collection and designer pages so the gallery's work is discoverable on Google, not locked behind client-side rendering.
- TypeScript
Designer, collection, curation, and edition content are all typed against their templates. A malformed entry doesn't compile, let alone publish.
- Tailwind CSS
The design lives or dies on consistent spacing. Utility classes made the generous, editorial whitespace easy to enforce on every page.
Media & Infrastructure
- AWS S3
The photography is the product. S3 holds the large originals and serves optimized, responsive variants so pages stay sharp and fast.
- Responsive image pipeline
Each image ships in the smallest variant that still looks gallery-grade, lazy-loaded so a long collection page doesn't stall.
Content
- Headless CMS
Designers, collections, curations, and editions are all editable by the team. Staging a new exhibition is content work, not an engineering ticket.
- Curated content models
Each content type. Designer, collection, edition, exhibition. Is first-class, so nothing important has to masquerade as a generic "product".
Design
- Figma
Designed in strict black and white before a line of UI. The restraint was the hard part, and it was settled in the file, not in code.
