I'm not an art history major. But I started my pixel art education with an Atari 2600 and interruption-free afternoons as an only-child in the Georgia suburbs.
As an adult, I eventually lived in an apartment with tall blank walls and started pasting up my own pixel art portraits with Post-it notes. One afternoon, halfway up a ladder I wondered how I could do it all in a web browser?
Strictly speaking, pixel art is a matrix of items arranged via a pre-determined design. The items themselves need only a 2D location, 2D scale and color. Even the earlist web browsers could handle such a task.
This talk tells the story of how I arrived at a browser-based, pixel art rendering solution called Bit-Shadow Machine. From Post-its, to Legos to a few JS framework attempts, we'll see several steps in the process. Finally, we'll see how easy it is to render 60fps, frame-based or particle-based animated pixel art with just JS, CSS and the DOM.
We'll also see how to use JavaScript to re-interpret the pixel art we create in the browser as full-motion HD video.
mikeal
commented
10 years ago
I'm not an art history major. But I started my pixel art education with an Atari 2600 and interruption-free afternoons as an only-child in the Georgia suburbs.
As an adult, I eventually lived in an apartment with tall blank walls and started pasting up my own pixel art portraits with Post-it notes. One afternoon, halfway up a ladder I wondered how I could do it all in a web browser?
Strictly speaking, pixel art is a matrix of items arranged via a pre-determined design. The items themselves need only a 2D location, 2D scale and color. Even the earlist web browsers could handle such a task.
This talk tells the story of how I arrived at a browser-based, pixel art rendering solution called Bit-Shadow Machine. From Post-its, to Legos to a few JS framework attempts, we'll see several steps in the process. Finally, we'll see how easy it is to render 60fps, frame-based or particle-based animated pixel art with just JS, CSS and the DOM.
We'll also see how to use JavaScript to re-interpret the pixel art we create in the browser as full-motion HD video.
If you'd like to check out a recent talk, I spoke at JSConf EU 2013 in Berlin on Simulating Natural Systems in a Web Browser.
Thanks!