Webflow dev
Nike animation & Webflow development
Tinker Hatfield is Nike's legendary footwear designer — the mind behind Air Jordan 3 through 15, the Air Max 1, and the self-lacing Nike Mag. The site tells his story through a long-form editorial experience.
My role
This was an educational project created under UPROCK design school, built for non-commercial purposes. The visual design was led by design director Evgeny Kuzmin and designer Lada Lavronova — my role was Webflow development, translating their concept into a fully functioning, animated website.
Development process
The site required several advanced Webflow techniques working together: scroll-triggered marquee animations for section headings, embedded video with custom interaction triggers, a chronological timeline with scroll-based reveals, and page transitions between sections. My prior knowledge of HTML and CSS was key to structuring the build — understanding how Webflow maps to the DOM helped me keep the hierarchy clean and maintainable as the project grew in complexity.
I designed a set of custom icons for the project, drawing on the Nike logo's combination of sharp edges and fluid curves. Working in Figma, I balanced angular and rounded forms until the icon set felt consistent with the site's overall aesthetic — functional, but with a distinct visual character.
Reflections and learnings
The finished site was featured on UPROCK's Webflow course page as a student success story. Beyond the technical skills gained, this project reinforced how much a strong visual design brief clarifies development decisions — working from Lada and Evgeny's direction made it easier to make confident choices about structure, animation timing, and hierarchy throughout the build.
