SketchXD
>

Design in Sketch - Prototype in Adobe XD

Juan Maguid 
14 nov 2017

Read on if a) you are in the somewhat privileged situation of having a Sketch license and b) a Adobe CC membership. And c) you don’t feel like paying a cent more for d) InVision or Marvel or other prototype app.

Yup that’s right. A colleague of mine shared this brilliant “hack” with me and I was like “why haven’t I thought 💭 about this before — it’s bloody brilliant 😋🤘🌈 (Thanks Karin H)

The workflow goes like this

  • Design in Sketch
  • Export each artboard as a .PNG — Depending on your output from Sketch use @1x or @2x
  • XD: Create first one artboard in correct dimensions, then copy paste as many times as you have exported Sketch artboards
  • Paste one PNG/artboard per canvas
  • Go into Prototype mode (Ctrl + Tab)
  • Prototype like a PRO 🤳
  • Upload to Adobe Cloud from XD
  • Share the link to your client — they can even comment on your designs
  • Rock on 🤘

Pros

  • XD is super super fast (and a native app)
  • You can work offline up until you need to share your prototypes
  • Work on Mac or Windows with your prototype. Or both!
  • Using Invision/Craft tends to clutter your Sketch design files — not anymore!
  • Save time by choosing “Previous Artboard” in the XD prototype mode if you have a “home” or “back” button

Cons

  • Updating your screens takes a few more seconds than other solutions

This article was originally published here.