Category: FirstBlood (1ST)

FirstBlood.io Will Forever Look Different!

Also known as Beta Dev Update (10)

Preface

Firstblood platform went through some pretty big changes both in terms of functionality and looks in the past few months. Given we’re living in a fast paced environment, the platform first went live as a simple, but functional wireframe in the pre-alpha stage.

Not long ago, we completed the FirstBlood rebranding. Something we knew had to be done to fit more of the company culture, mission and, future objectives.

With that, we had the platform redesign in our minds long before pre-alpha was released. Shortly after we started gathering first feedback from our users, we went full in with fresh new looks and improved functionalities.

Why Redesign?

Simply put — because both, our pre-alpha product and Firstblood as a brand needed the upgrade it deserved. At first, Firstblood was nothing but a simple logo, but what we needed was a brand. So it began…

The Beginning of the Future

Platform Redesign

Shortly after branding was done, Firstblood app received a complete visual makeover. We kept the overall dark, contrast scheme but instead of going with simple solid dark and light tones, we decided to add a touch of playfulness in shape of subtle purple gradients, elements with rounded corners and slightly more saturated overall feel combined with transparencies. We had to transition from the classic feel for we are not a classic company. Not only was this crucial in order to make the platform more appealing to the everyone but crucial to our brand.

Header received some of the bigger changes;

  • Removed the game selector; Players will be able to find it in the left sidebar that we’ll implement soon and swapped its position with new logo. The logo occupying the top left position instead of being placed in the center helps making the site feel more professional.
  • Search field; can now be found; pinned on the right side, next to notification icon, user info panel and the main navigation drop-out. This layout just feels more natural and intuitive.

Central layout remained virtually the same. For now.

One of the bigger changes was the overall height being reduced significantly. Elements and features in the pre-alpha version were taking way too much vertical space, resulting in poor overview.

The main call-to-action buttons and links were changed too! Instead of classic green, we went for high contrast version of sky blue color. This not only looks great, but it aligns with our new branding color palette, too. Not to mention, blue is the color of wisdom, trust and faith!

One of our newest features — Ladder page — received a slight layout change;

  • Given prizes are the bread and butter to ladder, we figured it would be best to expose them horizontally on top rather than stacked vertically one above another.
  • Also, thanks to player feedback, ladder page now also shows previous week winners!

Right column widgets; All were significantly refreshed in terms of visual appearance.

  • Statuses within friends list are now colored which results in a much clearer understanding who’s available and who isn’t.
  • New friends requests that appear inside the widget are now subtly animated and notifications are much easier to see.
  • We’ve also added inline notifications for Steam friends joining Firstblood platform which, we believe, will make it much easier and logical to users to connect with them.

Team and Party widget both got the same visual makeover treatment;

  • Right column as a whole is no longer a collection of separate widgets but a rather complete unit. This results in it occupying much less vertical space.
  • We’ve added the ability to collapse and expand options on all widgets now. You are in complete control, now!

Team and personal profile page were redesigned as well;

  • One of the biggest changes in this area is the settings option now integrated on profile.

What was the biggest change overall?

The complete matchmaking rework both in terms of visual appearance and functionality.

  • In-line alerts and messaging now feature different colors, depending on the content being communicated to user.
  • Blue messages demand user actions, orange ones stand for pending modes.
  • Same applies to widgets occupying the right column.

Choosing team and party members in matchmaking has been improved significantly too!

It’s not just glimmer and shine!

Almost every feature on the platform has been improved in terms of performance, too.

We believe, design is a living thing, going hand in hand with demanding players needs and company improvements.

FirstBlood, will be constantly evolving, and will very likely undergo several more improvements and tweaks as we progress.

Hope you enjoy the new and improved, FirstBlood!

Want to take a look yourself? Head to FirstBlood.io

Please share in the comments your thoughts, Tweet them at us FirstBlood and/or join our Discord channel and community to share more!

From all of us at FirstBlood,

Thank you

Want to learn more? Join our community!

Twitter | Facebook | Discord | SlackForum


FirstBlood.io Will Forever Look Different! was originally published in FirstBlood on Medium, where people are continuing the conversation by highlighting and responding to this story.

This article was originally published on: The FirstBlood Blog on