BUILDING THE ’VERSE
by Benoit Beauséjour, Turbulent
Community vote
What a ride. Several months ago the community voted for our next project to take on. The starmap won ; by a long shot. Wide spread panic, tears and terror spread through the Turbulent office. It was the largest and most ambitious project on the table, required major coordination with CIG and was deeply rooted with the game. We were afraid not because we were worried of our abilities but because this is a such an important project inside the Star Citizen universe. We wanted to wow you guys and build the best damn web star map we could to really showcase the depth of the work the amazing CIG Writers team is doing. We wanted to make a map that would feel like it’s in the game….but in your browser.
Taking it on
Our first order of business was to get involved in the universe design process with Tony’s team @ CIG and start prototyping the User Experience. One of our core design goals was to build something on the web that could be ported and used inside the game space. This influenced the design of the different UI controls that power your experience in order to account for potential use with game controllers and the like.
We knew we needed to prototype and we knew we needed help to get there. We enlisted our next door neighbour, Gamerizon (Hi Martin, Robert and Louis!) to help us get off the ground and build our first round of the map prototype in Unity.
Our first prototype of the map, was demoed at the 2014 Christmas livestream. This prototype allowed us to test many interactions and design our base UI that would become what you will see online today.
Technology choices
We had made this choice beforehand but we confirmed it in our next step. WebGL was the way to go in order to bring a fast and efficient rendering pipeline in the browser. This standard browser API exposes the graphics card layers to the Javascript runtime of your application. This way, using a talented shader artist like Martin at Gamerizon, we were able to build nice holographic representation of stars, black hole and other phenomenons.
We needed an engine and we opted for Three.JS. It’s lightweight and fairly well supported and we used it before with the Holo Viewer. The map also uses several bleeding edge technology on the front-end side, the UI makes use of SVG animations, is built using a combination of languages and tools including Typescript, ES6, webpack, gulp, nodejs and more!
Moving from a stack like Unity to web-based GL API is a big step ; but one that proved worth it in it’s simplicity and performance.
Modelling an API
We knew from day one that we needed to be able to manage this universe. We set out to build a data model to represent the universe ; its stars and systems, planets and wormholes. Complete with an management interface and importers from CryEngine, this backend empowers designers to create planets, move stars and systems, collapse jump points and tunnels.
On top of this management interface and data model we constructed a solid REST-style API to allow the map client in your browser to load data sequentially, based on zoom and position, about the systems you visit. This API also has support for the search, persistent bookmarks and route searching algorithms.
Audio
If we wanted to reach our goal of building the ultimate browser map ; we need a soundscape and sound FX. There was no way we were going to try to do this ourselves and so we got major support from F42 audio. Matteo Cerquone built an amazing sound effect setup for the Starmap. Lee Banyard and Matthew Webster coordinated to get us a track from Pedro Camacho which once again blew us away.
The talent with the audio group never ceases to amaze me and I thank them for their support in the ARK Starmap!
The future
Major expansions plans for the map are in the works! Addition of real-time data coming from the game simulator, more models to represent other elements and phenomenons in space as well as possibly support for orbital mechanics. With the advent of other 3D browser standards like WebVR, maybe integration with virtual reality devices ?
The final list is still in the works ; but you can be sure we plan on expanding it and using this map to allow you to interact with the game universe even when you are not connected with the game client.
The result
We hope the result pleases the community. This project was very special to us because it is so close to the heart of Star Citizen.
Today is a proud day for us, enjoy Starmap V1!
See you guys, in the verse!
-b (Benoit aka Bault)