Redesign Steam

OVERVIEW

Keeping the company's mission statement in mind, but also open to exploring bold and creative design ideas, I proposed a new style guide to the popular game platform: Steam. Then I applied the new guide to redesigning the Steam platform and mobile app. In the end, motion design was implemented to create more tension for the design.

TEAM

Individual

(Justin Miller as the advisor)

TOOL USED

Figma
Adobe Photoshop
Invision Studio

Keen on playing video games? Then you must have heard about Steam! Steam is a platform for playing, discussing, and creating games, with nearly 30,000 games from AAA to indie and everything in-between. However, I believe the current design style of Steam still has room to be improved, in terms of conveying its mission statement.

In this experimental visual design project, I created a new visual style for steam to make it more attractive and unique.

1. DESIGN PROPOSAL

Set the design direction

Group-9-1

The new design should be...

Unique

The current design of Steam platform is not memorable and does not show the brand identity of Steam. I would like to make it more unique, so that people can easily differentiate from other game websites or platforms. The design should look fancy and edgy to indicate that there are many new games waiting for users to discover.

Fun and entertaining

The design should looks interesting and amusing, to engage users to try out new games / equipment, meet new friends and participate in discussion about games.

2. MOODBOARD

What is the emotion that I’m going to convey

Before I start with any kind of design, I searched for pictures by relevant keywords to get inspiration. Then I picked those pictures that I believe conveys the feeling that my design should have. With these pictures, the general idea gradually emerged: I decided to apply a manga style, that is fun and attractive, which also has a sense of motion and power.

As for the typeface, I compared several types and finally selected two different typefaces: Damn Noisy Kids and Oswald. Danm Noisy Kids is a perfect manga style font, that is funny and dynamical. It was used as H1 and H2. While Oswald was used as the main paragraph, as it is more readable. It is a long font that seems stretched, which also creates a kind of vibrant dynamic feeling. Especially, in website design, when scrolling down the page, it gives audiences a sense of falling.

Desktop333

Gather these inspiration pieces together, that is how I get my moodboard.

01

And then, iterating.

MacBook-1202
3. FINAL SOLUTION

Finally, let’s experience the new Steam!

0012
Group-10stupid-semplice
Group-1122
Group-12-2
4. STEAM MOBILE INTERFACE DESIGN

Apply the style to Steam community app

Group-5
Group-7
Group-8-1
5. MOTION DESIGN

Add more flavor to the design

Thank you for reading!

View other works

Congress.gov(Recommended) Capstone Project

Shopping at TargetEnd-to-End Product Design

P&G Supplier SiteAward-wining website redesign project

Alone TogetherConceptual UX Design Project

SketchJust for fun