Tangram Play

Overview

Tangram Play is an interactive text editor for creating maps using Mapzen’s Tangram rendering engine. With Play, you can write and edit map styles and preview the changes live in the web browser. 

Tangram Play is the first in the series of tools at Mapzen, for UI based map styling. It is meant for map designers who want to create more than just a 2D map. With this editor, users can embed code blocks to create animated components and overlay data to create interactive visualizations. For the UI, we drew inspiration from code editors like Sublime Text and CodePen that our users would be familiar with.

WIREFRAMES

Visual design

Creating a new map style

Starting with an existing Mapzen style

Sharing a map style

 

Editing colors

Inspecting the data

Sharing a link

Embedding the map with a code snippet

Full feature demo (late 2016)

Role - Information Architecture, User interviews, Prototyping, Usability testing, Visual design