Kite Compositor
The UI animation and prototyping app on the Mac
Start new thread
Joe Rhodes

Kite Compositor - A UI animation and prototyping application for Mac & iOS

by
Kite Compositor
•

Kite is a native animation and prototyping design tool for the Mac. It features an intuitive timeline editor, WYSIWYG canvas, and a robust scripting interface. The iOS companion app, Kite Compositor for iOS, allows you to interact with your Kite designs right on your iPhone or iPad.

Add a comment

Replies

Best
Daniel.
Awesome. Reminds me a lot of Principle. Besides the UI, are there any other differences between this and Principle? In other words, whats the case for me to switch over from Principle to use this?
Joe Rhodes
Maker
@danielrakh Thanks for checking it out, Daniel! I think the major differences between Kite and Principle is the focus on the timeline-based animation and the ability to use the JavaScript scripting environment to enhance interactions with custom logic.
Abhinav Chhikara
@danielrakh there's also custom movement paths, more control over designing within Kite and a bunch of smaller stuff, from what I can tell from the landing page!
Catalin Pop
Impressive. Is there a way to export those animations to the real app?
Joshua Pinter
@catapop84 ^ This right here. One of the biggest additions that Framer.com just added. Edit: Wait, just checked out Framer again and not convinced it actually copies the animation code, just the settings like tension and friction. Haven't tried it yet, tho.
Joshua Pinter
@spshulem @catapop84 Do you know if Origami exports to React Native's Animated format?
Joe Rhodes
Maker
@catapop84 Hey Catalin – You can use the KiteKit framework to embed and play .kite documents in your own iOS or macOS apps just as they appear in the desktop app.
Paul Martens
@catapop84 you want to look at QuartzCode and CoreAnimation....both available on the App Store. However, I can't vouch for both fully as I haven't tried the Kite framework yet.
Jamie Shoard
Excited to give this a proper go. Looks incredibly powerful. Principle really got me hooked because of it's learning curve and the fact it did 1 type of prototype extremely well. For me, my thinking has always been along the lines of 'if you cant recreate the whole prototype from scratch in an hour, you're probably building out too much'... because the nature of the iterative process, i don't like to spend huge amounts of time building a prototype when the designs should be changing day to day. Definitely could do with some tutorials and basic lessons to get started, especially as I only have 14 days to decide. Couple of small bits: - It's running pretty laggy on my 2017 MBP - Vertical/Horiz align are probably my most used tools, had to root around to find them in the toolbar - I kiiiind of understand why, but having the default anchor point top-left just reminds me of the hours i used to spend in AE moving them to centre (this also makes vert/horiz align pretty frustrating!) - Havent figured out how to add the iphone frame to a blank doc if i dont start from template - Pushing people to open the examples templates on first launch would be useful (I mean the example projects, rather than just the phone frames) - Touchbar timeline is neat, but a bit odd that it only relates to the portion on screen, meaning i cant scrub through from start to finish... maybe this would get too sensitive, but 4:10 is quite a long default timeline anyhow..? Overall, looks like it could be huge! Definitely just need to start with some basic tutorials if you're to convert the masses from their scattered tools of choice. Bit gutted that by the time some of these lessons come out my trial might be over and i'd not be ready to commit $99
Arroisi
@jamie_shoard is the result only animation like origami or touchable hotspot like framer.js or invision?
André J
@aroro__ @jamie_shoard User interruptible animation?
Joe Rhodes
Maker
Excited to finally share this to a wider audience!
Bady
@jrho Hi Joe, is there any tutorial for this? would love to try it
Jesse Wallace
@bady_qb @jrho I agree - a tutorial is greatly needed. I have used principle before, and I picked it up right out of the box. I'm thoroughly confused by this product.
Joe Rhodes
Maker
@bady_qb Many have been asking for tutorials. I'm going to put together an introductory tutorial soon to help people get the feel for using the app.
Sunny Nagra
Hey @jrho , this looks amazing! Would love if it was able to export the animation in something like Swift, allowing easy integration of the coop animations into the app.
Joe Rhodes
Maker
@snagra_ I appreciate the nice words Sunny! Since first showing it to people, many have asked for a code-level export feature similar to what the app PaintCode has done for Core Graphics code. I think this is very interesting idea and will probably explore further if users would find this sort of thing useful.
Sunny Nagra
@jrho would be an instant buy for me with that. Keep up the great work
Nick Wientge
@jrho @snagra_ Lottie support (http://airbnb.design/lottie/) would be amazing!
André J
@nwientge @jrho @snagra_ Or just generate code that utilize UIViewPropertyAnimator ^^
Noah Kim
Looks really neat. Love the Framer-esque scripting + Timeline. Big question for me is, does this do flows or just animation on single views? That's usually the make and break for me when it comes to solutions like this. Having to use 2 separate programs to prototype flows and UI animation is not only cumbersome, but it doesn't really make sense from a workflow perspective.
Kunal Bhatia
Lot of great thinking here @jrho! Was particularly drawn in by the vector capabilities to create custom animations. What types of prototypes do you see Kite excelling at compared to other tools?
Joe Rhodes
Maker
@kunalslab Thanks for the kind words Kunal! Many of the animatable properties in Kite do correspond to vector-based changes. For example, animating between two bezier paths on a Shape Layer will interpolate the path's point positions over the animation's duration. Right now, I believe Kite excels as complex animations that involve multiple hand-tuned animation values that involve specific timing – one after another. It can be used for "birds-eye" flows through an app, but is kind of overkill for only that use.
Bryan Maniotakis
Looks pretty robust! I'd love to see a couple small tutorial videos to get an idea of the workflow.
Maksim Petriv
Anyone else experiencing click actions not working? Unless I am missing something in the trial.
Chris Slowik
@talkaboutdesign Have you added your action to a visible layer as a child? What do you mean by "not working". Is it not firing animations or what?
Paul Martens
@chrisslowik glad to see creativeDash already using the product :)
Chris Slowik
@paulmartens Whoops, gotta update my headline! Loved every minute doing interaction design at CD, but recently went off on my own to launch a design learning platform. We're actually working on a bunch of kite content already =] Anyway, I highly highly recommend this app, and I assure you I would be using it for my work at Creativedash too.
Paul Martens
@chrisslowik that's why I remember you! I got an email this morning from designers.how talking about kite. That's what prompted me to go to pH. I'll watch your lesson later this afternoon.
JS
Awesome!!!
1234
Next
Last