Zeplin’s CLI tool analyzes your component’s source code entirely locally and only stores a summary on our database, to be displayed to your team. In addition, all the tooling including the CLI and the official plugins are completely open source. Contact us for any questions → Help your team get familiar with your design system. Using Zeplin for Code Handoff. Zeplin is a native app for both Mac and PC, that lets you easily check out all the properties as well as export assets from both.sketch and.psd files. If you don't want to use the dedicated app there is also a web link for the browser that can be used by developers.
Exporting artboards from a Sketch design to Zeplin is quite straightforward. 🚀 To be able to export designs, you need to download the desktop app.
Select any layer/artboard in your Sketch file.
Press ⌃⌘E or use the menu up top “Plugins > Zeplin > Export Selected…” to start export process.
☝️ It's sadly not possible to import Sketch files directly into Zeplin since Zeplin works with a plugin. If you don’t see the plugin in the Sketch menu, you can install it here.
Zeplin shows the file location on the right panel of the screen if you're the user who exported that screen and you're using the same machine that you used to export. You can directly open the design file in Sketch by clicking on the file name.
Next up: Collaborating with your team
Related articles:
Zeplin Sketch Plugin
Developer Handoff with Zeplin Course
Welcome
Take a look at Zeplin
Organizing Assets
Chcek how to organize assets inside Zeplin
Version control in Zeplin
See how powerful the version control in Zeplin can be
Exporting assets
Save images and vectors from Zeplin
Sharing assets
See how to share assets for development
Components
Check out how you can use Symbols from Sketch to create components
Goodbye
That is all for now
- Key Points
- Author
- Source Files
- Who is this course for?
Have you ever been wondering how to introduce successful and effective designer -> developer workflow? Forget about extensive specs and involve tools that will let designers and developers stick to their natural language yet provide a smart way to extracting assets and code from design files. One of the great tools you can use in this process is Zeplin! Let's learn it in a breeze!
- Zeplin - Working techniques
- Working with resources from Sketch
- Developer Handoff
- Version history
- Working natively and in browser
Greg Rog - “My work is all about design, coding and education. For over 10 years I’ve been a professional designer, design lead and UX consultant for companies such as Microsoft or Google. I work closely with Adobe as Community Professional. I also run a software house and a training facility, speak on design conferences and more. I’m curious, passionate and I love sharing knowledge.”
Sketch To Zeplin Tutorial
Sorry, you don’t have access to the project files.
Why don’t you subscribe and get full access throughout the site?
This course is aimed both at designers and developers, who strive to create effective workflow and use the most convenient tools for Handoff. This will be useful in both 1/1 teams as well as in bigger organizations. Or you are a team leader and want to introduce highest standards in terms of designer -> developer culture - this course is also for you!
Reviews (2)