,
19 tweets,
10 min read
Read on Twitter
1/ Here’s how I built the iconic first level of #SuperMarioBros as a life-size first person AR game that I played in @CentralParkNYC . Read on below!
3/ Unable to find 3D assets in the style I wanted, I decided to recreate them myself. Used @adskFusion360 & had to consider things like how will bricks & characters I’ve only ever seen in 2D appear from the various angles that #AR enables.
4/ Laid out the level and re-created game mechanics in @unity3d , scripted using C#. At human scale, the level spanned 110 meters. #madewithunity
5/ I wanted to stay true to the original. Since I couldn’t defy biology and make the player spontaneously grow on eating a virtual mushroom I used a programmatic illusion to scale down the entire level around the player instead.
6/ Similarly, how would I instantly change clothes on eating a flower. I used on-screen effects to communicate the effect of the intended power-up.
7/ I couldn’t figure out how to address jumping up onto the pipes and stairs. Tried shifting the full level down but since the real world remained locked in place, this seemed unnatural. Decided to use the added dimension to my advantage...simply walked around them instead.
8/ To seemingly defy physics and jump twice my height, I added colliders offset from the @HoloLens (which would be on my head) and the bricks above. This let me jump just a little but still hit bricks hovering high above, maintaining original level proportions.
9/ A behind the scenes look at how the collider worked. Since the hololens on your head can detect its position in space, attaching a collider (green box) offset above it and colliders offset below the bricks let you hit bricks higher than you could jump.
10/ While user testing, I realized my shorter friends couldn’t complete the level. The bricks were too high. I added the ability to enter your height at the start. This calibrated the entire level just for you. Always consider the user.
12/ At 110m, there was lot of cumulative drift occurring as you got deeper into the level, causing the level to deviate off the path, into the trees or into the ground. Split the level into 6m chunks, each with its own anchor and aligned sequentially.
13/ The voids in the ground were made using a stencil buffer which is like a programmatic window in a wall. You can only see certain objects when looking through it. I took the creative liberty to add water at the bottom.
14/ The hidden 1up mushroom was present as well. I was lucky to actually hit it after a couple of tries since it was harder to orient myself precisely in the AR game as compared to on a flat screen.
15/ I used the native hololens airtap gesture for my favorite part - shooting fireballs at the goombas. Embarrassingly I always thought they were called ‘bad mushrooms’ up until this project. You'll also notice the invincibility star.
16/ I also added the ability to subdue and kick away the oncoming koopa-troopa. Seeing it spiraling away in the direction of the nudge was oddly satisfying.
17/ I always wondered what was inside the castle at the end of the original #Mario level. With #AugmentedReality I could now walk in, look around and even see the celebratory fireworks above.
18/ For added performative value, I decided to do it in character. Denim overalls & white gloves from amazon, large yellow buttons I made from wood & a red t-shirt from my closet completed the #DIY look. Made for an interesting early morning subway ride. 
19/ Took about 4-6 weeks from start to finish eventually generating 1.9mn youtube views, 5200 RTs, 7600k likes, 20mn+ fb views, ~100 press articles.
