The idea started with a hub that we’ve created for Adidas within the Snipes online environment. In this hub, Adidas is able to show all of their campaigns on a single page with each campaign having its own look and feel. As campaigns will change on a regular basis, it should be easy to add, remove and edit content without having to make too many concessions in design.

Our biggest challenge was to create a solid framework with enough options and variety for displaying and modifying content and animations without limiting design too much. Another challenge was making the hubs part of the snipes.com environment. This meant embedding them into Snipes’ structure and code, which made the operation more difficult.

We’ve created a data structure that handles all of the sections visible on the hub. This data structure can be edited through a simple content management system making it easy to add, remove and edit content.

Each section within the data structure has a few options that will determine which elements will be visible, what interactions are enabled and how the section should look for visitors. For example, each section has its own ‘theme’ property which handles the colors for the titles, background and user interface elements. Another option is to add multiple background elements and animation speeds to create parallax for each section making the content more immersive.

Furthermore, the first section visible on the page automatically displays the ‘hero’ of the specific campaign, making it stand out with a larger header image and separate animation possibilities.

After the initial hub was created, the client decided to add this hub structure for multiple brands and expand the functionalities. This makes it easier for each brand to create a bespoke look and feel within the Snipes domain. We’ve created the hubs for Adidas, Snipes Exclusives, Karl Kani and Sean John, with each brand having a bespoke site intro and header animation.