SVG-Whiz!

Attention Karen Chance:

My housemate wrote your number down wrong. Please call me again, or write me an email. Sorry, and thanks!.

Drawing Online Comics in SVG

I've got some plans for this page (oh, do I have plans! Mwa-ha-ha), but I'm plenty busy, so you probably will have forgotten all about this page by the time I get around to it. Don't bookmark it. Do not fold, spindle, or mutilate it. It will not be pushed, filed, stamped, indexed, briefed, debriefed, or numbered. Its life is its own.

SVG-Based Comics Panel Layout Experiment

Last year, a couple of friends and I decided to scrounge up a little free time and create an online comic-book, Boffo-Comics. In addition to my creative role in helping develop the plot and the layout, I was appointed Chief Technical Guy, in charge of setting up the Web site, and investigating the best way to actually post comics online.

I pored through other online comics. Most seemed to use the strip format, which wasn't what we wanted to do; instead, we wanted something more akin to a comic book, with large pages and novel layout possibilities. Sadly, the state of the art seemed to be either a nightmare arrangement of tables populated with traditional raster graphics (bitmaps, JPEGs, or even the dreaded proprietary GIF format), or a clever use of Macromedia's Shockwave Flash--again, a proprietary format, with pricey authoring tools and no guarantee that the next version would support our comics. The first arrangement seemed too clumsy, leading to large page file sizes (and slow downloads) and no features like zooming or searching for text, and I didn't like the idea of losing control of our work with Flash.

In a fit of megalomania, I decided to create my own graphics layout language for this purpose: I wanted to decrease file sizes, and allow artists to create imaginative and interesting layout wherein to place panels; I wanted to allow for interactive elements, as well as some facility for sound and animation; I would make a browser or a plug-in to view this content, which would also serve to prevent copying of the images, and create an micropayment infrastructure to allow artists to get paid for their work. All of this, of course, would be available for free; I might charge a bit for the authoring software, but just enough to cover my costs. I would usher in a new era in comics!

In investigating what it would take to bring this to fruition, I discovered Scalable Vector Graphics. What a relief! While it doesn't fit all the above criteria --it doesn't protect the artist's work or help them get paid-- it fit enough of them to shatter my mad dream. Our site is (at least in part) going to be laid out using SVG, so I thought it would behoove me to do a preliminary proof-of-concept. So, I've thrown together a little tutorial series to document my own stumbling efforts to bend SVG to the purpose of making an online comic. I hope this will help those wanting to do something similar.

To view these samples you will need the Adobe SVG viewer. With it, you can zoom in and out, and move the images around, by pulling up the context menu (“right-clicking” on MS Windows systems); for detailed instructions, click Help in the context menu.





Is this page a mess?
Web Standards shift like wind
Please upgrade browsers