Tango

I built a site for Tango developers to create a future in augmented reality.

When:
SEPTEMBER - NOVEMBEr 2016
What:
PROGRAM MANAGER, VISUAL DESIGNER, FRONT-END DEVELOPER
WhERE: developers.google.com/tango (launcHED DECEMBER 2016)

Background:

Google’s augmented reality (AR) platform, Tango, needed a new developer site. The previous site was static and reiterated the AR features that developers already knew. I was approached by the AR User Experience lead at Google to help craft a site that would inspire developers to explore the Tango platform once they had the device.

Left: The old version of the Tango developers site. With only a YouTube video and an unclear user journey, the site needed a major facelift.

Insights:

I sat down with the Tango product team, including the product marketing manager, the partner technology manager, the UX lead, and the VR designer. I tried to map out the user journey of a Tango developer, by studying and talking to the main pockets of the Tango community, such as the G+ community and the Github site.
Developers want a developer website, not a marketing website.

“I don’t need to watch a YouTube video of all the features tango has. I already know that.” “If I already have a Tango device, I already know these features.” 
Sometimes all you need is that one bit of inspiration.

”If I’m developing with Tango, I want to know the realm of possibilities.” “I want to know what i can do with motion tracking.” “I want to meet other Tango developers.”
The user journey I laid out was key to mapping the structure of the site. The developer:
1. Learns about Tango This is where marketing comes in to convince them that they should try out Tango.
2. Buys Tango deviceThis is where the developer makes an investment (💰) by buying the device. They’re already interested.
3. Has a really cool device...but now what? They need to know where to start. This is where we ENTER THE PICTURE.
4. Gets inspired
There are a lot of rad use cases for Tango out there, but finding them is the hard part. we can help.
5. Builds their appScore! They make an awesome and inspiring augmented reality masterpiece.
6. Shares their creationSo why not share with the rest of the class? we connect them with the community.


Building a site for builders who build a future:

My first instinct was to adhere closely to the Tango branding of orange, in order to enforce a cohesive look and feel with the community and the product. I also tried a stepwise progression, with a clearly delineated Step 1, Step 2, etc.

The first wireframe:


The first iteration, while nailing the general order of the aforementioned user journey, felt very boxy and too piecewise, when the essence of Tango isn’t to conform to a linear A-B-C progression. So it would make sense that we needed something more than just solid colors and an ordered list of tasks.

The next round of iterations:

The final mockup:

We used brainstorming techniques to envision what Tango represented. Recurring themes included: the future, creation, possibility, augmented reality, and exploration. I used mind-mapping to connect the galactic theme of space to our mission. Space connoted a whole wide world for the developers to not only create, but to explore through the AR developer community that Tango had built. I applied elements of outer space to the overall look and feel, in order to create a site that was both fun and futuristic.



Because the goal is to inspire and connect developers, I decided to feature Tango partners and different “explorations” of Tango that other community members had created. One constraint I ran into was implementing and coding a site that would be sustainable in YAML.

*Did I mention that this was my first time building a site in YAML? From scratch? (Luckily, there’s nothing I relish more than a good design challenge and learning opportunity!)


What’s next?

The site launched on December 2016. Watch this space!

Other collaborators: Anshuman Kumar (Google / AR UX Lead), William Ito (Google / Partner Technology Manager - Tango), Hena Haines (Google / Product Marketing Manager - Tango), Ian Mesa (Google / Visual Designer), Fiona Herse-Woo (Google / Illustrator), Anthony Rogers (Google / Lead AR Designer), Dan Lazin (developers.google.com / Editor-in-chief), Lauren Dale (Google / Marketing)