In late 2009 I created a New Year’s Resolution of sorts with some friends to stay active outside of work as artists and designers. The idea was to have a monthly topic that each participant would respond to. The medium of choice was whichever field the participant wanted to be employed in on year from then. This first ‘warm-up’ topic for the month of December was, “the most epic, out of this world thing you can think of.” I set out, as usual, by brainstorming and conceiving of an idea that was unique and interesting to me. I dissected the topic into to ideas: ‘epic’ and ‘out of this world.’ EPIC: heroic; majestic; impressively great; of unusually great size or extent OUT OF THIS WORLD: exceptional in character, amount, extent, degree “What then” I asked, “could be more impressively great than the universe? It is everything we know, yet something we know almost nothing about.”
I have to admit right here, right now that I held no interest in ‘outer space’ until I began this project. ‘Space’ didn’t matter to me, I was never going there; who cares? Well, this project helped my inner-sciene-nerd emerge and I can now admit that out space is pretty cool 8^B (that’s my nerd face, right there. Look closely). Some research about the cosmos revealed multiple scopes at which to view the inverse. There were so many sizes, groups, clusters, expansion, collapsing etc. I set out to design an interactive experience which focused on imagery, size and knowledge. I arrived at my mission statement after sketches and lots of notes:
Cosmos is an interactive learning tool which exhibits the majesty of the Universe.
The typeface selection process was fairly simple. My sketches indicated that most of the imagery the type would be set over would be very busy or dead black. Because of this, I eliminated all serif typefaces immediately. Futura became the strongest sans serif typeface because of it’s geometric qualities. I wanted to use a face that shared something with planets: near perfect spheres. Futura
Futura’s capitols became a nuisance because of very sharp angles in letters such as A, M, and R. The lower case letters of this face complimented the subject matter better when capitols were omitted.
Type Selection
Main navigation bar as a sliding magnifying lens. Users can drag slider to view the cosmos at any scale they desire.
I felt the navigation for such epic imagery needed to be subtle and neutral. I chose shades of grey with subtle hints of depth in the designs.
‘Next’ button for linear scale progression.
Solar system navigation shows planetary size differences.
Navigation
Title screen
Depicts a linear progression of scope from macro to micro.
The Universe
Local Supercluster
Local Group
Galactic Realm
Solar System
Planet Earth
Planetary texture
System Map
This series of images depicts how a page transfer might look when changing scope of the cosmos. The first row shows typographic elements fading. The second and third rows show the slider bar in the navigation popping out of slot and sliding into the adjacent slot while the image of the milky way magnifies into the location of the solar system (such an image does not yet actually exist, yet. Were pretending here) The fourth row shows the solar system page coming into focus while the slider in the navigation settles into place.
Storyboard: Page Transition
All images included within this brief are the property of NASA and their use in this project meet NASA’s usage guidelines. The information within each page design is from Wikipedia. This is for demonstration purposes only. Inspiration for this project came from listening to the album “Et Les Boites a Musique” by Colleen.
Copyright Information