Graphic Design

Gear In Action

Viget + Alchemy
Doug Avery
Chris Manning
Trevor Gavin
Nathan Henry
Dick’s Sporting Goods teamed up with Viget to create a site that would not only promote their 2014 Baseball Campaign, but would also serve as an enticing in-store display.
The Concept

The first challenge was to come up with at concept that could translate from a 3.5” iPhone to a 42” touchscreen display. The solution: an all-video interactive site that would let users enjoy a player's-eye-view of the game, and then explore and purchase the video’s featured products.

The Production

At the core of the site was full screen video footage that needed load fast and scale to a wide variety of sizes.

Using CSS transforms, Viget was able to not only scale videos but also set the origin property to always position the subject into view. All while whittling down the CSS files size to 12k.
For each position, at the play’s decisive moment, the video would slow down, and interactive “hot spots” would appear over the player’s gear. Clicking on a hot spot would pause the video and open a product view with a detailed description and a link to the main e-commerce site.
A menu screen would let users navigate between positions outside of the video loop.
Functionality on mobile was another challenge. Mobile phones can only play video in the device’s native player application, preventing the display of interactive hot spots. The solution was to design a separate interface for mobile that retained the spirit of the desktop concept.
For added cool factor Viget also developed a countdown timer that displays with a “flip-clock” effect all built in CSS, by 3D-translating four different number elements.
Final

With some creative thinking and innovate development techniques Viget was able to produce an engaging, responsive, and shoppable, site that can be experienced across a wide variety of platforms.<a href="www.dsg.com/baseball2014" target="_blank">

Video work by Alchemy
Client
Dick's Sporting Goods
Credits
Doug Avery Front-End Development Director
Chris Manning Front-End Developer
Trevor Gavin Alchemy Creative Director
Nathan Henry DP
Submit your work
Thanks!
We will contact you once your submission is approved.
Please allow 24hrs for your project to appear in the directory.
Have a Great Project you’d like to share?
See if you have what it takes to get through our nomination process but be prepared to back it up with some great behind the scenes materials.
Please attach jpg or png at 1280x1024
Upload
Sign Up
http://howww.com/profileagency/USERNAME
Minimum 6 characters
Already a member? Sign in
Sign In
Not a member? Sign up here
One click sign in if your account is connected to Facebook or LinkedIn
Forgot Password
Enter your email address below and we'll send you an email with instructions on how to reset your password.
Check your email!
We have sent an email to the address you provided. Follow the instructions in that email to reset your password. Thanks!