header background of Eastbay Performance Zone case study

Eastbay Performance Zone

Large Scale Touch Interface

Case Study

header background of Eastbay Performance Zone case study

Eastbay Performance Zone

Large Scale Touch Interface

Case Study

header background of Eastbay Performance Zone case study

Eastbay Performance Zone

Large Scale Touch Interface

Case Study

Brief

Eastbay and Champs Sports collaborated to create a stimulating space in select stores. This space would feature the highest quality athletic gear and a large interactive touch screen meant to promote sales and increase Eastbay brand and product awareness.

Our internal marketing team worked with an external development partner to create the interactive UI.

Despite a problem created by inconsistent product imagery, the brands were able to launch the Eastbay Performance Zone on time in various Champs Sports stores nationwide.

Regrettably, sales and performance metrics were not shared with our team.

goal

Design engaging large screen interface for customers to interact with in-store to learn about Eastbay products.

my role

Web Designer on Eastbay team

Problem

PDP hot spot template / inconsistent imagery

Part of this project involved adding “hot spots” to each product detail page that, when tapped, revealed technical copy for a specific feature of that product. Each product type would have its own “hot spot” template with a set number of potential locations for the copywriters to choose from and populate.

PDP hot spot template / inconsistent imagery

Part of this project involved adding “hot spots” to each product detail page that, when tapped, revealed technical copy for a specific feature of that product. Each product type would have its own “hot spot” template with a set number of potential locations for the copywriters to choose from and populate.

PDP hot spot template / inconsistent imagery

Part of this project involved adding “hot spots” to each product detail page that, when tapped, revealed technical copy for a specific feature of that product. Each product type would have its own “hot spot” template with a set number of potential locations for the copywriters to choose from and populate.

challenge

How do you create a “hot spot” template for a series of different sized and shaped products that is flexible enough to give the copy team enough potential options for each product and efficient enough to be quickly and easily built by the developers?

visual example of shoe with "hot spots"
visual example of shoe with "hot spots"
visual example of shoe with "hot spots"

solution

  1. Layer every product image at a very low opacity together to find the areas most likely to warrant a “hot spot” location for each product type.

  2. Work with copy team to define potential “hot spot” locations for each product type and way to organize “hot spot” locations and copy for individual products.

  3. Hand off “hot spot” templates, locations and copy to developers to be built per product type.

screenshot of layered shoe images with "hot spot" placements

The outcome

Our team ended up with a flexible system for setting up “hot spots” for each product that allowed the copywriters to create appropriate and engaging technical descriptions of the products and could be built with the least amount of busy work for the developers.

The Eastbay Performance Zone launched on time on various Champs Sports stores across the country.

reflection

My involvement with this project helped me really appreciate the value of communication and collaboration and striving towards the simplest solution possible. I was very thankful for the copy team finding the time to help me create our “hot spot” templates and I know the developers were thankful for us finding a solution that didn’t require them to build each individual “hot spot” for the 50+ featured products.

thank you!

I appreciate you taking the time to review this case study. I chose this example because I feel it demonstrates:

  • My ability to create creative and elegant solutions to technical problems

  • My ability to design beyond the typical screen size

  • My ability to effectively collaborate with both internal and external partners