Route Fifty
From Web to the Moon, and back again!
This story has two main parts to it. The first is a road, 481km in America that connect West Sacramento to Ocean City. The second is a young boy, born in Rome at 16 Via Tevere on 31st October, 1930. He was the son of an American soldier working at the embassy.
On 20th July 1969, while Armstrong and Aldrin made history by stepping foot on the moon, this boy who was now an adult, was on the Apollo 11 Command Module Columbia. He had to be in orbit for twenty-one and a half hours, an experience that journalists described as ‘the most profound solitude any human has ever known’. Michael Collins, the name of the boy, is the third hero in the moon landing story, and for us in the Tech Team, a symbol.
He is a symbol for all those who, thanks to their hard work behind the scenes, push the limits of mankind forward, which would otherwise be impossible without them. Going back to the road at the beginning, its name is Route Fifty, and it is known as being the most isolated road in the United Sates.
Whether the name Route Fifty reminds you of the 50th anniversary of the landing on the moon, or the strength and determination shown by Collins during his incredible endeavour, Route Fifty is a tribute to this story either way.
Where we started?
As an R&D project our aim was to experiment with the creative process of an interactive game. To do that, we started with basic shaders and used Three.js to build up, step by step, a complete experience.
The Team was composed of 3 developers (Alberto Parziale, Lorenzo Girardi, Vincent No), a 3D artist (Gian Guido Ponzini), a copywriter (Daniel Molinari), a QA Tester (Pietro Tancredi) and a UI/UX Designer (Nico Cherubin).
Our deadline was to be finished in one month.
From Cubes to Ship
We started creating a scrolling ground through shaders with some basic 3D shapes to test the scene. Immediately, we had the idea of creating an infinite runner, set in Space with various bonuses and enemies, and a little bit of 80s Sci-Fi flavour. With everything shown on screen, the next steps were to bind the controls with the keyboard and touch inputs and to create a spawning system with different PowerUps.
At this point we had our first prototype.
Something more…
“That’s one small step for man, one giant leap for mankind” — Neil Armstrong
The more we worked on the project, the more we started craving a narrative drive for the entire experience. We came up with the idea of celebrating one of the most important events of the 19th Century, a milestone for mankind, the 50th anniversary of the Moon landing which will take place this year.
Thinking about this glorious date brings up the memories of the famous words spoken by Neil Armstrong and his iconic walk on the Moon’s surface, but there is also another perspective of the story.
An Alternative Hero
Armstrong was making history bouncing without gravity on the lunar sand, but meanwhile, deep in space, there was another hero that had one task: to fly around in orbit of the Moon, keeping radio contact with the other members of the crew.
All those three men, together, made this amazing achievement of science and exploration possible. This moment, addressed by the newspapers as “not since Adam has any human known such solitude”, is a great emotional trigger and, moreover, fits perfectly with the mechanic of an infinite runner.
So, we had our Hero: Michael Collins, an American astronaut born in Rome in 1930 and who, at the age of 39, contributed to writing history.
The title has a double meaning: it can be connected with the 50th anniversary, and also because Route 50 is one of the longest roads in the US, measuring at more than 3000 miles long, and is well-known as being “the loneliest road” in America. We thought that was a touching reminder to the solitude of flying around the Moon all alone.
That’s what Route Fifty is all about.
3D Assets
Once we had the main narrative driver, we updated all of the 3D placeholders with some ad hoc stuff: we reproduced a low-poly faceted version of the Apollo 11 capsule used by Collins and created some Sci-Fi PowerUps for our arcade experience.
For optimisation’s sake we decided to keep a unique colour palette texture for all the assets (with huge improvements on download size and draw calls), mapping the UVs of each model on it and shading everything with a Matcap custom shader. Each model has been optimised by deleting back-faces and keeping the polycount as low as possible.
One Project to Rule Them All!
One of the most important achievements of this R&D project has been to test the possibility of working on a single project that can be delivered on many different platforms.
By meticulously working on the optimisation, we stripped all the shaders, used many best-practices from games such as object pooling and a single texture atlas through all the assets to create minimal effort on draw-calls.
All those tricks helped us to gain best performances even on low-end mobile devices.
Thanks to this, with one project we have been able to deliver the browser experience both on desktop and mobile devices. Moreover, we also worked on PWA support, and being able to export an APK that can be distributed through the Android Play Store.
Easter Egg
When we reached the deadline we literally went crazy and decided to add a little Easter Egg: through the Konami Code you can access an alternative setting, a tribute to the conspiration theory that the Moon landing was just a movie recorded in an artificial studio. Will you be good enough to find it? :)
Be the Rocket Man!
During the Route Fifty game you can explore some interesting facts about the Moon Landing and all the journeys human beings have made in Space, as well as seeing realtime stats of all the users connected. Just prepare yourself, start the engine and be an alternative hero.
