Web Animation using JavaScript: Develop & Design

Book Description

We’ve come a long way since the days of flashing banner ads and scrolling news tickers. Today, the stunning motion design of iOS and Android dramatically improves a user’s experience – instead of detracting from it. The best sites and apps of today leverage animation to improve the feel and intuitiveness of their interfaces. Sites without animation are starting to feel antiquated.

This book provides you with a technical foundation to implement animation in a way that’s both visually stunning and programmatically maintainable. Throughout, we consider the balance between enriching a page with motion design while avoiding unnecessary flourishes

Readers will learn how to design loading sequences that ensure users stay fully engaged instead of tuning out, how to leverage simple physics principles to make apps respond naturally to users’ input (just like motion behaves in the real world), how to exploit CSS transforms to create rich depth in animations, and how to fully leverage JavaScript animation libraries like Velocity.js to streamline animation programming. From animation performance to theory, we cover everything needed to become a professional web animator. Whether you’re a novice or professional web developer, this book is for everyone.

Why is all of this so important? Why is it worth your time to become a professional motion designer? For the same reason that designers spend hours perfecting their pages’ font and color combinations, motion designers perfect their animations’ transition and easing combinations: Refined products feel superior. They leave users whispering to themselves, “Wow, this is cool”, right before they turn to a friend and exclaim, “You gotta try this.”

Table of Contents

Chapter 1. Advantages of JavaScript Animation
Chapter 2. Animating with Velocity.js
Chapter 3. Motion Design Theory
Chapter 4. Animation Workflow
Chapter 5. Animating Text
Chapter 6. Scalable Vector Graphics Primer
Chapter 7. Animation Performance
Chapter 8. Animation Demo

中文：

书名：使用JavaScript的网络动画：开发和设计

与闪烁横幅广告和滚动新闻滚动条的日子相比，我们已经走过了很长一段路。今天，iOS和Android令人惊叹的动作设计极大地改善了用户的体验，而不是降低了用户体验。当今最好的网站和应用程序利用动画来改善其界面的感觉和直观性。没有动画的网站开始感觉过时了。

这本书为您提供了一个技术基础，使您能够以一种既视觉上令人惊叹又可编程维护的方式来实现动画。自始至终，我们都在考虑用动作设计丰富页面和避免不必要的夸张之间的平衡

读者将学习如何设计加载序列以确保用户保持完全投入而不是疏忽，如何利用简单的物理原理让应用程序自然地响应用户的输入(就像现实世界中的运动行为一样)，如何利用CSS转换来创建丰富的动画深度，以及如何充分利用Velocity.js等JavaScript动画库来简化动画编程。从动画表演到理论，我们涵盖了成为专业网络动画师所需的一切。无论你是新手还是专业的网络开发人员，这本书都适合所有人。

为什么所有这一切都如此重要？为什么花时间成为一名专业的动作设计师是值得的？出于同样的原因，设计师花了几个小时来完善页面的字体和颜色组合，运动设计师则完善了动画的过渡和缓和组合：精致的产品感觉更优越。它们让用户低声自语，“哇，这太酷了”，然后他们转向一个朋友，惊呼道，“你一定要试试这个。”

目录表

第1章.JavaScript动画的优势
第2章.使用Velocity.js设置动画
Chapter 3. Motion Design Theory
第4章.动画工作流
第5章.动画文本
第6章：可伸缩矢量图形入门
第七章.动画表演
第8章.动画演示