• Home
  • Tutorials
  • Videos
  • FAQ
Community

  • Home
  • Tutorials
  • Videos
  • FAQ
    Report trouble

Any trouble with UXPin?

Tell us what's wrong:


How can we help?

Everything you need to succeed in UXPin
    Search
    Home Tutorials Use Cases Sketch imports and Specification

    Sketch imports and Specification

    May 01, 2017 Posted in: Use Cases, Design System Hits: 6673

    sketch_blogpostimage

     

    We know that collaboration between people is crucial to having a successful project, but a good cooperation between the tools is just as important. With the release of Spec mode, we’ve decided to improve the Sketch integration too.

    #1 Handoff to developers

    Now the information about an element such as its height and weight, colors used, text and font is imported from Sketch along with the graphical files. This makes handoff to developers a snap as they get all the properties in one place.

    You can create your visual design in Sketch and then import the elements into UXPin using our Sketch plugin. Once you do, all the crucial details about each of the assets are accessible both in preview and the editor.

    All properties are automatically transferred from Sketch and generated by UXPin.

    You can also create an additional specification for each of the elements to make sure developers know about the right use case or has access to the element code. It will be visible on preview too. All you have to do is enter the Spec mode, click the element and switch the tab from “Properties” to “Specification.” Ta-dah!

    https://www.uxpin.com/community/wp-content/uploads/2017/03/1-3.mp4

    Learn how to do add specification in our detailed Spec mode tutorial.

    #2 Exporting assets from Sketch

    Whenever you import your design from Sketch and use Spec Mode and our Style Guide to handoff the design to the developer, you might notice that each element is treated as a separate asset.

    https://www.uxpin.com/community/wp-content/uploads/2017/03/2-1.mp4

    If you ever need some parts of the design from Sketch to export as a whole to avoid their deconstruction, all you have to do is make them exportable in Sketch and then re-export your design to UXPin.

    artboard

    As soon as you do, this group of parts will be read as one element in UXPin and you can download it as such in our Style Guide. Simple as that! Due to that you and your developer will avoid meticulous positioning of the assets at later stages of the development.

    https://www.uxpin.com/community/wp-content/uploads/2017/03/3.mp4

    And that’s it! Now you can easily collaborate with your developers on your Sketch files, so go ahead and share it with the world!

    Ready to try it in UXPin? Log in to the app!

    Worth reading

    • Imports from Sketch
    • Spec mode
    • Free Flow Documentation
    0 people found this useful.   Login in to Vote Up!
    Not Helpful
    Report trouble
    Contact us: hello@uxpin.com @uxpin

    Login

    Connect with:
    Twitter