Cinderbrook Studio
An award-nominated portfolio and CMS built for a boutique design agency.
Industry
Creative & Professional Services
Timeline
6 weeks
Team
2 engineers, 1 designer
Category
Web Platform
Where things stood
Cinderbrook's old portfolio site required a developer for every content update, which didn't fit an agency that changes its own showcased work every few weeks.
How we got there
Motion-first design system
Built a component library with the studio's signature motion language baked in, so new case studies inherit the same polish without custom animation work each time.
Self-serve CMS
Wired the CMS to match how the studio actually organizes projects, so publishing a new case study doesn't require translating their process into a generic template.
Performance budget
Held page weight and animation to a strict performance budget so the motion-heavy design doesn't come at the cost of load time.
What changed
2 yrs+
Site still self-managed with zero dev requests
Award-nominated
Design recognition post-launch
<1.5s
Largest Contentful Paint on the homepage
Tech stack
Next.js
Statically generates each case study page for fast loads despite the motion-heavy design.
Sanity CMS
Matches the studio's own project-organization structure instead of forcing a generic template.
Framer Motion
Powers the signature motion language every new case study inherits automatically.
Tailwind CSS
Keeps typography and spacing consistent across a design-forward, frequently-changing site.
TypeScript
Kept the CMS schema and animation components in sync as the site evolved.
Vercel
Deploys new case studies the moment the studio publishes them.
“We needed a CMS that let our team update the site as fast as we update our portfolio. Two years later it still holds up exactly like that.”
Elise Tran
Founder, Cinderbrook Studio
