'

The UX of Great Animation

Понравилась презентация – покажи это...





Слайд 0


Слайд 1


Слайд 2


Слайд 3


Слайд 4

Great UI animation has purpose and style http://img.archiexpo.com/images_ae/photo-g/contemporary-chair-polypropylene-charles-ray-eames-80422-3019841.jpg


Слайд 5

Animating With Purpose


Слайд 6

The Brain Benefits of Animation Reduce cognitive load Prevent change blindness Better recall of spacial relationships Lower perceived load times


Слайд 7

Design Problems Animation Can Solve


Слайд 8

Orientation Reinforce mental models of the interface and show how content is related.


Слайд 9


Слайд 10


Слайд 11


Слайд 12

Guide Tasks By showing cause and effect and cueing current or potential actions.


Слайд 13


Слайд 14


Слайд 15


Слайд 16

Demonstrate Showing how something works or what to expect in a short amount of time.


Слайд 17


Слайд 18


Слайд 19

Direct Attention Leading the eye and calling attention to changes and important items.


Слайд 20


Слайд 21


Слайд 22


Слайд 23


Слайд 24

Going “Faster” Perceived performance gains by 
 transitioning content in.


Слайд 25

“Our findings indicate that the psychological mechanism of transitions is completely different from progress bars”


Слайд 26


Слайд 27


Слайд 28

viget.com/inspire/experiments-in-loading-how-long-will-you-wait


Слайд 29

The Bigger Picture


Слайд 30

Choreography Designing all your UI animations 
 to feel logical and related.


Слайд 31

Similar objects animate in similar ways


Слайд 32

Entrance informs exit


Слайд 33

Match velocities


Слайд 34

Cohesive over consistent.


Слайд 35

Consistent


Слайд 36

Cohesive


Слайд 37


Слайд 38

Be Inspired!


Слайд 39

artofthetitle.com


Слайд 40

capptivate.co


Слайд 41

vimeo.com/channels/wineaftercoffee


Слайд 42


Слайд 43

@vlh uianimationewsletter.com


Слайд 44


×

HTML:





Ссылка: