EASports.com homepage

The start of the video is simply the logo animation with no links. The links and a gradient background come in once the logo has cleared and then the rest of the interactions are activated.

The start of a match in the homepage video on easports.com

Here you can see Rory winding up to take his swing. This is part of the homepage video on easports.com.

With Odell Beckham Jr winning the cover for Madden 16 he takes his place as the overtaking image for that game. I really wanted it to be Gronk.

When you hover on a specific game you get an overlay of a key piece of art. In this case it was the cover art for the new Rory McIlroy PGA TOUR game due out in July 2015.

Here in the closing shot of the easports.com homepage video you see Russel Wilson raising his arms in triumph

Client: EA Sports

Date: May 19, 2015

Categories: Electronic Arts / JS

For this project I was given the art and UX and needed to take that and create the visual representation on the page that would be used for the homepage of easports.com. This primarily used html5 video for the background element and then javascript to handle the overlays. Before moving into some of the more complex conditions I had the first version working with javascript only being used to run the background video, everything else was carefully crafted css selectors and pseudo selectors.

The mobile experience for this was different of course due to the limitation against having background videos on a mobile device. For that we used the background image seen on the desktop view and added a Ken Burns effect to give it some life. This is also one of the few page templates on the site that includes a specific layout for tablet devices.

The goals for this redesign of the homepage were to get the user into their target game quickly so they could get to the meat of what they really were there to do and not linger on the homepage where there used to be postings from all games in a mosaic type layout. Overall the goals set for this redesign were all met. Since launching this page the video and content has already started to evolve which was planned. As new games launch or have new major announcements, like announcing the cover athlete for Rory McIlroy PGA TOUR, that game could get shifted to the top for more prominence before moving back to where it would belong in the normal stacking order.