The Future of HTML5 Motion Design
•Download as PPTX, PDF•
2 likes•1,160 views
The document discusses emerging web animation technologies including Adobe Edge and CSS Shaders. Adobe Edge allows for motion and interaction design using HTML5, CSS and JavaScript, and outputs animations that perform well across devices. The latest Edge preview release includes new features like symbols, clipping and font support. CSS Shaders is a new technology that brings cinematic visual effects to the web by enabling more advanced capabilities in browsers. The document advocates that Adobe wants to help creators by providing animation tools that work across current and future browser standards.
Report
Share
The Future of HTML5 Motion Design
- 1. The Future of HTML5 Motion Design
- 2. Who Are You?
- 3. ANIMATION
- 4. HTML JS CSS animation is very capable
- 5. Prove it!
- 7. ADOBE EDGE
- 8. • Motion and interaction design for open standards • Build with HTML5, CSS, JavaScript Adobe • Precise, productive and performant Edge • Output performs well on devices
- 9. Demo Punchy
- 10. Examples
- 12. • Symbols – Timelines within timelines • Clipping – Revealing pieces of Preview 4 complete animation • Font Face Features – Ability to pull in web fonts
- 13. Demo Punchy
- 14. Next Steps with Edge • Get Edge – http://labs.adobe.com/technologies/edge/
- 15. CSS SHADERS
- 17. What if browsers could do more?
- 19. Cinematic effects for the web
- 20. Examples
- 21. Next Steps with CSS Shaders • Coming to browsers soon.
- 22. CONCLUSIONS
- 23. Web creators live in three worlds
- 24. The Past The Present The Future
- 25. Adobe wants to help (Near) Present Future • Adobe Edge • CSS Shaders – Animation – Make browsers do more – HTML/JS/CSS – Works across available browsers
- 26. Follow up? • Preso will be up at – http://slideshare.net/tpryan • Feel free to contact me – terry.ryan@adobe.com – http://terrenceryan.com – Twitter: @tpryan
Editor's Notes
- Designer?Developer?Both?jQuery?jQuery Mobile?PhoneGap?TypeKit?Adobe Edge?