8 hours
Catalogue Audit
Review the full project set, category logic, and browsing patterns before changing the portfolio system.
Project InventoryCategory RulesBrowse Intent Notes
Studio / Identity / 2026
The studio portfolio -- a living system that organizes twenty projects into a scannable showcase.
The Zera Portfolio aggregates the full project catalogue into a filterable masonry layout with scroll-driven reveals, category tabs, and deep-link case studies. It serves as both a client-facing proof surface and an internal project index.
Design process
24 hours
Index System
Design the masonry behavior, filtering rhythm, and project reveal logic for a portfolio that can keep scaling.
Masonry RulesFilter InteractionCase Study Entry Points
40 hours
Studio Polish
Refine responsive browsing, animation timing, and content hierarchy so the portfolio feels like a finished studio product.
Responsive MasonryReveal TimingNavigation Cleanup
Initial concepts
Early UI Concepts and Visual Explorations.
Challenge / response / impact
Twenty projects across six categories needed to feel organized without becoming a flat grid. The layout had to reward browsing while supporting direct navigation.
Response
We used a masonry system with aspect-ratio-aware tiles, sticky category tabs, and staggered scroll reveals so each project gets visual weight without crowding the page.
Impact
The portfolio gives the studio a polished project index that scales as new work ships, with clear paths from overview to deep case study.
Full frameInitial concept layout
Mobile responsive
Mobile frames keep the same tone, hierarchy, and conversion cues while tightening the page for swipe-first browsing.
01 / 16
