Главная
Study mode:
on
1
Introduction
2
Saccade
3
Why is this important
4
Animation gets a bad rap
5
Invisible Animation
6
Cognitive Leaks
7
UX Pattern
8
Isolation
9
Modals
10
Brute Force UX
11
Investigate modal
12
Bake animation into an experience
13
Use case Barcelona
14
Do you hate animation
15
Animation can be informative
16
Animation needs a hero
17
React Motion
18
Bouncy Ball Demo
19
Form Loader
20
Perceived Performance
21
Capturing Attention
22
Spatial Awareness
23
Code Drops Demo
24
Drag Drop Demo
25
Performance
26
Performance Demo
27
Netflix
28
Immersive Animation
29
SVG
30
SVG Pros
31
Responsive SVG
32
Performance hits
33
GreenSock
34
Timeline
35
Timeline Demo
36
SVG DOM
37
Responsive Design
38
Accessibility
39
Hipster Elephant
40
Web Technologies
Description:
Explore functional animation in web design through this CSSConf.Asia 2016 talk by Sarah Drasner. Discover how carefully considered animations can enhance user experience, guide users through spatial maps, and make sites function intuitively. Learn about various use cases for animation, from design principles to technical implementation. Gain insights into topics such as saccade, invisible animation, cognitive leaks, UX patterns, modals, and brute force UX. Examine real-world examples, including a use case from Barcelona, and explore technologies like React Motion. Delve into concepts such as perceived performance, capturing attention, spatial awareness, and immersive animation. Investigate SVG animation techniques, responsive design considerations, and accessibility concerns. Benefit from Drasner's extensive experience as an award-winning UX Design and Engineering Manager, Frontend Masters workshop instructor, and CSS-Tricks staff writer.

Functional Animation

JSConf
Add to list
0:00 / 0:00