Using RGB highlights to enhance the player experience

RGB lighting has become a mainstay of gaming accessories in the past couple of years. Apart from giving our peripherals and PC components a sleek, modern look, it can also serve an informative purpose. Different colors can give us a quick update on the state of our machine or the running software. It gives the developers the ability to convey information at just a glance, increasing accessibility and ease of use - some of the most important aspects of good software. 

There are various companies that produce RGB-enabled gear for gaming enthusiasts all over the world. Most of those companies, such as Razer, Asus or Logitech, use their own APIs to control these features. They might offer slightly different approaches to handling the communication between hardware and software, so extensive, hands-on testing is key. We decided to implement RGB highlights in The Riftbreaker and X-Morph: Defense and would like to share our experience with you.

The main menu ambient highlight for our previous game, X-Morph: Defense.

We have already had some experience with the dynamic RGB highlights while working on X-Morph: Defense. We were one of the first companies to add the mouse and keyboard support for the Xbox One. Working with the Razer Turret set gave us an option to dip our toes into the world of RGB illumination.  In X-Morph, we used the keyboard highlights to show the players which keys could be pressed in order to perform a game action. The row of function keys represented the health of the player’s ship and core. The keys that were not relevant to the gameplay received a blue, ambient highlight. While not overly spectacular or flashy, we thought it would serve the game best.

The action keys receive their own highlights in distinct colors, while the rest of the keyboard informs the player about the status of the ship and the core.

Once we take the controls away from the player, we can go a little more crazy with the RGB effects.

The desire to keep the highlights functional limits our options, but we did go a little crazy at times when we took the controls away from the player. During the cutscenes, we gave our camera shake system a degree of control over the RGB highlights. This way, we managed to synchronize the camera shake with the behavior of the LEDs. The whole keyboard could flash white, yellow, and red according to what was currently going on in the game. It was a great feature for increasing the immersion and expanding the experience of playing the game beyond the screen. 

Our next project, The Riftbreaker, follows that exact philosophy. The Riftbreaker is a mix of various genres - it is a base-building game with elements of exploration, survival and hack and slash. The player takes the role of the titular Riftbreaker, an elite scientist/commando, whose task is to prepare a distant alien planet for human colonization. The game runs on our proprietary game engine, the Schmetterling 2.0. It means that we handle the integration with peripherals by ourselves. In order to get the most out of RGB illumination, we thoroughly analyzed the API of our keyboard, looking for ways of implementation that would work well together with our design goals for the game. The fact that the API allows us to either control the illumination of individual LEDs or virtualized keys gives us everything we need in order to design a system that will be both functional and stylish.

Bearing that in mind, when designing the RGB highlights for The Riftbreaker we decided to divide the scheme into two parts. The first part is the full, solid-color ambient illumination of the device. This way we can communicate the application state to the user, as well as emphasize special events in the game. By choosing a single color for a situation and applying it to all the LEDs on the keyboard we achieve a solid foundation that is compatible with all RGB devices. 

Exploration mode highlights for The Riftbreaker. We stick mainly to the main colors of the key art - green, blue and orange, creating a consistent visual style.

The key art for The Riftbreaker.

With The Riftbreaker we are embracing this exact philosophy. Instead of solely bombarding the player with a barrage of colorful, flashing lights, we are going to use the RGB lighting in a much more sophisticated way. In The Riftbreaker we can operate in two modes - exploration and building. Each of those modes have their own set of highlights, indicating which keys are responsible for game actions. They are easily distinguishable by their ambient lighting. In the exploration mode most of the keyboard is orange, whereas in the building mode, the ambient light will turn blue.

Both the colors and the highlighted action keys change when going into the building mode.

We are very careful when choosing the color palette and their intensity. It is quite easy to predict the user experience when we use solid colors. The situation would be entirely different if we utilized sudden flashes and extreme hue changes. While these could be acceptable on the keyboard in some scenarios, not all players might enjoy their RGB-enabled TV or chair (yes, RGB chairs do exist!) flashing violently during the gameplay. That is why we need a lot of consideration when it comes to what we want to communicate and in what manner to do it. Once the first part of the design of the highlights is finished we move on to the second layer - custom actions for specific keys.  

The F1-F4 and F9-F12 blocks inform the player about the health of the Mecha and the Headquarters, respectively.

All the other keys are color-coded so that you can easily tell which button you should press in order to do something in the game. It can be useful if you forget the full control scheme, or if you are just learning the ropes. Just a glance at the keyboard will immediately tell you ‘something will happen when you press this button’. While this does not get rid of the need to teach the players basic controls, it greatly reduces the risk of forgetting them. Color-coded keys can also improve the tutorial experience. Illuminated keys can help the player get accustomed to the controls and make the learning process faster and easier.

There are a couple of brief moments in The Riftbreaker where you do not directly control Mr. Riggs. We plan to use those to add some cool, full-keyboard effects to amplify the gaming experience. It will happen, for example, during the teleportation between Rifts or after the mech is destroyed. The on-screen effects and the RGB highlights will complement each other, making the game events much more tangible. These are just the ideas we have for now, and we expect to come up with much more over the course of The Riftbreaker’s development. 

One of the effects we plan to add in the future - explosion highlights.

Another cool feature that we plan to implement along with the RGB highlights is the stream integration. Streaming allows the content creators and fans to interact in real-time and create a bond that is impossible to achieve in any other way. Even though the broadcaster and the viewer might be thousands of miles apart, the wonders of the internet allow us to feel like we are all next to each other. We want to amplify that feeling. Imagine how cool it would be if the ambient lighting of your RGB keyboard could provide you with the info about the streamer’s game. It would be a powerful tool to convey the in-game atmosphere and increase the viewer's immersion.  Small things like these can help us make The Riftbreaker a much more interesting experience.

Teleporting takes the controls away, so we can play with the keyboard a little. Another feature we plan to add later on.

That’s all we have for you today. We hope you will enjoy these features and that they will extend the gaming experience beyond the screen of your device. If you’re interested in more insights into the development of The Riftbreaker, we highly encourage you to join our amazing Discord community, where we discuss the game with our fans. It’s also a place where you can leave feedback and suggestions that we read and respond to on a daily basis. www.discord.gg/exorstudios 

Thank you for reading and see you next time!

Other social media:
www.facebook.com/exorstudios
www.twitter.com/exorstudios
www.mixer.com/exor_studios
www.twitch.tv/exorstudios
www.youtube.com/exorstudios