Check out SuperNova. Their awesome team is solving this exact problem. They are a Sketch companion app that takes sketch files and imports them , then gives you the ability to set all kinds of responsive rules, create transitions, scroll views, mess with containers & tables, create animations, link screens, etc....and when you're finished you can export to swift, studio or react- 100% usable code. Currently they are in v4 beta, but ive used it and it works really well.

he literally wanted places for inspiration, you missed the point completely. User testing is 100% separate from looking at how other individuals and companies solved problems.

If it’s animation parameters you are looking for, then Diya exports “Animation Specs” for iOS, Android and Web. When you hit ‘Export’ on Diya’s bar, you’ll get 2 HTML files - one is for the prototype and the other is for your animation specs. At the bottom, you’ll see options for Apple SDK, Android SDK and Web.<

Ah ok. i wasnt sure what the output specs were without using this yet. I saw HTML and thought you had initially only made this for web or web app output of some kind. Good to know :)

That would definitely help the day to day yes. As far as Lottie, i replied to a users comment re: exporting Json. I think having those animations (or at least the more complex ones) with the ability to inject them into js is what most people are aiming for (id assume anyway).

Excited to see where this goes.

There's a bit more than animation values that we use when exporting from Framer. I never said native code, what i meant was code we can work with on some level. i wouldnt say 'far' from production ready.

One reason might be if lets say there was a shape morph or other complex transition and you wanted to use the json in something like Lottie which would wrap that in js so you can control it. Its great to have output in html, but alot of what people will use this for is most likely mobile, so the output formats should reflect that (as a later update).

"I did hit a wall once I tried to animate something with more than one transition. For instance when trying to animate page transitions on a web design so that images and text animate in different ways. I have not found a way to achieve these more complex motions. Maybe you could provide a tutorial demonstrating something like this.

You know if there were some way to implement the ability to set keyframes in the timeline and drag the object into position like in AE (rather than duplicate artboards) this would be a game changer. Just a thought."<

^{^} This is basically what i meant in my comment above. The incorporation of actual animation tools found in AE with this plugin would be golden. Alot of times you dont need to have a completely new artboard just to make a transition.

Sure. So, as an example, right now when i prototype, I use one of three things:

• Principle: its great for quick prototypes and gives me alot of options for 'realistic' behaviors and animations. Downside is no code export. Id also like to see some better timeline animation tools and logic from them (EG you cant scrub through a timeline etc)

• Framer: framer is a good mix between design and code especially with their new Studio app. I can export code for most applications- works best for web/web app stuff. Downside is there is a bit of coding knowledge required (the more you use CoffeeScript the easier it gets however). There is also no timeline based animation, so things you'd expect to have logic in one program operate a bit differently in Framer. EG if you wanted to expand a card to a full screen takeover, it wouldnt use two artboards- it would use one, and just expand it. While i dont mind this logic, i also get confused sometimes 'when is the best time to use multiple artboards vs just one'

• After Effects: i dont really 'prototype' with this- i use it for animations. I create the animation, then use BodyMovin.js to export the json. The Json then goes into Lottie (which is amazing if you havent used it yet) and we can control the json (svg and img) objects on a native level. This saves developers a huge amount of time trying to animate complex things, paths, curves etc and is dev ready. I do like the AE timeline tools, but the program really isnt designed for mobile/web, its for animation.

Ive also tried Haiku- this aims at combining an AE like timeline with Framer like code parameters. Thusfar, i havent been impressed. Lots of users complain about bugs and the complexity of either importing their Sketch templates, or animating elements within the program. Im going to hold off on this because it seems like more work than its worth right now and they need to improve the software.

WIth all of these above, we normally hand off assets from Sketch or PS through InVision (static comps) which are the specs. For prototypes, sometimes we will give them a prototype file to replicate (if its simple enough) and sometimes I will make it in Framer or AE (animations, transitions etc) but there are times when additional front end work is needed to tweak those. We are on IOS and Android as well as mobile web (webapp).

All in all, we use Photoshop/Sketch day to day here at Wag!...so having this plugin do the work of AE while keeping Sketch like mobile/web centric tools would be great.

Im really excited to see how robust you are going to make this thing :) Thanks!

Are there any plans to have IOS/Android exporting support? at Wag! we are mainly mobile focused but having an all-in-one program like Sketch with a timeline would work wonders for our design-to-development process :)

I love what you've done btw, keep it up!