Project: Masonry (Personal Project) Type: CMS-Driven Image Gallery Platform: Framer Role: Design & Development

Build a dynamic image gallery to explore Framer's masonry grid feature. The goal: a visually rich layout where all content is CMS-managed, not hardcoded.

Static image grids are easy. The real test is making a masonry layout that's both visually interesting and fully editable through the CMS—so content can scale without redesigning.

Dark theme with warm, amber-toned imagery. The almost black background lets the photographs command attention while the masonry rhythm creates movement and variety.

Built in Framer with:

Native masonry grid layout

CMS collection for all images

Scroll-triggered appear animations

Responsive across all breakpoints

To speed up CMS population, I built a custom tool: drag a folder of images into a Lovable app, auto-upload to Supabase storage, format links in Google Sheets, sync directly to Framer CMS. No manual entry.

Fully dynamic—swap images without touching the design

Scalable content pipeline

Smooth scroll animations

Responsive at every breakpoint

Framer CMS implementation

Masonry grid layouts

Scroll animations

Custom tooling for content workflows

Tools: Framer, Lovable, Supabase, Google Sheets Live Site: