ESPN Body Issue

Impressive bodies of work

Every body has a story

We branded the 2017 edition of ESPN’s Body Issue, and designed its mobile-first online version.

In the Body Issue, published annually since 2008, ESPN matches up-and-coming athletes with photographers, producing some of the finest sports photography around. This year’s theme: Every body has a story.

For the 2017 edition, ESPN came to Ueno for the website design (UX/UI, prototyping, interaction, animation), as well as the overall overall branding for print and digital.

The project is notable for being decidedly mobile-first. For the previous edition, about 70% of users visited on mobile, so we did a bunch of stuff to make the mobile experience really stand out.

We began by doing the overall branding of the project, to be applied throughout, both in print and digital. After that had been approved, we moved on to the website, applying elements of the branding to the user interface.

A brand within the brand

Logomark, typefaces and colors

The diagonal lines in the Body Issue’s logomark are a reference to the tension and dynamism of athletes bodies in motion. It’s also a tip of the hat to ESPN’s own logo.

  • #e2e2e2
  • #a1a1a1
  • #414042
  • #ffffff
  • #f3f3f3
  • #fe0000

Variations on a theme

A logo for all contexts

The logotype is designed for use in both print and digital, with ten variations depending on context.

From print to digital

The interactive gallery

One of the challenges was to use technology to elevate the experience of print, improve on it, and make it more intriguing wherever possible.

Eye on the prize

Making the photography stand out

The Body Issue is full of spectacular athlete photos, and the mobile-first design allows for a lot of playful interactions with them. One of the challenges was to keep the branding present, but subtle enough to let the photography really stand out.

Show your moves

Tilt and zoom

An intuitive and non-invasive UI allows the photography to take center stage.

Larger than life

Making the photo look bigger than the screen

The photos are big, your phone screen is small. Users get the whole picture by tilting and moving their phones.

Touch and go

From mobile to desktop

The Body Issue is designed for touch, but also works on traditional screens. The desktop version comes with an indicator prompting users to move their mouse and bring the images to life.

The main idea behind the design was to give the Body Issue a solid identity and a really good user interface, but not something that would overwhelm the athlete photos. The interactions really played a crucial role in this

Marco CoppetoDesigner

Taking cover

A cross-media experience

Body Issue branding was designed for both digital and print.

Caroline Wozniacki cover
Michelle Waterson cover
Isiah Thomas cover
Joe Thornton & Brent Burns cover
Kirstie Ennis cover
Ezekiel Elliott cover
Julian Edelman cover
Javier Baez cover

We challenged ourselves to make an experience that would solve the limitation of displaying big imagery on small screens. This pushed away the obvious solutions and forced us to experiment more. Taking this challenge definitely lead us to a more unique end product.

Steffen ChristiansenCreative Director

The Ueno team seamlessly integrated into our existing ESPN team. With clear communication and thoughtful collaboration, they solved any problems we threw their way without ever breaking a sweat. The final presentation was above and beyond what we expected – providing our fans with an immersive, mobile-first visual experience.

Heather DonahueArt Director, ESPN

The bottom line

How did it go?

This project benefited from a really close relationship with the team from ESPN. With daily check-ins, design reviews every three days, and quick sign-offs on changes and updates, this was a real team effort.

Browse more projects

See all projects