Sketch plugin for IBAnimatable

[JakeLin]

Don't know what and how to do? just need to catup some ideas and requirements. Feedback is welcome.

What the others are doing?
https://neonto.com/sketch
http://www.paintcodeapp.com/sketch
https://github.com/Charimon/iosViews
https://github.com/mchoe/SwiftSVG

They may not what we need because all of them are generating code, we need something exports from Sketch and imports into Interface Builder. In short, we will do much better than them. 😉 I haven't seen anyone else doing that now.

[tbaranes]

So, the real goal would be to create a xib / storyboard exactly like the sketch dashboard?
The #32 will be probably a bit similar: parsing of the sketch files... just the final output will differ, but it will be definitely the same plugin.

I think a first question should be asked: is the plugin should change the way to design in sketch (to make easier to convert to IBAnimatable types), and should it be able to export the sketch files and convert everything directly? The second option may be harder since we will have to guess what mask the user is using: is it a circle? Is it a waver or a polygon ?
Also, using the first option may be harder: how to make the difference between a button and a view?

Finally, another big question will be: how to handle every custom path? For example, how to export a mask that IBAnimatable doesn't support? Maybe by creating a custom type specially for that case?

That issue will be a lot of fun 😆

[JakeLin]

#32 is much more ambitious because Framer doesn't need a plugin, it probably read the source of Sketch file and export from file format directly.

@tbaranes All your questions are the difficulties we need to face. I don't have direct answer yet. Sketch designs are some shapes, paths, colors and texts. We don't know how to directly map shape to elements (view or button), I am thinking start with some simple like what Sketch gives us like "Copy CSS Attributes", we can have "Export IBAnimatable Properties" plugin. The user can get all supported "IBAnimatable Properties" (cornerRadius, fillColor ,opacity ...) from Sketch and manually put them in Interface Builder.

Also like what framer is doing, we can use group name to specify element, e.g. "b_Login" for a AnimatableButton.

Just some initial thoughts. Ideas are welcome.

[creativebuild]

Worth checking out https://sympli.io/downloads/xcode

Still a bit of a manual process but can drag all properties of an element in sketch artboard to an element on storyboard.

Xcode plugin looks cool tho, gives interactive preview of artboard.