Tangram UI design toolkit

Sketch libraries managed through design versioning tool Abstract.

Our design toolkit had to be able to allow designers to easily create high fidelity prototypes across breakpoints. Matching the behaviour and states of components as closely as possible to their live code counterparts was important to give designers and developers confidence when planning and scoping work.

Separating out the platform agnostic foundations – colour, layers, spacing, typography and icons allowed for us to expand our libraries to integrate them with our newly developed Android and iOS UI libraries.

Building and maintaining tooling in Sketch for designers at Trade Me using Tangram to build the new-look Trade Me site.

Providing variations that occur when different API options are applied to a component in a scannable way for designers.

Building on the great work of Sean Van Oossanen, and Zac Sanderson-Harris.

Previous
Previous

Tangram design system site

Next
Next

Modal design pattern workshop