Advanced Techniques for Web-based Comics @RachelNabors .com a - - PowerPoint PPT Presentation

▶
advanced techniques for web based comics
SMART_READER_LITE
LIVE PREVIEW

Advanced Techniques for Web-based Comics @RachelNabors .com a - - PowerPoint PPT Presentation

Mar 14, 2024 388 likes •1.02k views

Advanced Techniques for Web-based Comics @RachelNabors .com a spectrum of storytelling a spectrum of storytelling madefire.com goo.gl/1o8zZu Storyboard for Ferdinand the Bull taken at the Disney Family Home Museum a spectrum of

slide-1
SLIDE 1

Advanced Techniques for Web-based Comics

@RachelNabors

.com

slide-2
SLIDE 2

a spectrum of storytelling

slide-3
SLIDE 3

a spectrum of storytelling

slide-4
SLIDE 4

madefire.com

slide-5
SLIDE 5

goo.gl/1o8zZu

slide-6
SLIDE 6

Storyboard for Ferdinand the Bull taken at the Disney Family Home Museum

slide-7
SLIDE 7

a spectrum of storytelling

slide-8
SLIDE 8

homestuck.com

slide-9
SLIDE 9

rachelnabors.com/blackbrickroad

slide-10
SLIDE 10

We don’t need Flash.

slide-11
SLIDE 11

emcarroll.com/comics/lizardqueen

slide-12
SLIDE 12

hobolobo.net

slide-13
SLIDE 13

Telling Stories with Web Technologies

slide-14
SLIDE 14

Web Audio API

slide-15
SLIDE 15

css-tricks.com/introduction-web-audio-api

slide-16
SLIDE 16

CSS Animations and Transitions

slide-17
SLIDE 17

rachelnabors.com/alice-in-videoland/ book

slide-18
SLIDE 18

Web Animations API

slide-19
SLIDE 19

cdpn.io/PNYGZQ

slide-20
SLIDE 20

Scroll Snap

slide-21
SLIDE 21

newinweb.com/2018/09/06/css-scroll-snap

slide-22
SLIDE 22

Pointer Events

slide-23
SLIDE 23

goo.gl/dPoEPG

slide-24
SLIDE 24

Filters

slide-25
SLIDE 25

iamvdo.me/en/blog/advanced-css-filters

slide-26
SLIDE 26

Light and Detailed images with SVG and Bitmaps

slide-27
SLIDE 27

cdpn.io/GDgky

slide-28
SLIDE 28

cdpn.io/GDgky

slide-29
SLIDE 29

goo.gl/XXcWPo

slide-30
SLIDE 30

Flash-like Interaction with Canvas

slide-31
SLIDE 31

ncase.me/neurons

slide-32
SLIDE 32
slide-33
SLIDE 33

Pain Points/Opportunities

slide-34
SLIDE 34
slide-35
SLIDE 35
slide-36
SLIDE 36

Flash: losing the Web since 2010 apple.com/hotnews/thoughts-on-flash

slide-37
SLIDE 37
slide-38
SLIDE 38
slide-39
SLIDE 39
slide-40
SLIDE 40
slide-41
SLIDE 41

Pain Point Lack of Tooling for Creators

slide-42
SLIDE 42
slide-43
SLIDE 43

goo.gl/qbs2n5

slide-44
SLIDE 44

Jurassic World Regenesis

slide-45
SLIDE 45

google.com/webdesigner

slide-46
SLIDE 46

Adobe Edge Animate

slide-47
SLIDE 47

Photo Credit: David Berkowitz

slide-48
SLIDE 48

Opportunity Opensource Tooling

slide-49
SLIDE 49

a spectrum of storytelling

slide-50
SLIDE 50

renpy.org

slide-51
SLIDE 51

itch.io/games/top-rated/made-with- renpy

slide-52
SLIDE 52

Opportunity JavaScript Frameworks

slide-53
SLIDE 53

cdpn.io/collection/DgmzgG

slide-54
SLIDE 54

Interactive Storytelling Frameworks for the Web?

slide-55
SLIDE 55

…and for native!

Vue CLI React Native NativeScript

slide-56
SLIDE 56
slide-57
SLIDE 57

florencegame.com

slide-58
SLIDE 58

The Web is the Ultimate Format

slide-59
SLIDE 59

What the Web Means for Storytelling

  • APIs for sound, motion, and interaction fully replace Flash.
  • Opensource JavaScript Frameworks provide a

maintainable format.

  • The stability of the Web platform means its content will be

readable for generations.

slide-60
SLIDE 60

goo.gl/hGjFCf

slide-61
SLIDE 61

goo.gl/hGjFCf

slide-62
SLIDE 62

a spectrum of storytelling

slide-63
SLIDE 63

@RachelNabors

.com

ど う も あ り が と う ご ざ い ま す