March 2013

Look Up: 100 Year starship is a screensaver that explores the aesthetics and challenges of travelling to nearby star systems.


Look Up is a project I worked on for the Barbarian Group. They are sponsors of the 100 Year Starship (100YSS) initiative headed up by Astronaut Mae Jemison. The purpose of the 100YSS is "... to make the capability of human travel beyond our solar system a reality within the next 100 years." For now, this means discussing the many enormous hurdles that stand in our way, but also finding ways to get people interested in the concept and inspired by the possibilities.

I was asked if I wanted to make a screensaver that explored the nearest stars to our sun and I immediately said yes. I am addicted to all things space. I had worked on a series of projects for the 2012 Eyeo Festival and one of those was a very basic star browser. That project was quick and dirty and though I could salvage bits and pieces from it (such as the 100,000 star text file and the code to parse the data), all of the rest of it would need to be designed from scratch. I was further inspired by the work of Michael Chang and the rest of the team that worked on the 100,000 Stars Chrome experiment (edit: seems to have been updated to the 1,000,000 stars project).

I used the Cinder C++ framework for this project. Cinder makes it incredibly easy to compile a .saver for Mac or a .scr for the PC. I also want to thank Andrew Bell for his assistance in tracking down a bug or two, and for handling the port to VC10 for the PC build. The data used in this screensaver was pulled mostly from Wikipedia with some extra details coming from Sol Station. I also enjoyed reading the post-launch writeup Michael wrote for HTML5Rocks about the 100,000 Stars project. Helped me focus.

One of the goals with this project was to make space more inviting. The reality of space is lonely and dangerous and we wanted this screensaver to minimize the endless black void overtones and try to find a way to show space fantastically without completely deviating from reality.

Challenge: Scale

The scale of the radius of a star compared to the vast distances between the stars is hard to wrap one's head around and it certainly doesn't make for easy code. A lot of trickery (and even a bold faced lie or two) was required to make the experience seem reasonable but not too unbelievable. The cheat was to just make the stars bigger. If we left the stars at a radius that was in proportion to the distances between them, the camera would have to get really really really close to a star before it became large enough to view well. This can be quite problematic. So we just made them bigger. A better solution would be to make a camera system that transitions between zones of scale. A challenge for another day.


Challenge: Surroundings

Another issue was the backdrop. I tried a couple different images of the Milky Way Galaxy but I just couldn't find a look that I was satisfied with. I poked around on Google images for artistic representations of space and the ones that were the most visually rich were the ones that had pronounced nebula clouds in the background. I was not in the position to do real-time generative nebula effects (and honestly have never tried such a thing) so I decided to just use a photo of the Carina Nebula as the backdrop.


Challenge: Binary Stars

Next there is the issue of multi-star systems. Upon beginning the data research portion of this project, I was surprised to read that most bright visible stars are often actually a small group of stars bound to each other's gravitation influence. Despite being composed of multiple stars, these systems would be hard to visualize because the distance between these bound stars is still pretty vast. As an example, the nearest star to us is Proxima Centauri which is considered to be part of the Alpha Centauri system which is itself a binary star pair. The distance between Alpha Centauri A and B is comparable to the distance between our sun and Neptune. However, the distance of Proxima Centauri to Alpha Centauri is around 15,000 times the distance from the Earth to the Sun. So if I were to try and show all three stars in the system and maintain a realistic relationship of their radii and their positions in space, they would need to be tiny points, the very thing I wanted to avoid having as the centerpiece of this screensaver. So I cheated. I pushed the multi-star systems closer so I could render them larger.


Challenge: Forward Motion

Finally, there was the issue of the journey itself. We would need to travel many millions of times faster than the speed of light to travel from star to star in 30 seconds or less. I am aware of all the cliche star-stretching-warp effects of Star Trek, Star Wars and the rest. Since our journeys would be of a much smaller distance, you wouldn't necessarily pass any other stars on the way. For example, on the 40 trillion kilometer journey from our sun to the nearest star, Proxima Centauri, you would pass by no other (known) stars. This means the star-warp effect couldn't effectively be used. So I ended up doing something more like a dust-warp effect which is like the better known starry version but less bright. Simply put, they are speed lines. Without it, you just don't feel like you are moving anywhere at all. I also added some subtle nebula graphics along the way so you feel like you are passing through the occasional sparse dust cloud. They help to imply forward movement.


Full of Stars

The position of the stars was the starting point. Using the HYG database from Astronexus, I was quickly able to plot the stars as 3D points in space. The database provides the star positions as right ascension, declination and distance so I did a bit of preprocessing of the data to convert it into simple xyz coordinates. Since this project was meant to showcase the stars nearest to ours, I thought I would cull the list down by excluding any stars that were many hundreds of light years away. This brought the number of stars down to just over 75,000.

I then divided the list into three different categories: faint, bright, and main.

The faint stars are the ones that are dim and too far out to be larger part of this experience. They would be represented as low alpha GL_POINTS and they are there to just help the background seem less empty. They are rendered with their spectrum information but otherwise, they have no dimension. There are 71,678 of these faint stars in this project.

The bright stars are the stars that are closer and brighter and therefore deserve extra attention when it comes time to render them. They do have dimension and are rendered as a pair of overlapping quads with gradient glow that fades in as they get closer to the camera position. There are about 3600 of these bright stars in this project.

The main stars are the ones you visit. There are 34 of these systems (many of the stars we know are actually double or triple stars so despite there being 34 systems, there are a total of 48 individual stars). These are the ones that require special treatment since they will be viewed from much shorter distances than the rest of the stars. Some of these main stars are large enough to span over half the height of the display. They should be varied enough to not feel repetitive, they should have some subtle texture on their surface, they should feature an intense glow, and most importantly, they should feel energetic. This last feature was certainly the hardest to pull off and I ended up trying out a few different methods before settling on the final effect.


The Journey

One of the things we wanted to add to this screensaver experience is dynamically calculated data about the journey itself. Since this is meant to put as much focus on the journey as the destination, we came up with the idea to compare the trip to things the viewer could more easily wrap their heads around. We calculate things like how long the trip would take by car, 747, Space Shuttle Atlantis and Voyager I. We also mention how many generations would be born during a trip of that duration and even the volume of air each person would require to take the trip if they travelled at the speed of Voyager I.


The Corona

Coming up with an interesting corona effect was an unspoken goal for this project. My first attempt was not unlike what I outlined at Eyeo Festival 2012 when I showed a breakdown of how to make a star. However I quickly became annoyed at how unrealistic the particle emitters looked so I scrapped those right away. For a while, I settled on just using a few different corona images overlapping and rotating in different directions but this too felt too rigid and there was no sense of any energy emanating from the surface of the star.

I then began to tackle the problem with geometry. I built a front-facing disk whose inner diameter was equal to the star's diameter and I animated a texture away from the star center. This solution was decent. I considered adding more geometry in the form of coronal flares but never followed through with it. So I left the coronal disks in place and moved on to a different problem.

The night before I was to be completed, I stumbled upon a GLSL project that was posted to ShaderToy by Trisomie21. It was a simple fireball effect written entirely in GLSL (WebGL enabled browser required to view). It seemed like something I could definitely use so I started poking at the code and eventually realized that I could add an additional noise variable to adjust the resolution value passed back into the noise function which would create some nice whirling loops which looked not unlike some videos I have seen of the corona of our sun. The following short video shows the corona effect, and eventually the other bits are turned back on to eventually show the final effect.

As a challenge to myself, I started playing around in ShaderToy to see if I could also create the solar surface entirely in the shader without having to introduce a 3D model of a sphere. This is as far as I have gotten with it. The code was getting really messy so I went ahead and saved it but I am happy with the progress.

Main Sequence Star Shader (WebGL-enabled browser required)