raw.vives turns a photography collection into a static editorial product. The home shapes the narrative, the archive makes images discoverable, and series preserve continuity across real, directly accessible URLs.
Photographs felt isolated, repeated, and entered with an overly uniform visual treatment. The challenge was to give each image a purpose and create continuity without turning the site into an effects demo.
Goals
Curate and prioritize the journey
Connect archive, details, and series
Preserve performance, keyboard access, and reduced motion
My role
Product and visual direction, frontend architecture, content modelling, curation, motion, accessibility, localized SEO, tests, and continuous delivery.
A black-and-ivory editorial direction lets photography become the interface. Curation gives hero, story, chapters, and selected work distinct roles; a limited grammar of masks, soft scale, and contextual transitions adds rhythm without hiding content.
02
Architecture and exploration
Next.js App Router generates localized static routes. Central data resolves photographs, series, and navigation; the archive combines search, categories, and editorial order; details preserve fullscreen, previous/next, and ?series= context with a global fallback.
03
Photography series
Three manual sequences group authentic relationships or documented editorial affinities. Every photograph keeps its own detail page and, when opened from a series, previous, next, and return follow that order.
04
CI/CD and Cloudflare
GitHub Actions validates types, lint, 67 tests, build, and export before deploying the static site to Cloudflare Workers with a token limited to the Worker and its route.
Published product
One system, different ways to explore.
01 / Editorial home
02 / Series page
03 / Archive and filters
04 / Detail with series context
05 / Fullscreen view
Accessibility, performance, and SEO
Content remains visible without animation
Keyboard, focus, localized alt text, and reduced motion
Responsive images, lazy loading, and reserved dimensions
Canonical, hreflang, Open Graph, and localized sitemap
Challenges, decisions, and trade-offs
The work prioritised verifiable photographic relationships, one central configuration per system, and progressive enhancement. Carousels, horizontal scrolling, new shaders, and per-card effects were rejected to protect clarity, memory, and navigation restoration.
Measured results
Verifiable results, without decorative metrics.
The validated result contains 30 photographs, 3 editorial series, 73 static routes, and 67 tests. No unmeasured traffic, conversion, or feedback claims are included.
Learnings
01Curation creates more continuity than adding content
02Motion works better as a grammar than a collection of effects
03Contextual navigation needs a stable direct-access fallback
Next case
LumaFlow Studio
A full-stack product for organising professional photography work.