Rocksteady Gaming

A gaming tournament platform designed for competitive gamers across the globe. Participate in tournaments, compete to win, and receive rewards for your performance.

Research

The process

In order to get familiarized with the target audience and the way similar platforms operate, I have opted to utilize two methods as a basis for the research process.

The first – An user interview, so I could gather real life input and data from a competitive player.

 

Second – A competitive analysis, so I could get a better grasp on how other platforms operate.

User interview

In order to get a better understanding on how these platforms operate and what’s to be expected, I chose to conduct an interview with a friend who participates in a more relaxed, lower-tier tournament scene.

What I was able to immediatly gather is the fact that users do not necessarily prioritize the visual aspect, but rather focus on the functionalities and brand trustworthiness.

 

While many of these platforms may appear outdated, it doesn’t seem to be a significant issue at the moment. These products have withstood the test of time due to their consistency, brand recognition, and reliability. However, gaming companies are consistently pushing forward and embracing design changes to improve the overall user experience (the Battle.net application is a great example).

 

Therefore, gamers are increasingly recognizing the shortcomings of these platforms by using other well-designed products on a daily basis. Ultimately, the desire for a comprehensive user experience will play a significant role in the decision-making process when choosing one platform or another. This is precisely why design should be the cornerstone of all things.

Competitive analysis

After some consideration, I picked four similar platforms and analyzed how these hold up UI wise – the good, the not so good, and what are some of the main aspects such products share, here are some of the things I found.

Dark themed platforms seem to be quite common in most cases. I believe this is a valuable aspect, as most (if not all) gaming related platforms should be suitable for low-light environments.

 

Landing pages are not too visually crowded, USP’s are pretty straightforward and very well highlighted, high emphasis on video games media content (screenshots, brand colors, specific game logos) seems to be quite common.

 

I might have my own biased opinion regarding the overall dated UI direction, but most of these platforms look quite cohesive in general, and that’s always a very big plus.

Conclusions

Based on the data I was able to gather, I created a short recap in order to have an overview of the findings throughout the duration of the project.

Most gamers prefer a dark themed platform because of the well-known benefits – reduced eye strain and low-light settings suitability.

 

Ideally, content should always be easy to read, contrasting, yet not too harsh on the eye. The color scheme will play a key role in this part.

 

Users are constantly becoming more aware of poorly designed gaming related products. My aim during this project is to create both a brand and platform that feels vibrant and fun, but also premium and trustworthy.

Visual identity

Context

In order to get a better understanding of what I’m about to build, I started at the very beginning of the process – defining the visual identity.

The goal was to create an identity that feels relatable and familiar to the brand’s target group. Since we are referring to a gaming related platform, I wanted to design a bold visual identity – one that looks premium, fun and also trustworthy.

Design system

Foundation

As far as Rocksteady Gaming goes, I started to build up the design system foundation right after wrapping up the visual identity.

Naturally, the first steps involved setting up a grid system, defining the typography and color styles, and putting together some essential assets.

Components library

The components for this product were built and organized per specific categories, given the (small) scale of the project.

As it is commonly known, keeping things organized is an essential aspect when building or updating a design system at any scale. As designers, this makes our day to day work so much easier and provides massive help in building a consistent, ever-evolving product.

Screens

Landing page

The design is optimized to guide the user seamlessly throughout the landing page, emphasizing key elements such as the CTA, main selling points, and tournament suggestions.

With a clear and concise layout, the design proposal ensures that gamers can focus on the details that matter most and make informed decisions about their gaming experience

WIREFRAME

1ST PHASE

2ND PHASE

Start page

With the proposed design, players can effortlessly filter, discover, and join tournaments.

The user-friendly interface ensures that gamers can easily find the tournaments that fit their preferences and skill levels, and join the competition with just a few clicks.

WIREFRAME

1ST PHASE

2ND PHASE

Tournament page

The tournament page design prioritizes accessibility of all necessary information to the user, while also ensuring it remains clear and simple.

With a clean and organized layout, players can quickly find the details they need, such as tournament rules, schedule, prize amount, and more.

WIREFRAME

1ST PHASE

2ND PHASE