Creating Web Animations: Bringing Your UIs to Life

Creating Web Animations: Bringing Your UIs to LifeReviews
Author: Kirupa Chinnathambi
Pub Date: 2017
ISBN: 978-1491957516
Pages: 210
Language: English
Size: 19 Mb


Thanks to faster browsers, better web standards support, and more powerful devices, the web now defines the next generation of user interfaces that are fun, practical, fluid, and memorable. The key? Animation. But learning how to create animations is hard, and existing learning material doesn’t explain the context of the UI problem that animations are trying to solve. That’s where this book comes in.
You’ll gain a solid technical understanding of how to create awesome animations using CSS and learn how to implement common UI patterns, using practical examples that rely on animations to solve a core problem. Frontend web developers and designers will not only learn important technical details, but also how to apply them to solve real-world problems.

  • Create animations found in common user interface implementations, such as bounce after scrolling, expanding search boxes, and content sliders
  • Learn the technical details of working with CSS animations and transitions
  • Use CSS transforms to very animate an element’s position, scale, and orientation
  • Understand the importance of easing

Table of Contents

Part I. The Basics
1. Introduction to Web Animations
2. Introduction to CSS Animations
3. Introduction to CSS Transitions
4. Working with CSS Timing Functions
5. Ensuring Your Animations Run Really Smoothly
6. Transitions, Animations, and JavaScript
7. CSS Animations Versus CSS Transitions

Part II. Learning from Examples
8. Animating Your Links to Life
9. Simple Text Fade and Scale Animation
10. Creating a Smooth Sliding Menu
11. Scroll-Activated Animations
12. The iOS Icon Wobble/Jiggle
13. Parallax Scrolling
14. Sprite Sheet Animations Using Only CSS
15. Creating a Sweet Content Slider
16. Conclusion