Maveco
Maveco

 

Code.

Code RSS rss feed icon

Subscribe to the Maveco Code RSS feed.


 

Post

Zeplin

Zeplin logo

 

Zeplin is a great way to hand over design work to developers without having to make a build book. It works seamlessly with Sketch and saves all your mark up to the cloud.

Best of all it outputs all .PNG assets as 1,2 or 3x, all pixel perfect.

 

Zeplin screen shot

 

Am still trying to validate its effectiveness for Native apps, which is three different mobile operating systems, for around 10 different screen sizes, ratios, and both orientations.

Most new application design is around adaptive layouts, where there are not so much actual fixed measurements, rather everything is proportional to a base, which much like responsive, but then constraints and stretch points are specified.

Pros and cons:

Pros:

  • 1 click solution (ish)
  • Browser/Cloud-based
  • Everything is marked up
  • Assets can be outputted at 1x 2x and 3x

Cons:

  • All Sketch files need to be pixel perfect, as everything is marked up
  • Just does sizes and spacing
  • Assets are not always perfect

Design handoff is about getting the best out of the 3rd party who builds the code based on your design. There is no 1 click solution (at this moment in time) for native apps.

A delivery remit is based around a different set of quite technical and political variables.

Is surprising, for what is perceived as technologically advanced, native apps are proprietary and rarely follow a design framework. And the guys who build them don’t have a super cool front end dev to craft the CSS. So the handoff is quite old fashioned, as unless your dev knows Photoshop then you need to communicate how to build a layout in a document.

If you mark up a globals doc with grid, colors, spacing rhythm and typography, then most of your markup is done. Then you custom markup only the changes. This is lean and super agile.

Anyway check out the demo and decide for yourselves:

 


Related External Links

Zeplin

Demo - asset export using Zeplin


Code - Similar Posts