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

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 storytelling

homestuck.com

rachelnabors.com/blackbrickroad

We don’t need Flash.

emcarroll.com/comics/lizardqueen

hobolobo.net

Telling Stories with Web Technologies

Web Audio API

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

CSS Animations and Transitions

rachelnabors.com/alice-in-videoland/ book

Web Animations API

cdpn.io/PNYGZQ

Scroll Snap

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

Pointer Events

goo.gl/dPoEPG

Filters

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

Light and Detailed images with SVG and Bitmaps

cdpn.io/GDgky

cdpn.io/GDgky

goo.gl/XXcWPo

Flash-like Interaction with Canvas

ncase.me/neurons

Pain Points/Opportunities

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

Lack of Tooling for Creators Pain Point

goo.gl/qbs2n5

Jurassic World Regenesis

google.com/webdesigner

Adobe Edge Animate

Photo Credit: David Berkowitz

Opensource Tooling Opportunity

a spectrum of storytelling

renpy.org

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

JavaScript Frameworks Opportunity

cdpn.io/collection/DgmzgG

Interactive Storytelling Frameworks for the Web?

…and for native! React Native Vue CLI NativeScript

florencegame.com

The Web is the Ultimate Format

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.

goo.gl/hGjFCf

goo.gl/hGjFCf

a spectrum of storytelling

ど う も あ り が と う ご ざ い ま す @RachelNabors .com