Transferring Vector from Fireworks to Sketch

I've been loving everything I can see Sketch can do for some time now, and while I love using it when I can, there are still some mobile design layouts and UI elements that were originally made in Fireworks that I go to a lot to build onto for project needs. Anything new I try to create in Sketch, but I still have to crank open FW to complete my workflow at times.

Legacy

Fireworks has been random about even basic features and tools not working ever since I got my Retina Macbook Pro. I’m not sure Marvericks has anything to do with it, but it’s likely because Adobe doesn’t update Fireworks anymore. I’m not interested enough in Adobe to use their Creative Cloud products. The eyedropper tool, highlighting objects, and the text tool seem to be especially broken, and every time I open Fireworks back up it seems like the list of broken tools continues to grow.

Issues with the Obvious Workflow

I figured just moving icons over would be easy and the rest I could really recreate using the new tools as we're using a more simplified UI style than ever. However, I was surprised that copying and pasting vectors right from Fireworks didn't do the trick. So, I thought I'd share what I had to do to possibly help other users adopt this great new tool faster. I tried saving out as an EPS, but Fireworks doesn't even include that as an option, perhaps because it also supports bitmaps.

Solution

Fireworks Save As AI 10
Fireworks Save As AI 10
  • I ended up highlighting the element and saving it as Illustrator 10 file.
  • AI Pixels
    AI Pixels
  • When I first opened the .ai file in Illustrator (admittedly my favorite and only used Adobe product) it didn't not show up as expected, so I assumed it didn't work until I pushed on to the next step.
  • Sketch Icons
    Sketch Icons
  • I copy and pasted the pixels directly from Illustrator into Sketch, and it worked as expected.