Ember & Loom Studio
Editorial-style portfolio for a photography and art direction studio, built for large imagery, flexible case studies, and CMS editing.
Project snapshot
Cinematic portfolio with full-bleed imagery and modular case studies.
Built with Next.js + Sanity, this CMS-driven editorial layout blends flexible case-study structures, full-bleed galleries, and soft motion to elevate creative work.
Overview
Ember & Loom Studio is a fictional photography and art direction studio. The goal of the site was to build a cinematic portfolio that highlights imagery while giving the studio a CMS-powered way to author rich case studies.
Challenge
Creative studios need layouts that feel spacious and editorial without becoming confusing or slow. The challenge was to structure large visuals, project details, and behind-the-scenes narratives into a system that stays consistent but never feels repetitive.
Approach
I designed a modular project template using Sanity CMS. Each case study is assembled from reusable sections—problem, direction, process, outcome—so the studio can publish new work without touching code. Motion is used sparingly to support the narrative rather than distract from it.
UX & UI Design
The homepage acts as a curated gallery, with large thumbnails and a minimal navigation. Project pages mix full-bleed images, two-column grids, and floating captions to create rhythm. Supporting pages like About and Contact emphasize warmth, credibility, and ease of inquiry.
Engineering
The portfolio is implemented with the Next.js App Router and Sanity for content. Dynamic routes render projects based on slugs from the CMS. Framer Motion provides smooth page transitions and scroll-based fades, while responsive images keep the site performant even with large photography.
Outcome
The final experience is an editorial-style portfolio that feels bespoke but is easy to maintain. It showcases SmalCoda’s ability to design visual-first experiences that still perform well and are backed by a robust content model.