Tools for HTML5 Animation

Tools for HTML5 Animation

A71d39d7553c4a35b81642af73c7061b?s=128

Chaowen Chang

June 27, 2013
Tweet

Transcript

  1. Tools for HTML5 Animation Kojima@CCU CSIE, 2013 13年6⽉月29⽇日星期六

  2. Outline HTML5 Animation Handmade samples Libraries WYSIWYG Tools 13年6⽉月29⽇日星期六

  3. HTML5 Animation HTML5 <canvas> creating flash like animation CSS3 transition

    animation 13年6⽉月29⽇日星期六
  4. Handmade samples 3D NES controller http:/ /codepen.io/Dreamdealer/pen/Clutk CSS only 3d

    Macbook Air http:/ /codepen.io/neoberg/pen/istyp HTML5 Canvas Animation - Oscillation http:/ /jsfiddle.net/N8CVN/ 13年6⽉月29⽇日星期六
  5. Libraries 13年6⽉月29⽇日星期六

  6. KineticJS an HTML5 Canvas Javascript framework animations, transitions, node nesting,

    filtering, layering, caching, event handling for desktop and mobile applications Preview http:/ /jsfiddle.net/DxtAD/ 13年6⽉月29⽇日星期六
  7. Three.js a JavaScript 3D library provides <canvas>, <svg>, CSS3D and

    WebGL renders Preview http:/ /jsfiddle.net/ksRyQ/ http:/ /ppt.cc/3mrZ (Textures) 13年6⽉月29⽇日星期六
  8. CreateJS a suite of JavaScript libraries & tools comprised of

    EaselJS, TweenJS, SoundJS, PreloadJS, and Zoë. Preview http:/ /ppt.cc/Reg5 (EaselJS) http:/ /ppt.cc/czrU (EaselJS+TweenJS) Recommendation CreateJS, ੽ Flash Ց Javascript - ৷ԈᎲ http:/ /blog.eddie.com.tw/2013/05/20/createjs-from-flash-to-javascript/ 13年6⽉月29⽇日星期六
  9. WYSIWYG Tools (What You See Is What You Get) 13年6⽉月29⽇日星期六

  10. Adobe Edge Animate CC Mac OS X / Windows Shareware

    (paid membership of Adobe CC) Robust Flash-like UI and more events control Code is clean and easy to tweak 13年6⽉月29⽇日星期六
  11. 13年6⽉月29⽇日星期六

  12. Tumult Hype Mac OS X Only Shareware ($59.99) easy to

    integrate, lightweight code Preview 2012 ʕ͍༟ʈᐄၣ१ http:/ /www.cs.ccu.edu.tw/~cscamp/site2012/ 13年6⽉月29⽇日星期六
  13. 13年6⽉月29⽇日星期六

  14. Sencha Animator Mac OS X / Windows / Linux Shareware

    ($99) cross-platform, well-documented 13年6⽉月29⽇日星期六
  15. 13年6⽉月29⽇日星期六

  16. DEMO 13年6⽉月29⽇日星期六

  17. Review HTML5 Animation Canvas, CSS3 Handmade samples Libraries KineticJS, Three.js,

    CreateJS WYSIWYG Tools Adobe Edge Animate, Tumult Hype, Sencha Animator 13年6⽉月29⽇日星期六
  18. Any Questions? 13年6⽉月29⽇日星期六

  19. Thanks for listening! 13年6⽉月29⽇日星期六