Tweet
Tweet

Slide 1

Slide 1 text

Blink & Marquee Matthew Crist Let’s get it right this time.

Slide 2

Slide 2 text

Matthew Crist @matthewcrist

Slide 3

Slide 3 text

No content

Slide 4

Slide 4 text

Animation

Slide 5

Slide 5 text

:blink:

Slide 6

Slide 6 text

No content

Slide 7

Slide 7 text

:yellow fade:

Slide 8

Slide 8 text

No content

Slide 9

Slide 9 text

Deep engagement social innovation worldwide humanitarian Ford Foundation. Resolve fighting poverty, transform the world international frontline forward-thinking significant carbon emissions reductions. Citizens More

Slide 10

Slide 10 text

Deep engagement social innovation worldwide humanitarian Ford Foundation. Resolve fighting poverty, transform the world international frontline forward-thinking significant carbon emissions reductions. Citizens of change, global health provide, Bloomberg social good social impact advancement informal economies social entrepreneurship. Accelerate fellows treatment vaccines Rosa Parks livelihoods truth. Microloans convener, social equity carbon rights; aid relief promising development focus on impact. The Elders, pathway to a better life empowerment minority refugee community health workers Action Against Hunger. Safeguards sustainable combat malaria thinkers who make change happen sustainability. Measures accelerate progress save the world gender rights working families effectiveness. Visionary overcome injustice fluctuation life-expectancy. Less

Slide 11

Slide 11 text

Deep engagement social innovation worldwide humanitarian Ford Foundation. Resolve fighting poverty, transform the world international frontline forward-thinking significant carbon emissions reductions. Citizens More

Slide 12

Slide 12 text

Deep engagement social innovation worldwide humanitarian Ford Foundation. Resolve fighting poverty, transform the world international frontline forward-thinking significant carbon emissions reductions. Citizens of change, global health provide, Bloomberg social good social impact advancement informal economies social entrepreneurship. Accelerate fellows treatment vaccines Rosa Parks livelihoods truth. Microloans convener, social equity carbon rights; aid relief promising development focus on impact. The Elders, pathway to a better life empowerment minority refugee community health workers Action Against Hunger. Safeguards sustainable combat malaria thinkers who make change happen sustainability. Measures accelerate progress save the world gender rights working families effectiveness. Visionary overcome injustice fluctuation life-expectancy. Less

Slide 13

Slide 13 text

Deep engagement social innovation worldwide humanitarian Ford Foundation. Resolve fighting poverty, transform the world international frontline forward-thinking significant carbon emissions reductions. Citizens of change, global health provide, Bloomberg social good social impact advancement informal economies social entrepreneurship. Accelerate fellows treatment vaccines Rosa Parks livelihoods truth. Microloans convener, social equity carbon rights; aid relief promising development focus on impact. The Elders, pathway to a better life empowerment minority refugee community health workers Action Against Hunger. Safeguards sustainable combat malaria thinkers who make change happen sustainability. Measures accelerate progress save the world gender rights working families effectiveness. Visionary overcome injustice fluctuation life-expectancy. Less

Slide 14

Slide 14 text

Deep engagement social innovation worldwide humanitarian Ford Foundation. Resolve fighting poverty, transform the world international frontline forward-thinking significant carbon emissions reductions. Citizens of change, global health provide, Bloomberg social good social impact advancement informal economies social entrepreneurship. Accelerate fellows treatment vaccines Rosa Parks livelihoods truth. Microloans convener, social equity carbon rights; aid relief promising development focus on impact. The Elders, pathway to a better life empowerment minority refugee community health workers Action Against Hunger. Safeguards sustainable combat malaria thinkers who make change happen sustainability. Measures accelerate progress save the world gender rights working families effectiveness. Visionary overcome injustice fluctuation life-expectancy. Less

Slide 15

Slide 15 text

No content

Slide 16

Slide 16 text

And then…

Slide 17

Slide 17 text

No content

Slide 18

Slide 18 text

Material Design

Slide 19

Slide 19 text

That is the logo for CSS3

Slide 20

Slide 20 text

No content

Slide 21

Slide 21 text

CSS ❤️ Javascript

Slide 22

Slide 22 text

No content

Slide 23

Slide 23 text

Modern design systems must begin to think about and include animation.

Slide 24

Slide 24 text

Animation is a utility.

Slide 25

Slide 25 text

Animation shows relationships.

Slide 26

Slide 26 text

Animation can explain.

Slide 27

Slide 27 text

Animation hides bottlenecks.

Slide 28

Slide 28 text

Less of this.

Slide 29

Slide 29 text

More of this.

Slide 30

Slide 30 text

Prototype early. Prototype often. ↺

Slide 31

Slide 31 text

Some things to keep in mind…

Slide 32

Slide 32 text

Animations should be quick

Slide 33

Slide 33 text

Animations should be non-blocking

Slide 34

Slide 34 text

But wait…There’s more…

Slide 35

Slide 35 text

“As the overlap between interface design and animation grows wider, designers would do well to take note of the many decades of insight and knowledge that animators have accrued. - Khoi Vinh

Slide 36

Slide 36 text

9 Old Men

Slide 37

Slide 37 text

9 Old Men Frank Thomas Ollie Johnston

Slide 38

Slide 38 text

No content

Slide 39

Slide 39 text

Illusion of Life as demonstrated by Vincenzo Lodigiani http://www.centolodigiani.com/117722/3078861/work/the-illusion-of-life http://the12principles.tumblr.com/

Slide 40

Slide 40 text

With great animations comes great responsibility.

Slide 41

Slide 41 text

fin.