Background: Vans Old Skools were created in 1977 and have historically been known as a shoe for skaters. I wanted to create a product breakdown site that shows the more colorful side of Old Skools, showing that they are shoes for anyone and everyone. Inspired by the colors of the 1970s and 1980s, I developed a site detailing what makes Old Skools unique and immediately recognizable. The squares and negative space in the images throughout the site are a nod to Vans' iconic checkerboard pattern. The site is fully coded with HTML5 and CSS.
Challenges: The biggest challenge that I faced during this project was coding a site where the text for each section was always in a different area of the page. The project taught me a lot about negative margins and how, for more complicated sites, HTML5 can be a bit tricky. Each photo on the page was also taken with the model wearing white Vans, so having to edit the shoes to match the color scheme was challenging and definitely helped me to improve my photo editing skills.
Results: The final result ended up being a product breakdown page for Vans Old Skools that emphasized its audience inclusivity. The site explains what Old Skools are and gives a brief history on how the shoes came about. Multiple times throughout the site, the user is encouraged to link out to Vans' site to purchase Old Skools. 
Final wireframe
Initial design sketches
Final design mockup
View the prototype for the product breakdown of Vans Old Skools here.
Video of final site
Back to Top