4 ms·
If the code is modular enough, would you mind open sourcing it (or blogging about how you developed it)?
by davidwparker 13y ago
If the code is modular enough, would you mind open sourcing it (or blogging about how you developed it)?
- benjamindc 13y agoThe code has been specifically made for that particular animation and, to be fair, it wasn’t even modular enough for my own needs :D Joking aside, I’d love to blog about it and more generally about animations in UIs.
- cmapes 13y agoYou really should do a blog post about it, the first thing I did after admiring the animation was pull open the inspect panel to see how it was done haha. I would love to read more about it.
- skilbjo 13y agoI did that as well! Beautiful stuff, good on the developer.
- benjamindc 13y agoSo, the technical part isn’t that crazy tbh — as soon as you respect some pretty straightforward principles you should be fine (animate only transform/opacity, favour requestAnimationFrame over setInterval, transitionend/animationend events over setTimeout, …). The complicated part was mostly the “creative” process, ie. how fast should the animation run (some people read, others don’t), what's the appropriate bezier-curve, how make the play button “engaging” enough so people don’t feel like they’re gonna watch a billion-hour screencast, etc.
- mikeg8 13y agoFantastic stuff. My first experiences in digital design were from the video side so I used to do keyframe animations in Final cut pro, Apple's Motion, and After Effects. Seeing experiences/animations on par with video using just the DOM is very very exciting for me and can't wait to see your post when you get around to it.
- mattmanser 13y agoGreat job, it's the best HTML5 animation I've seen so far that doesn't stutter like crazy on this (admittedly underpowered) laptop. And it does a great job at actually communicating exactly what you wanted it to, which is also an uncommon skill.
- Flenser 13y agoI wanted to read more of the screens, a way to pause it would have been nice.
- oulipo 13y agoI wrote a post about doing animations using Sketch and d3.js, you might find it interesting http://snips.net/blog/posts/2014/01-10-fast-interactive_prototyping_with_d3_js.html http://snips.net/blog/posts/2014/01-10-fast-interactive_prot...
- novaleaf 13y agohonestly, they should opensource the checkout.js code, not just the demo
- amitamb 13y agoProbably not exactly similar to what Stripe did but I recently released a tool for creating demos http://www.castbin.com/ http://www.castbin.com/ Would like to get feedback on what you really liked about Stripe experience and how to improve Castbin.