Tuesday, October 21, 2014

databending and glitch art primer part 3: the GIF

it's been more than a year since i posted to this blog at all, and more than five years since i posted part 2 of my glitch art primer. so much has changed in the glitch art scene in that time, some of which i may touch on in passing, but let's not get bogged down in nostalgia. we have art to make.

GIF, as seemingly everyone on the internet knows, is an image format that has become synonymous with the fact that it supports animation (even though it wasn't originally intended to). it's extremely popular and in recent years has become popular among glitch artists as well.

i run a tumblr blog called glitchgifs, where i'm regularly asked some variation of the question "how do i make glitch gifs?" my usual answer is that there are three basic ways:
  1. glitch a still image several times, then animate it.
  2. glitch a video, then make gifs from that.
  3. glitch a gif file—the most difficult because the file will likely break and then you'll need to use a program like irfanview to retrieve the damaged frames.
most "glitch gifs" that you see online are made using methods 1-2. in fact, i suspect that the majority of people who ask how to make glitch gifs are really asking how to do the technique that's come to be known as datamoshing. there are lots of great glitch tutorials and resources out there for these methods, so i don't want to waste anyone's time reinventing the wheel. instead, i want to talk more about how the GIF format works, and how you can take advantage of some of its idiosyncrasies.

indexed color

unlike other common image formats (most of which use RGB color mode), GIF uses indexed color mode. "indexed" here means that gifs handle color using a color table that defines every color used in the image. this has a lot of implications, first and foremost being that gifs have a very limited color palette—usually no more than 256. this is a huge difference compared to formats like JPG and PNG that support up to millions of colors.

it's notable that the color table is usually stored in the gif file itself. that means that we can glitch it, if we're careful. just take a gif and change the data in the table (and only that data):






you have to be pretty precise to do this without breaking it—the global color table (when present) usually starts around byte 44-45, and each color takes up 6 bytes. so your best bet is probably using a hex editor, though perhaps some kind soul will write a web app or processing script that makes it easy to replace the colors in an existing gif in this fashion. (hint, hint)

transparency

another classic feature of GIF is support for transparency, which is handled by defining one of the colors in the table as transparent. but this can go wrong: google+ used to have a glitch in its gif uploader that confused transparent pixels with solid black ones, and vice versa. this created bizarre ghosting artifacts, as it would just lay the frames on top of each other, with some bits invisible so you could see the frames beneath:



 g+ has since been fixed but you can create similar effects using tools like klear.me:


if you're super handy with a hex editor, you can even play with transparency there by manipulating the graphic control extension block. when present, this block will be eight bytes long, with the first three bytes being 21 F9 04 and the eighth byte always being 00. if present at all, there will be one GCE block for each frame in the animation.




again: if it's used at all, there will be one such block at the beginning of each frame... meaning you could even use different settings for each frame! more detailed information here.

dithering

early computer graphic designers using limited color palettes often had to use tricks to create the illusion of color depth. GIF uses a trick called dithering—simulating colors using randomly- or algorithmically-produced patterns of dots. with dithering and a well-chosen color table, it's possible to create gifs with almost-photorealistic colors.

each individual dither is just one pixel. that can be awfully small on today's screens, so to really play with dithering, you may want to enlarge them, like in daniel temkin's dither studies. to enlarge an image and get that "big pixel" look that i love so much, the setting is usually called something like nearest neighbor or preserve edges/crisp edges. many web browsers now support this as well, which means you can load up a gif in a web app like my HTML5 image filter, crank up the size slider, and watch the pixels dance. 




(ironically, this feature works beautifully in browsers like firefox, even though the actual CSS filters themselves don't work in that browser, whereas the filters work in chrome, but chrome doesn't currently support "crisp edge" resizing!)

when upsizing your pixels in this fashion, the usual advice is to always go in powers of 2—200%, 400%, 800%, 1600%, etc. this will ensure that you get the crispest edges possible. but hey, maybe you want your edges to be a little messy...

more fun with color tables

if it's possible to get almost-photolike colors in a gif with the right color table, then from a glitch artist's perspective, we might be more interested in going the other way—deliberately using the "wrong" color tables to accentuate the dithering. for example, the "bitcrushed" look used by artists like jonCates involves extremely small color tables: as small as 2-4 colors.


i've taken a different approach with my color tables series. a year or so ago i was using photoshop's "save for web" dialog, preparing to save an image, when something about the color table caught my eye. the colors, the composition of how they were arranged (sorted by luminance)... these were beautiful and i was compelled to save it and take a screenshot. this became glitch color table #1.




so i started collecting color tables and posting them on tumblr. i've collected and published a few dozen now, many of them derived from glitched or bent source images. but these color tables aren't just pretty pictures—they're also tools for creating other artworks. by deliberately applying a color table that has few colors in common with the source material, we can get some unusual effects, as the software is forced to choose the "best" of many bad options. glitch color table #1 has no green in it, so watch how it deals with grass:






of course, you don't have to start a color table collection. you can load color tables directly from another gif, or use a palette editor program to design or edit your own dream color table. and though you're welcome to download and use mine, there are probably bunches more color tables floating around online. want to use the color palette from the original nintendo NES or gameboy? get the color tables here!

i've been using this trick a lot lately, such as in my dither sunsets series and my latest video. i start out by shrinking the source image/video at the beginning, which allows me to enlarge it back later once the dithering has been added. then i try it out with different color tables, and when i find a result i like, i enlarge it again. i can even animate them by exporting several different versions with slightly different dither settings, and then stringing them together into a gif:


so there you have it: GIF is far more than just an export format for silent video loops. it is a unique format to be mastered, with its own world of artifacts waiting to be explored.¶

Wednesday, September 11, 2013

obligatory six-month update

hello, little blog! how have you been? things have been pretty good for me... well, except for the one incident...

back in july, virago & i went to milwaukee to see four legends of midwest breakcore: stunt rock, abelcain, doormouse, and anonymous. (doormouse, you may recall, headlined the after-party at our wedding.)

the show was great, with three of the performers effectively coming out of retirement for the show. the music was great, we got to chat and catch up with doormouse and stunt rock, and made some new friends. and we did other fun milwaukee stuff like dining out (milwaukee loves friday fish fries and something called "pulled ham", which is like pulled pork, except it's ham), record shopping, and the obligatory brewery tour.

then on the way home, we were cruising the chicago freeway when another driver "fell asleep" and crashed into my rear bumper at full speed. (i don't know how you fall asleep on the freeway at 3 in the afternoon without drugs, alcohol, or a medical condition, but that was her story.) we were then pushed down the freeway an unknown distance, hit the curb, and spun around 360 degrees, ending up in the left lane with a broken front axle.

somehow, despite the fact that the chicago freeway is pretty busy on a weekday mid-afternoon, we didn't hit the median or any other vehicles. we could easily have been killed, but escaped with only minor injuries (virago had some back pain for a few days, but that was it). but of course my car was totaled, and the six-pack of new glarus beer i had picked up to bring home was in the trunk right at the point of impact, sending beer and broken glass all over the trunk, and damaging a few of the records i'd brought with me for trade.

so that sucked, but at the same time it became an opportunity to get a newer car. after getting our insurance check, we headed out to terry lee honda (chosen because it was the best-reviewed honda dealer in the metro area, and after going there it's clear why) and now we have a 2011 civic—the same model as my previous car, only 10 years newer, in black, and a touch more blinged out.

so, near death experience aside, things have been good. i've been keeping busy. i finished a new release called taco meat, coming hopefully soon on a german label called betonblume. it's a bit glitchy, with some wack cylinders-style sampling but this time with beats—with actual drum programming (and not just sequencing percussion sounds sampled from somewhere else). i'm really pleased with it.

i've been making tons of art as well, and getting work in art shows. this summer i was in a show called run, computer, run (show is over but you can still view my piece on the website). i also have work in a show called _ģ̶Ł̶1̶ɫ̶C̶ʮ̶_Δ┌┼---\/\/\/\/\/\/!┬---jonCates_(AKA "Glitch Art with jonCates"), which opens tomorrow in saskatchewan as well as online at gl1tch-4rt.tumblr.com. then later this month i'll have a piece in a show called money as error. and i'm currently working on something pretty cool for the wrong - new digital art biennale, which opens november 1. all that, and i post new work daily at stallio.tumblr.com, and a couple other things in the works i probably shouldn't mention yet. and did i mention i'm still doing my weekly net radio show Active Listening / The Act of Listening on numbers.fm?

so yeah, i've been productive. stay tuned for future updates (though following me on facebook or tumblr will probably yield better results than relying solely on this blog).

Tuesday, March 12, 2013

just how bad is soundcloud's "automatic content protection system"?

as many of you know, one of my music processes is is a form of sonification (or audification) where i trick my computer into opening various data files as if they were sound files, and then i make music out of the resulting sounds. (i wrote a tutorial about it here.)

a while back i posted an old song called "denial of service" to soundcloud because i was thinking about including it on my recently-released album on the DLL. the song is what you might call "pure" data sound, in that every sound in the song is made of this sonified data. so imagine my surprise when i got an email from soundcloud that they'd taken the song down because they thought i had sampled some house song:

i repeat: every sound in my song is taken from sonified data. no drum machines, drum samples, or any other instruments were used. but somehow my song still triggered an automatic takedown for uncleared sampling. i didn't even run any audio effects on the samples—they are all clean.

want to hear for yourself? here is my song (warning: fairly abrasive). and here is the song they think i sampled (warning: fairly mediocre). no human who listened to these two recordings would think they had anything in common.

as a glitch artist/musician, i find this fascinating. what could this algorithm be hearing in my song to make it think i sampled some house track? in terms of tone, timbre, tempo, and meter, these two recordings could hardly be more dissimilar. but to a bot, they apparently sound alike. somewhere in there, indiscernible to mere human hearing, the two must have some tonal sweep or polyrhythm in common. or some checksum came up with the same result by chance. it's hard to even speculate about how this may have happened without knowing more about how their bot works.

but it's also frustrating that my song has been pulled down based on such a laughably false accusation. and although i'm certain i will win the dispute, it's annoying to have to send soundcloud my name, address, and phone number, as well as tick seven checkboxes threatening to sue my ass off if i'm lying:

of course, there's no way for me to take soundcloud to court for wasting my time or for issuing bogus threats. all this because of a poorly programmed bot. in a way i'm lucky that my song obviously doesn't contain any "musical" samples of any sort. what would happen if i had made some housey track that just happened to use the same drum hits, or just sounded similar?

update: within a couple hours of filing a dispute, i received the following message:

thank you for providing feedback in regards of the upload:
stAllio! - denial of service

This notification is to inform you that your upload has been released to your account.
Thanks,
The SoundCloud team

so although it's reassuring that these disputes are reviewed quickly, it's alternately fascinating and horrifying that such a thing could happen in the first place. and i must wonder what would've happened if my case hadn't been so open-and-shut.

Monday, January 07, 2013

summoning ghost frames

this is a write-up of the ghost frames workshop i delivered at GLI.TC/H 2112

ghost frames is a term i use to describe video frames which do not actually exist in a video file but which are sometimes revealed when using damaged data and/or glitch processes. for the sake of discussion, i'll also use "ghost frames" to refer to the process i use to invoke these frames. my process involves a bug in certain versions of avidemux, though there are likely other ways you could do something similar. (nick extracrispy tells me he can do something similar in quicktime, for example.)

specifically, i use avidemux version 2.5.4. the process is likely to work in other 2.5 and earlier versions, though i haven't tested them. it definitely does not work in the current version, 2.6. also, during the workshop, some mac users reported that they couldn't get avidemux to install. for os x lion/mtn lion, check these instructions for installing avidemux.

i initially discovered ghost frames thanks to another glitchy behavior in avidemux. my desktop computer runs windows 7 and has a video capture card for recording tv signals off a coax connection. the default tv capture program in windows 7 is called windows media center, which records programs in a format called WTV. WTV is proprietary (closed) format, but it's close enough to MPEG that when i try to open a WTV file in avidemux 2.5.4, it asks me "This looks like an MPEG. Do you want to index it?"

answering yes to this question and no to any follow-up questions results in a video that is recognizable but thoroughly mangled. here are some typical examples:

arise_glitch8

occasionally you'll get weirder, unpredictable glitches like this:

arise_glitch11

i'd been playing around with this wtv transcoding glitch for months before i saw my first ghost frame, which i discovered by accident. to invoke ghost frames in avidemux, scroll through a damaged video backwards. just skip to the end (or any point in the middle, if you prefer), and use your left arrow key to reverse through the file. if your file is damaged in the "right" way (say, via WTV transcoding), then you'll start to see frames that aren't really there:

parade45

what seems to be happening here is that avidemux is getting confused and applying incremental changes in the wrong direction. to save space, MPEG files only occasionally send full frames (keyframes or i-frames) and fill the rest of the video with p- and b- frames that only describe which pixels have changed since the previous frame. reversing through the file seems to trick avidemux into applying these changes wrong, thus revealing glitched frames that aren't actually in the file. (and i love the fact that you do this by going in reverse; it really makes it seem like some magic ritual.)

you can even do something i call dancing between the keyframes, inching back and forth through a glitchy area of the file as the artifacts become increasingly pronounced:

ninja125

of course, it's one thing to see a ghost, and something else altogether to capture a ghost. ghost frames disappear just as suddenly as they appear. skip so much as one frame too far and those ghostly glitches you've been cultivating could vanish. you can't just hold down the left arrow key and storm through the place: you have to inch along. you have to creep.

so that's how you summon ghost frames from WTV files. it's all well and good if you're running windows 7 with a tv capture card, and have video content you can pipe through a coax connection, but that's a fairly narrow demographic. also, WTV transcoding introduces some artifacts i'd prefer to be able to turn off, like the banding at the top of the screen. so when preparing for the ghost frames workshop, i spent a few hours digging around for non-WTV files that would work with this process. most files i tried wouldn't. but by chance, i found one file that did. further investigation revealed that the teaser videos on NSFW adult website ellinude.com could be used to summon ghost frames—but only the videos from the past several months. (i don't have a subscription to the site so i don't know if the full-length subscriber videos glitch in the same way, though it seems likely.)

fun glitches! but because i found these files in the wild and they seem to be normal working video files, i don't know what about them makes them glitch like this. more about that below.

areas to explore

  1. crack the mystery of what makes the ellinude videos glitch. is it something in the encoding settings? something in the camera that shot them? something in the actual frame content? a combination, or other factors? the obvious goal is to reproduce these effects on files of our own choosing.
    my analysis suggests these files were encoded using ffmpeg, but i haven't quite been able to reverse-engineer the encoding settings. (and don't know if it would do much good even if i could.) some metadata from some of the video files is available here (thanks to antonio roberts for his help compiling this metadata).
  2. if we can summon ghost frames from transcoded WTV files and from ellinude's MP4s, then they could likely be found in other types of mangled/miscoded video. damaged/databent files, deliberately poor encoding, hacked codecs, etc are possible avenues for source video.
  3. this process has a lot of similarities with datamoshing. the two processes could likely be combined to interesting effect.
  4. version/system sensitivity testing—will this process work in other versions of avidemux, and if so which ones? will the same file produce the same ghost frames using different versions of avidemux or different operating systems?
  5. identify other tools/processes for summoning ghost frames.

Wednesday, December 19, 2012

stAllio! - on the DLL out now!

my new data sound release on the DLL is now available for streaming or pay-as-thou-wilt download on bandcamp! this album has been in the works for more than a year and i'm pretty stoked to finally release it. here's the write-up:

stAllio!'s triumphant return to the world of sonified data! once again, stAllio! plunges deep into his hard drive and listens to the data -- image files, executables, and link libraries alike are converted to sound for his review. the choicest bits of data are then meticulously assembled into music: glitchy melodies, skittery rhythms, and thunderous beats emerge from the digital noise. you could call it IDM (interpreted data music), dirty 8-bit, or glitch-hop. stAllio! used to call it databent music, but these days prefers the simpler term data sound.

this is stAllio!'s first full-length release in the data sound style (his label debut, dissonance is bliss!, and 2004's true data 12", were both EPs) and his first release as a pay-as-thou-wilt bandcamp download. so stream it online, download it for free if you're feeling cheap, or even chip in a few bucks for your music the way people used to -- but whatever you do, don't sleep on this!

Wednesday, December 05, 2012

stAllio! at GLI.TC/H 2112

it's that time again! tomorrow i'll be driving up to chicago for GLI.TC/H 2112! GLI.TC/H is pretty much the premiere glitch art event in the world and i'm excited to be taking part again this year. i'll be here and there throughout the weekend, checking out various panels, performances, and workshops. and in particular i'll be participating in the following:
  • i'll be part of a panel discussion on the subject of "glitch porn" friday afternoon, as part of the glitch cultures thread.
  • i'll be doing a short improvisational performance friday night for the "no media" performances, teamed up at random with another artist.
  • i'll be leading a workshop on my ghost frames process saturday morning for the dirty new media w3rkstation.
check out the full schedule of events here. maybe i'll see you there! or maybe you'll see me but i won't see you... some events will be streamed online for those who are unable to make it out to chicago.

Tuesday, November 27, 2012

introducing glitch pillows

from the "things you never knew you wanted until now" files: glitch throw pillows!

if you'd told me even a week ago that the most popular item In my society6 shop—more popular than t-shirts or laptop skins, even—would be throw pillows, i probably would've thought your prognosticator circuit was faulty. pillows aren't something i generally gave much thought to, let alone get excited about. and judging from the comments at this prostheticknowledge post, i'm far from alone there.

so i didn't know what to expect when i got the email that society6 now offered pillows, and was as surprised as anyone by how sharp these things look:

(yes, these are computer-generated preview images, but society6 does good work & i have faith these will look just as good in person.)

on reflection, it makes perfect sense: these pillows are as big as an art print, but much more functional & practical, plus you don't have to worry about stuff like framing. and because they're offered by society6, a create-on-demand site that can make them at scale, they're more affordable than limited-edition products like notendo's glitch scarves or philip stearns's glitch blankets.

and the timing couldn't be better: glitch is hotter than ever (it's even a core component of the latest hit disney movie, which i highly recommend)... and just in time for the holiday shopping season. the world is practically begging for a little piece of glitch pulled up from the matrix into their homes.

finally, it feels good to be getting some recognition for my big pixels series, which i feel is some of the best glitch work i've done, but which tends not to get as much attention on tumblr as my glitch gifs do. (of course, if you could put an animated gif on a pillow at that price, i'm sure that would sell even better.)