Alex Pytlarz's Work
Art Director
PS4.jpg

Playstation Store Redesign

At Odopod I worked with Sony on an immersive redesign of their on-console Playstation 4 Game Detail Pages which focused on getting people excited about new games.

 

Sony came to us with a desire to bring full screen trailers to the landing pages of their "big release" game detail pages (GDPs). The current design was lacking in visual punch and everything was hidden behind clicks. They knew they wanted these pages to be beautiful and immersive, but also have them function as a home to the new industry of game add-on purchases like new weapons and character outfits.

As an outsider to the gaming world myself – I had to dig into the mechanics of the Playstation Store, talk to PS4 using friends, and figure out how to bring the most value quickest in this new experience.

The original Playstation 4 game detail page:

 
 

What We Did

 

The first thing anyone will notice is the full screen auto-playing game trailer when you land on the game page. We didn't want this to be disruptive, so the volume is turned down to 10% volume until the user either declares they want to watch the video or doesn't touch their controller for a few seconds. The UI fades away and the user gets to see the trailer uninturrupted.

 
 

The entire GDP is made up of full screen moments stacked atop one another. All video, gameplay, and screenshot content is housed in the "media" page above the cover – while all game details, special editions, add-on content, and related games are stacked below.

Diagram of the experience from a bird's eye view

Diagram of the experience from a bird's eye view

 

Embedded at Sony

 

Because of the impact and scale of this project, Sony had the unique request of asking for our design team to work on-site in Sony's San Francisco Headquarters. Our Odopod team was small (a design director, myself as art director, and a visual designer)  so we blended in seamlessly with our client's team who was largely engineering. We learned the technical limitations of the PS4 store and showed motion prototypes to engineers for approval. Our close relationship and near daily check-ins made the project move at a steady clip – finishing the lot of it in just a few months.

 

Designing for TV

 

We leaned on Sony's knowledge on designing for televisions of all sizes and settings. They had robust research around minimum font sizes, safe zones, overscan, and GUI contrast. One of the more challenging considerations was around the controller, and never surprising a user at where their D-Pad interaction will take them. This led us to create a "One-up One-down" interaction pattern where each vertical was only a single tap away, and all interaction took place laterally.

Safe zones, style guide, and behavioral specs for delivery to the Engineering team at Sony

Safe zones, style guide, and behavioral specs for delivery to the Engineering team at Sony

 

Looking Forward

 

This redesign took effect in late 2016 on Sony's biggest release "Tier 1" games. The plan for 2017 is to roll these changes into all games once assets can be produced - and take a look at the store as a whole in light of the new design style.