Creating Web Animations: Bringing Your UIs to Life

Chinnathambi, Kirupa
Rs.550.00
Reward points: 6 points
9789352135226
In stock
Please sign in to buy

This product cannot be added to the
cart because you are not logged in.

Buy now with 1-click Add to wish list Add to comparison list

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 Content

Chapter 1Introduction to Web Animations

What Is an Animation?

Chapter 2Introduction to CSS Animations

Creating a Simple Animation

What Just Happened

The Longhand Version

Conclusion

Chapter 3Introduction to CSS Transitions

Creating a Simple Transition

What Just Happened

The Longhand Version

Conclusion

Chapter 4Working with CSS Timing Functions

What Is a Timing Function?

Timing Functions in CSS

Conclusion

Chapter 5Ensuring Your Animations Run Really Smoothly

What Is a Smooth Animation?

Creating Responsive 60 fps Animations

Conclusion

Chapter 6Transitions, Animations, and JavaScript

It’s Just Property Changes

A Tale of Two Styling Approaches

Animating with requestAnimationFrame

Conclusion

Chapter 7CSS Animations Versus CSS Transitions

Similarities

Differences

Conclusion

Learning from Examples

Chapter 8Animating Your Links to Life

The Starting Point

Animated Underline

Simple Background Color Change

Cooler Background Color Change

Conclusion

Chapter 9Simple Text Fade and Scale Animation

The Example

Conclusion

Chapter 10Creating a Smooth Sliding Menu

How the Sliding Menu Works

Creating the Sliding Menu

Conclusion

Chapter 11Scroll-Activated Animations

The Basic Idea

Building It All Out

Conclusion

Chapter 12The iOS Icon Wobble/Jiggle

The Full HTML and CSS

Deconstructing This Effect

Looking at the CSS

Faking Randomness

Conclusion

Chapter 13Parallax Scrolling

Overview of How the Parallax Effect Works

Getting Started

Conclusion

Chapter 14Sprite Sheet Animations Using Only CSS

Creating the Sprite Sheet

Conclusion

Chapter 15Creating a Sweet Content Slider

Overview of How It Works

The Content

Clipping the Content

The Navigation Links

Making the Content Actually Slide

Understanding the Code (and More!)

Conclusion

Chapter 16Conclusion

Until Next Time

Author:
Chinnathambi, Kirupa
Binding:
Paperback
Condition Type:
New
Country Origin:
India
Edition :
1
Leadtime to ship in days (default):
1
Page:
212
Publisher:
Shroff/O'Reilly
Year:
2017

No posts found

Write a review