Marcus Eriksson has shot campaigns for Nike, Meta, Lululemon, Calvin Klein, Beats by Dre, Smartwater, Xfinity, and 24 Hour Fitness. His subjects include LeBron James, Serena Williams, Keanu Reeves, Michael Jordan, Damian Lillard, and Breanna Stewart. The portfolio site needed to carry that weight. Not just display the work, but match its production quality.

I designed and developed the entire site in Webflow, from layout and interaction design to responsive implementation and performance optimization.

The homepage opens with a full-screen image grid. No intro text, no logo animation, no "welcome to my portfolio" moment. The photography hits immediately. Each project tile is a full-bleed image with hover-activated project names that appear on interaction. The grid scrolls smoothly, and the images load progressively so the experience stays fast even with 50+ high-resolution projects.

This was a deliberate design choice. When the work is this strong, the best thing the site can do is disappear behind it.

Below the grid, a numbered project index presents all 50 projects as large-scale animated typography. Each entry triggers on scroll with staggered text reveals and parallax transitions. The numbers count from 01 to 50, and each title animates into view as the visitor scrolls.

This dual navigation system (image grid + numbered index) gives two completely different browsing experiences on the same page. Visual browsers scan the grid. Detail-oriented visitors scroll the index. Both paths lead to the same project pages.

Custom cursor states change based on context. Hover animations on project tiles reveal names with smooth opacity transitions. Scroll-triggered reveals stagger content into view with precise timing. Page transitions between sections feel fluid, not jarring.

The micro-interactions aren't decorative. They guide attention, signal interactivity, and create a sense of craft that matches the photography itself.

50+ high-resolution photography projects on a single page is a performance problem. Every image is large, every project needs to load fast, and the animations can't stutter on mid-range devices. The solution was a combination of lazy loading, responsive image sizing, CDN-optimized asset delivery, and careful animation sequencing that defers non-visible elements.

The dark cinematic aesthetic also required precise color management. The background needed to be dark enough to let the photography pop, but not so dark that it crushed shadow detail in the images. Every spacing decision, every font size, every animation timing was calibrated to keep the photography as the focal point.

Platform: Webflow (fully custom design and development)

Animations: GSAP + Webflow Interactions for scroll-triggered reveals, parallax, hover states, and page transitions

Performance: Lazy loading, responsive images, CDN-optimized delivery

Typography: Custom type hierarchy with large-scale display text for the numbered index

Navigation: Dual browsing modes (image grid + numbered index) with smooth scroll

A portfolio site that creative directors and brand teams visit and remember. The dual navigation, the animation quality, and the performance under 50+ high-res images make it feel like a production piece, not a template. Which is exactly what it needed to be.