- Owen Jones Team
Nike Skateboarding (Nike SB) has an online consumer shopping experience through Nike.com, a sizeable archive of skateboarding videos housed on a YouTube channel, and a short form storytelling channel with the Nike App, but no digital home that can flex to support all of the brand’s content, partner athletes and local retail partner stores. NikeSB.com was created to be the brand’s central digital content hub to serve and inspire the skateboarding community while providing the brand the flexibility it needed to accomplish its business goals. The inspiration was a wide collection of other brand websites doing interesting things promoting product, branded editorial content, or some mix of both.
Owen Jones’ initial moodboards and design explorations were intentionally pushed to every limit we could think of. It’s rare that you get to work with a client who asks, “Can we make this like 25% crazier?,” but that’s exactly how our relationship with NikeSB unfolded. We wanted to see how far we could test design sensibilities, knowing that we would have to build a flexible back-end CMS that would compliment it. In the end, we created a website that balances whimsy, fun and the need to serve targeted consumers with a mobile-first experience that consistently delivers fresh content.
After undertaking a comprehensive digital ecosystem discovery that included understanding Nike’s own internal systems, identifying Nike SB’s target audiences, Nike SB’s desired user journeys and outcomes for these audiences per acquisition channel, we landed on the technical solution to build the website using ReactJS powered by Craft CMS. Previously, we had built a few sites using a JS framework which utilized a static data set; but this was the first attempt to integrate React with a full-featured CMS. This meant creating a custom REST API to distribute the data to React and making smart decisions about caching, API segmentation, and React tooling to support site performance and SEO.
This project was built primarily with ReactJS and Craft CMS. Craft acts as a headless CMS and distributes content to React via a customized REST API. This API supports caching and proper segmentation for the CMS data and we’ve set up image optimization on the CMS side which allows us to serve the best image size for each user’s device. The React app uses a server-side rendering tool called Razzle and runs on a Node server maintained by PM2. We also created a custom Google Maps integration on the “Skateshops” page, which integrates with data from the CMS and makes use of several different Google APIs.
Immediately after being awarded the work, we collectively went through a discovery process with our client team that identified the key target audience profiles we wanted to reach and engage through the new Nike SB website, along with a consumer journey mapping exercise that showed how we were going to reach and serve these audiences the content they want to see, in the format they want to see it. By doing this, when we entered the design and build phase of the work we were able to balance our own creative ideas and technical capabilities with a fair representation of the client’s brand by always keeping who the website was for in the forefront of our decision-making.
Owen Jones knew when we started this journey with Nike SB that we had to deliver a website that balanced whimsy, fun and interactivity with the need to serve target consumers a mobile-first experience that keeps content fresh while delivering product, athlete and retail store information through an easy-to-navigate user experience. After going through our detailed strategy, design and development process that took things from wireframes to final product, we felt we were able exceed our own expectations by delivering a prescriptive but flexible front-end design system with a flexible and easy to author back-end CMS that supports most formats of branded content.
This was an exciting time to create a new digital experience for Nike SB in that the brand had been looking to fill its need for a comprehensive digital home for all of its content for a while before Owen Jones became involved. As a result of this pent up demand, once Owen Jones was awarded the project we were able to hit the ground running with the full support of the Nike SB team and Nike’s technical teams. As time went on with the project our two teams blended together so nicely that at times it was hard to recognize where the Owen Jones team stopped and the Nike SB team began.