Arc'teryx cover

Goal

Recreate two pages of an existing website while taking on surface level layout and design challenges. The goal is to strengthen coding skills by focusing on structure and styling, while learning how to translate a visual design into clean, functional code in an engaging and hands on way.

Improved on

  • HTML
  • CSS
  • JavaScript

Why Arc'teryx

  • The animation on the gear guide that slides in while you’re scrolling was grabbing my attention and I really wanted to recreate it
  • Jacket finder was something I wanted working but I wasn’t able to figure it out in the given time

My surface plane challenges

  • Scroll animations
  • Dark/Light mode
  • Extra micro interactions
  • “Advanced” positioning: Sticky, fixed and Z-index
  • Video’s
Arc'teryx screens
Scroll to Top