Responses by Fedor Nozdrin, art director, Possible Moscow.
Background: For a long time, humans have dreamed about exploring space. But soon, this dream might become impossible; we might never leave the planet, as space debris is a much bigger problem than we may think. Securing Space is about raising awareness on space debris: if we do nothing over the next 50 years, it’s very likely that the atmosphere will become so polluted, we won’t be able to reach orbit.
Larger campaign: This website is only the beginning of a large-scale project. It’s been created to describe the problem. The next part of the project will focus on space foam, one solution that scientists are currently developing to help save our planet.
Design core: We show the threat of space debris using simple metaphors that anyone can understand. What better way to express this threat than through constellations of our everyday trash? Would we want to admire those constellations in 50 years?
We tried to show the problem from two different viewpoints—Earth and space—using the most modern means of expression: 360-degree panoramas, 3-D models, animation and parallax scrolling effects.
Favorite details: Working on such a project that will bring real benefits for humankind is very interesting and inspiring. We’re helping create a clean future.
Technology: The key technology used in development is WebGL from the three.js library. This technology was most frequently used on our panorama page. The page is a composite structure that consists of two components: the surface of the Earth and the constellations in the sky.
Special technical features: The development started with the creation of a constellation-editor prototype. We decided that the editor and future constellations should be represented by one entity to optimize development costs and to show users what their work will look like when they are creating the object.
The main challenges in developing the editor was to make sure that the main design idea was preserved, and that constellations created in advance were transferred in a format that would be understood by the editor. To solve the first challenge, we had to write our own shader with a procedural texture that connected all stars and created an aurora borealis effect. For this, we used GLSL.
Constellations on the site are actually small 3-D models and editors, but we couldn’t just add them to the sky. To solve the second main challenge, we had to write a script to transfer assets over from Blender 3D—the program in which these were created as well as the animations, such as the owls and the couple in love. The script enabled us to get the necessary format of the data for the location of the stars and also the connections between them. Then, this data was uploaded into the editor, and the editor automatically drew constellations in the sky—as well as generating all necessary images for further use.
The surface of the Earth consists of two spheres with different radii. The smaller sphere contains textures and objects that can be seen in the foreground: ground under the feet, trees, fire and people, among others. The larger sphere contains sky textures. Two different spheres were needed to achieve the feeling of depth of the surroundings and space for the site’s VR mode—which we built using WebVR.