The Importance of UI in Star Citizen

Star Citizen is a groundbreaking sci-fi game that lets the player fight, trade and explore on foot and in a variety of spectacular space ships. At its core, the player can use dozens of unique gameplay systems, and all of those need a high-quality user interface. We’re a community focussed game with 2.7 Million player accounts, so we release a big update to the public every 3 months, including new ways to play, and a variety of exciting new vehicles, weapons, environments, and UI.

The way we approach UI in Star Citizen and its sister project Squadron 42 is unique compared to most games. Here at Cloud Imperium Games, it is important to us that the UI supports the story and feels part of the world rather than being “stuck to your monitor”. Imagine for example engrossed in chasing down an enemy ship, your co-pilot looks at your holographic HUD and reminds you to pull back, because he noticed the engines are overheating.

Star Citizen is a massive project, and we are always working to improve the UI. Our ultimate goal is to create something that wouldn’t look out of place in a sci-fi movie. We’re growing our team of artists, designers and programmers, and even work with Hollywood concept artists to achieve something that will really stand out. The future of UI in Star Citizen is very exciting!

Klescher Rehabilitation Facility

To give you an idea of how we develop our UI, let’s take a deeper dive into the Klescher Rehabilitation Facility. If players get caught doing something illegal, they can get sent to a remote prison on one of the moons. Here they can work off their sentence by doing hard labour or try to escape with the help of other players and a getaway vehicle. To support this on the UI team, we needed to come up with a variety interactive screens, such as vending machines, keypads and info displays.

Pre-production is vital on a project like Star Citizen – it helps to solve problems at the start, which saves us time later when things are harder to change. The first step was to talk with the game designers to get an idea of how things should play, and what screens they needed to support the gameplay. We created simple wireframes to illustrate the flow of each screen, showing what happens where, and these formed the basis of what went into the game.

Playing through a “normal” game you might see one or two visual styles on the UI, Star Citizen blows that out of the water. We strive for a rich, diverse universe, so all our locations each have their own look, and a unique UI style, the prisons were no exception.,

Inspired by the environment concept art and back story, we created a mood board as a starting point for the UI style. At this stage it’s a great idea to get a widespread range of images to help trigger ideas, so we included screenshots from movies, artwork, graphic design and even abstract shapes and colours.

Using the favourite parts of the mood board, we then sketched a selection of rough concepts for what the UI could look like. We like to keep them fast and loose at this stage (spending less than a day on each) so that we can explore a range of ideas rather than focussing too early. We used a similar process to develop the Klescher logo, doing a variety of concepts and eventually choosing a very corporate and brutalist look which helped inform the look of the UI.

Star Citizen – Rough concept iteration

Star Citizen – Logos

When we had a few concepts to choose from, we sat down with the art director to pick the favourite, and used this as a starting point for the visual target. This is essentially a polished concept image sums up the look and feel for the UI style. We make sure that the UI on the visual target feels like it’s part of the world – seeing it in a scene with dusty fingerprints, old school monitor effects and light glares tells much more of a story than just seeing it on a flat black background! The final style we chose for the prisons had a retro, brutal look with bold colours. Behind the flat UI, we also added a 3D background to give the scene much more depth. When the team was happy with the look, we created a short style guide showing the important colours, fonts and layout rules, ready to make the real in-game screens.

Star Citizen – UI style options

Star Citizen – UI Style Guide

When it comes to building interactive screens in-game, we have an in-house tool which allows non-UI people to build their own screens, without being slowed down by lack of visuals. This meant that while the UI team was figuring out the look, the missions team could set up functional, but ugly versions of the screens in the game. The UI team also has its own designers and coders who tackle the more complicated screens.

The next stage was to combine the visual style with the functional screens and get them into the level. This involved the UI artists saving out any artwork ready to put into the game, advising the game designers, and getting hands-on in the game engine where necessary to pull everything together.

Once we’d got the screens in-game, the visuals felt a bit too static, so we spent some time working out how to add life to the 3D background. We had to decide whether to use a movie, a flipbook, or real 3D elements—working out what would look good, but wouldn’t take too long to create, or slow the game down. In the end, we opted for a pre-rendered background image, with some small hand-animated sections to make it feel more alive, but still run fast.

Once the UI was complete, the 3D artists added the screens to the level with lighting, materials, dirt and grime to make them feel like they really fit into the prison environment. Finally, we spent a lot of time testing, tweaking and fixing to make sure everything worked as expected, before shipping it out to the players in the next version of Star Citizen.

Finally, it’s important on a big project to look back and work out what you could do better next time. The prison screens turned out great overall, but we discovered lots of things to improve with our planning and cross-team communication. This also helped us figure out new ways to re-use our UI so that we could get things up and running more quickly in future.

Roles on the UI Team

The CIG UI team is made up of a talented group of people who specialise in different areas, ranging from graphic art to UI design to programming. Right now we’re looking for Technical UI Artists – people who can create good looking visuals, and also have the skills to get things up and running in the game engine. I think the ideal contenders would be people that like making Sci-fi UI, and aren’t afraid to do a bit of scripting and messing around in the engine to get things just right – such as technical artists, web designers or maybe very artistic programmers.

As well as this we are always interested in programmers to help implement our ever-growing list of features. There are exciting things for them to get their teeth into such as our new star map system, and we’d love to get more hands-on deck to improve our in-house UI tool.

Working in Wilmslow, UK

Like most tech companies, we’ve been happily working from home for over half a year but will be glad to get back into the office when the time is right. Most of the UI team is situated in Wilmslow, near Manchester, UK, with a smaller team in Los Angeles, USA.

Wilmslow is a peaceful, upmarket British town, and for those wanting more excitement, the vibrant city of Manchester is not far away. CIG is a company full of inspirational artists, programmers and designers, so there’s always someone interesting to work with and learn from. Also, if you need coffee to get you started in the morning, we have a free coffee shop complete with barista.

As a company, we regularly keep our community up to date with what’s going on, and it’s not unusual to see your work featured on our website or YouTube channel. The main draw for me is working on two very ambitious sci-fi games, with all the challenges and rewards that brings.

Working with CR

The person who started Star Citizen is Chris Roberts, he’s something of an industry legend and the driving force behind our games. Star Citizen is his dream project, so he spends a lot of his time reviewing the work the developers create. I guarantee that the work of every UI team member will have been seen by him at some point, sometimes generating feedback for improvements, and eventually getting approval to become part of the growing universe of Star Citizen.

Cloud Imperium is hiring

For more positions at Cloud Imperium/Foundry 42 check out the company page on ArtStation Jobs.

  • Share this article

About the author