https://digitalcomics.co/

skip to main content

  * Standards, Semantics, & Sequential Art
  * Contents
  * Part 1
  * Current Approaches to Digital Comics
  * Panel-by-Panel Presentation
  * The Balak Framework
  * Part 2
  * Embrace the Chaos
  * Viewport variance
  * Viewing conditions
  * The static page metaphor
  * Undermining page-level storytelling
  * Un-semantic blobs
  * Part 3
  * An Alternative Approach to Digital Comics
  * Responsive Layouts
  * Demo: 3-panel strip
  * Demo: 4-panel strip
  * Demo: 3-row, 3-panel layout
  * Demo: 2-row, 4-panel layout
  * Demo: 3-row, 7-panel layout
  * Demo: 3-row, 5-panel layout
  * Demo: 4-row, 11-panel layout
  * Demo: 4-row, 10-panel layout
  * Live Text
  * Demo: Live text word balloons
  * Resolution-independent Artwork
  * Part 4
  * Storytelling implications of digital comics
  * Proof of Concept
  * Toy Planes
  * Notes & Resources
  * Acknowledgements
  * Github Repo for this site

[ ]

version 0.9

Standards, Semantics, & Sequential Art

Toward a Digital Comics Praxis

by Pablo Defendini

Digital comics generally look to the static page as a framework for
designing, laying out, displaying, and reading comics on a screen.
Applying common web design and development techniques to how we make
and display comics on screens can dramatically improve the reading
experience, and also decrease complexity when trying to deliver a
comic across a wide gamut of devices, platforms, and network
conditions.

Naturally, using these techniques will also affect the way comics
creators design their stories. Keeping these technical capabilities
in mind can open up storytelling possibilities that wouldn't be
possible using a static page paradigm.

This site depicts one possible approach to building comics with HTML,
CSS, and SVG, using responsive design techniques. It's meant to be a
starting point for further explorations of the ways in which we can
create and display comics on screens.

I hope that these investigations, and the accompanying
proofs-of-concept, raise new questions, especially from comics
creators, as they explore how using these techniques can change their
storytelling processes. So if you have questions, objections,
suggestions for improvement, ideas for further exploration, or
otherwise want to get in touch, please drop me an email, or ping me
on twitter.

Additionally, the source code for this entire site is available as a
public GitHub repository, both as a way to expose the inner workings
of the examples to anyone curious as to how things work, and as an
invitation to others to create pull requests for improving the work.

  * Standards, Semantics, & Sequential Art
  * Contents
  * Part 1
  * Current Approaches to Digital Comics
  * Panel-by-Panel Presentation
  * The Balak Framework
  * Part 2
  * Embrace the Chaos
  * Viewport variance
  * Viewing conditions
  * The static page metaphor
  * Undermining page-level storytelling
  * Un-semantic blobs
  * Part 3
  * An Alternative Approach to Digital Comics
  * Responsive Layouts
  * Demo: 3-panel strip
  * Demo: 4-panel strip
  * Demo: 3-row, 3-panel layout
  * Demo: 2-row, 4-panel layout
  * Demo: 3-row, 7-panel layout
  * Demo: 3-row, 5-panel layout
  * Demo: 4-row, 11-panel layout
  * Demo: 4-row, 10-panel layout
  * Live Text
  * Demo: Live text word balloons
  * Resolution-independent Artwork
  * Part 4
  * Storytelling implications of digital comics
  * Proof of Concept
  * Toy Planes
  * Notes & Resources
  * Acknowledgements
  * Github Repo for this site