Sunday, January 30, 2011

Keeping Busy

Marker Grid - based on a drawing by ohahalicia

Believe it or not, this is a vector image. This weekend I've been keeping busy with projects like the above -a foray into vector filters. Still adding to page 2, so check out new work and image sources there.

New web drawings:
Lastly, a reminder: SELF PORTRAIT

Friday, January 28, 2011

Self Portrait - New collaborative project on Human Kibble

I'm looking for participants on a new project investigating online identity. I'm very excited about this one and will probably whip up an entry myself. The guidelines are pretty loose (I'm not even requiring submissions to be image files), as opposed to the Catalog in November, so I'm hoping to see some really creative entries.

Oh yeah, while we're talking Human Kibble stuff, I recently added a project listing to the front page.

Tuesday, January 25, 2011


thanks to mirrroring for the title!

Monday, January 24, 2011

Blue Links

Dumpers Mirroring, Noisia and I began building last week a repository of our high concept / jokey art historical work called "Too Much Concept." We're taking submissions, so if you get it and have work you'd like to submit, don't hesitate.

I twote about this site earlier - Webjam, an art collective that (from my vantage point) looks like it's been the net-art-world radar for a while. I've worked with Fabien and Carlo from the site before, and they produce very clever work. Go check them out.

Sunday, January 23, 2011

More reductions

More vector reductions on my vectors page. Still very ambivalent about this technique. I find the forms produced to be very seductive and energetic - like colored oil in a 60's light show - but it seems too easy, like I should be making things more difficult. I tried working together both unaltered and altered vectors as reduced-palette gifs today, and was reasonably pleased with the result.

Saturday, January 22, 2011

Tuesday, January 18, 2011

Site Update: Design Work

I should have made this a long time ago... Highlights of my professional work for interested parties.

Saturday, January 15, 2011

Accomplishments of the Now

My laptop toasted itself late Wednesday night, so my routine is a bit thrown off. Thankfully, I was able to salvage the hard drive (it's now an external on my girlfriend's desktop PC), which held all of my vector source files and music. Whew! The upside to this situation is that I have an excuse to shop around for a new computer, and my routine is thrown off.

Recent work: Corpus, Artwork for Neighbors, TIWIDMCA, and the above, which I just finished. The image was made from a  heavily manipulated raster image of random noise, run through a tracing filter in Inkscape. I then adjusted layer colors & added gradients until things seemed right. The tracing algorithm leaves very dynamic outlines, and I like being able to separate a flat image into layers by color or value. Will be investigating this further.

I can't stop thinking about science fiction these days. I've been perusing Orion's Arm, the best work of collaborative worldbuilding on the net. You can't find articles on transapients and art movements of the next 8000 years just anywhere. I dig the 90's-esque superclean 3D renderings for ironic purposes.

Also not helping this obsession was my visit to the Walker on Thursday to view an exhibition of work by Yves Klein. His work is postmodern, precambrian, and anticipatory of life in space. If you look at Klein's sketches, you can tell that he didn't care for science in the same way the Cubists embraced relativity. (air roofs, Klein? really?) Klein was more interested in the spaces and existences than the mechanics.

Monday, January 10, 2011

IKEA Plant

Sunday, January 9, 2011

Site update

I've added a Recent Updates section to my main page and moved old content into archives. Hopefully this will make finding new content easier for visitors.

New pages:
Dump pg. 4
Vectors pg. 2

I also put new stuff up randomly on the HTML Experiments page, so check in there every once in a while. If you're following me on Twitter, you see all of that content as it goes up.

Thursday, January 6, 2011

Let's Be Formal

Warning of those who have a tendency to tl;dr - this is going to be long and technical. If you're brave enough to stick it out through this post, you'll understand the major formal qualities of filetypes in digital image making. I'm going to limit this discussion to popular filetypes exchanged on the web. From raster filetypes, we'll look at JPGs, GIFs, PNGs, and also BMPs to explain concepts behind the other types. I also will explain general qualities of vector images, as they are used online, but as of yet are not as widely supported as raster images. Lastly, all of this is heavily annotated with links to Wikipedia, because their sample images of concepts are very helpful.

Raster Images - the Bitmap
Raster images are essentially two-dimensional grids of color values, called pixels. The most basic qualities that all raster images have are a resolution, and a color depth. These basically just mean that each raster image has a fixed width and height, and a number of possible color values that can exist in the grid. When computers first started becoming popular, screen resolutions were low and computers could represent very few colors, if any. Nowadays, the standard number of colors that a computer can display is about 16.7 million. Each pixel displayed on your computer screen is a value made up of three bytes - one for red, one for green, and one for blue. Typically for colors on the web, values are expressed in hexadecimal, so for example a bright red is #ff0000.The code denotes that the red byte be set to its max value of 255, or  #ff, and that green and blue are set at #00 each.

The most basic way to represent a true color image as a file is to simply lay these three-byte images out in a grid. The most common filetype that does this is the BMP (bitmap), well known to MSPaint aficionados. However, as true as the colors are, the files tend to be very large at high resolutions, making them unsuitable for web distribution. Thankfully (sort of), the human eye is only capable of distinguishing about 10 million colors on a good day. This means that we can cheat, and reduce our palette to reduce file size.

Image Cheats - Compression, Indexing and Dithering
 This is where things start to get fun. The most common technique used in reducing file size is called compression, and I'll admit the exact methods of compression are beyond my scope of knowledge. However, I can describe the general principle and the effects of compression. JPEGs, possibly the most common filetype exchanged online, use lossy compression, which means that the original bitmap is broken into chunks by an image editing program and those chunks are converted from pixels into mathematical averages of the color content of each chunk. Here's an example:

This is Lena, a popular digital test image made some time in the 70s. I think someone scanned her from an old Playboy. Anyway, this file is a BMP; you might have noticed that it loaded from the bottom up (an odd quality of BMPs on web browsers). This image takes up 768KB, almost a megabyte.

If we compress the image extensively as a JPG, we get this:

This image only takes up 3KB! Obviously, this is very exaggerated compression; usually it's much slighter on most images. Notice that the chunks that the image has been reduced to are converted into large pixels or gradients. People working with JPGs call chunks when they're noticeable "artifacts," as they are reminders of the compression. Although someone interested in high-res photography might not want any artifacts in their image, some digital artists like the abstract qualities that compression can provide, and use it expressively. Sometimes digital artists will intentionally change random bits within JPG images to "bring out" glitches and therefore wild, colorful artifacts. A good example of such images would be Maxwell Paparellas' Intoxications series. PNGs also use compression to some extent, but the effects are not nearly as dramatic as the JPG. More on that later.

The infamous GIF is not a filetype capable of this sort of compression. This is largely due to its age - developed in 1987, when color on computers was still pretty hot stuff. GIFs use another method of reducing file size, called indexing. Indexing essentially changes how pixels work. Instead of referring to a color value, an indexed pixel refers to a color in what's called a color map or lookup table, like a palette. Here's Lena again:

Here we've reduced the image to 32 colors in the color map. I've drawn in the map on the right side, so that you can see all the colors that the image uses. This drastically shrinks file size (76KB, 1/10 of the original BMP) while maintaining good color. Indexing also gives the image a texture, as can be seen especially on Lena's shoulder. GIF makers often enjoy the added textures of various indexing methods, and look for interesting ways to employ them. To use a personal example, check out my GIF of Scott Ostler at dump IRL: 32 colors used for the total animation gives the light on his face a gritty, laser-like quality.

When I reduced the colors, I asked the program to simply average the whole palette down. However, we can again take advantage of the human eye and "cheat" if we so desire to make the image appear to have more colors. The way we do this is called dithering, arranging colors in patterns at the pixel level so that colors appear to blend. The textures from different dithering methods can bring interesting visual sensations to images. Here's Lena with the most common methods to illustrate:

Notice how much truer to the original the dithered versions are. Also notice the difference between the positioned quarter's checkerboard patterns and the Floyd-Steinberg quarter's texture. I like to think of the F-S method as "pore-like." Anyway, GIFs have an upper limit on the number of colors that they can display as well, 256 max. This puts their color depth at much lower than the average JPG, so the filetype is more suited for both images with very few colors and for images where a dithered texture is desired. Again, personal example - in Mirage I pitted F-S dithering of a black and white image against the antialiasing (slight blurring of edges) that most web browsers apply to images. This encourages hallucinatory moire patterns to occur in the shadows of the wavy buildings. In this way, you can anticipate how browsers treat images and design your base images to take advantage of that output. Browser rendering of images is a whole different subject which we'll save for the future.

Animation and Transparency
GIFs have two more formal qualities that make them interesting as filetypes, transparency and capability for animation. GIF animations can have as many frames as the artist might want, but more frames add to the file size quickly. We're going to use a sample other than Lena this time, the popular crab monster from dump:

Interesting things to note about this guy: the reduced color palette, very few frames of animation, and the transparent background surrounding the crab. The pixelation is an intentional move on the artists' part. GIFs have the capability for pixels to be either completely opaque or completely transparent. This allows artists to put an emphasis on the form of a shape or animation. This also makes things interesting for building animations, as GIFs treat each frame as a layer of the same image. When making animated GIFs, the artist must specify frame by frame the duration of each frame in milliseconds and the method of adding the frame to the image. The minimum duration for a frame to be visible is about 17ms, or 60hz, the standard refresh rate of monitors. Frames can be as slow as you want. A frame can either replace the previous frame, or combine, i.e. overlap onto the previous frame. The above image replaces each frame with the next frame. If we change the layers to combine, we get this:

The crab leaves "tracers" of the previous frames, then erases them when it returns to frame 1. This can lead to some interesting effects; check out Tom Moody's "GIF Heavy Hitters" figure, which brings an emphasis onto the path of motion in space. In addition to these possibilities for GIF animation is the GIF's loop qualities. GIFs can loop infinitely, or loop only once per display. Finite GIFs have been largely unexplored due to poor browser support and general lack of apparent possibility, but they can exist.

Returning to transparency as a topic, the advantages that the PNG filetype have over other graphics formats is their capability for gradual transparency. Unlike the on-off method of transparency used in GIFs, PNGs can add another byte onto each pixel value for an alpha value. PNGs also support up to 16.7 million colors outside of transparency.This makes PNGs very useful in web deisgn, where gradual transparency can be used for all sorts of interesting effects.

I mentioned that I was going to return to a comparison of PNGs and JPGs regarding compression. I honestly have a poor understanding of PNG compression, but I know from personal experience that when PNG images use few colors, their file size is usually much smaller than a comparable JPG, and artifacts do not occur. When PNGs are used for photographs, often they are much larger in file size than their JPEG counterparts. Basically, JPEGs more suited for photos, and PNGs are better for layering, abstract images and illustrations.

I think it's time for another Lena sample. Here she is as a PNG with varying alpha values. 532KB - not great size-wise, but pretty good for having an extra byte added on to each pixel. Notice how she blends into the gray background. If you were to remove the alpha channel on this image, the missing areas would reappear.

Wow, kinda misty and romantic. I should point out, you can dither alpha values and save an image like this as a GIF. You get what's called the "screen door effect." Depending on your computer and browser, this image might be antialiased and gain a moire pattern around the outside. You might want that for your images, but if you just want simple, gradual transparency, stick with PNGs.

Vectors and Reproducibility
We're almost finished! Vector images are a completely different ballgame. Remember how I mentioned that compressed JPGs are made up of lots of small "chunked" mathematical functions? Vectors take that a step further. Think of a curve, like a sine curve. In math, we can use points, curves and calculus to define the areas of regions of space. Vector image editors like Illustrator and Inkscape allow users to draw simple shapes, which are stored as mathematical functions. This makes these sorts of files incredibly small, and also scalable.
Rather than having to define a value at every point in a grid, the computer is given a mathematical function to trace and fill in.

Lena, you've changed somehow... As you can see, this drawing is composed of curves, simple shapes, fills and gradients. Simple vectors can be very reminiscent of airbrush drawings due to the ease of using gradients and sharp edges. Because of the clean appearance and the scalability aspect, vector images are very useful for graphic designers who make illustrations and logos for publications. Most print work needs to be at very high resolutions, and so pixels just don't cut it when you need a banner graphic 8 feet wide. Also, I should mention that above I posted a raster version of the original vector graphic. Some of you might be able to view the original in browser. Try scaling the image up and down in browser, if you can; you'll notice the edges stay sharp instead of becoming pixelated, like the scaled up crab monster above. For those of you unfamiliar with how to do that or unable to see the SVG file, here's a larger raster version. The two most commonly browser-supported vector formats are SVG, an open-source format, and SWF, the Flash standard. SWFs allow for interactivity and animations, but require proprietary software to write and view.

This brings us to our conclusion, the subject of reproducibility. As I said, vector images are notable for their scalability. Keep in mind, though, that since the raster versions of a vector file are limited to their native resolution, they are not as easily reused. When a raster image is uploaded to the internet, anyone can edit it, take credit for it, and reuse it at the resolution it exists at or smaller. An artist can have ownership over a vector image by distributing it online as rasters and keeping the vector file private. That way, if authorship is ever called into question, the artist can produce the highest resolution possible, the vector, as proof of ownership. This is an issue I haven't seen discussed in the art community before, so I'd love to hear any artists weigh in on this possibility of content management. Unlike raster files, where there is no original source, so to speak, vectors are like paintings in that they are original objects, but also are like digital images in that they can be infinitely reproduced. It's an interesting paradox.

Many digital artists know that by putting their work online, they expose it to a remix culture where the work will be infinitely reproduced, lose authorship and take on new meanings in different contexts. This is a formal quality of sorts for all online content, and I believe it's one of the main reasons why collectors and institutions are hesitant of purely digital art. Finally it should be kept in mind that all of the image filetypes I've discussed (except for the BMP) share what might be called a formal quality at this point: common support on all web browsers. Because these images are viewable by most people online, they are suited for online display. There are ways to translate these files into formats viewable outside of a computer, but their suitability for the online environment is part of what makes them unique and important as art media.

If anyone thinks that I've missed formal qualities of these filetypes, please share your thoughts in the comments. This essay is meant to be constructive and open to growth.

Wednesday, January 5, 2011

Visions of Google

While falling asleep last night, I had what would be best described as a hypnagogic vision of a landscape image, comprised entirely of Google Docs shape elements. I took this as a sign, and wrote down the idea. This morning, I made two attempts at simple compositions

"Bad Day for a Cylinder"

"Two Frames"

Really liking the simplicity of form and palette. My notes from last night say "Art of the Private Internet," whatever that means. For prior examples of Google Documents as a collaborative art platform, check out Chris Collins' "Public Interface Gesture" performance.

Tuesday, January 4, 2011

What's the Deal with GIFs?

I don't have to tell most of you that animated GIFs received a lot of press within the past several months. Most of the GIFs cited in said articles are gags, "glitter" GIFs, clips from TV and movies, and your typical Funniest Home Videos-type fare. The growing popularity of image-centric sites like 4chan and more recently Tumblr have encouraged a resurgence of public interest in a 24-year old file format because of the GIF's unique ability to endlessly loop animations. GIFs are very small files as compared to a modern digital camera photo, and all major browsers support the animation to a functional extent. However, it should be made clear that the GIF is not inherently kitsch, just like a roll of film is not inherently kitsch. It's a filetype, a medium, and therefore has several uses. The main two uses of GIFs right now online are in informal conversation, and as art/components of art. Let's discuss the division.

From a conversational standpoint, GIFs carry a lot of punch as images because the animation grabs your attention, and a short loop is suited for a "reaction image." Take the Seinfeld GIF above. The message is clear: if someone posts this in a discussion, they're saying "Eh, this is hooey and I'm not gonna bother. See ya." It's expressive, funny and fast, and it sets a tone; all necessary qualities for extended net discussions.

Ryu Punch, by noisia

On the other hand, a very small fraction of GIFs are intentionally produced as "art." Here is an example by noisia. Rather than using pop culture elements literally, the artist has used an animation from a fighting video game as a formal element. The fighter's identity is not the emphasis, the work is about motion, repetition, bold color and symmetry. The image is kaleidescopic and infinitely tileable. This is a radically different use of the medium, and requires a different sort of looking to interpret and appreciate.

Early Myspace photo?

Some have debated the legitimacy of GIF art in light of the popular culture associated with the format. Most recently, Twitter-based performance artist Man Bartlett took up a beef with the popularity of the format on his Tumblr. For those still wary of the GIF, let me offer you this: in the early 19th century, the camera was invented. For decades, artists explored the possibilities of the new medium of the photograph, but their efforts were not treated as "sincere" or "legitimate" by the establishment. This was for two reasons. The first was that the new medium had great appeal to amateurs and businesses who would otherwise have to employ illustrators for producing images of their work, and so most photographs were not intentionally made as fine art. The second reason was that photographs were generally evaluated by the art world under the definitions of art as defined by painting, the main form of visual art at the time. Paintings have been for the most part produced only as art objects throughout their existence, and so it was very difficult for some to grasp the idea of a medium being neutral. Eventually, by about the 1920s it was decided that the intention of an object's creator, not the medium, determined whether a work was art or not, and an artwork was to be evaluated by subject matter and formal qualities.

smile-camera-flash by ahem. Art or not?

GIFs are like photographs, in that the method of image production is unique, but the division between amateur and artistic intention is what differentiates both usage and evaluation methods. Context is key; the website that a GIF is posted on and even its positioning in that website alerts the savvy viewer as to whether the image is to be evaluated as art or not. Just like photographs, there are even those GIFs and sites where the lines blur, and it's hard to tell what is art. A viewer of digital art must learn how to look at a work by understanding context and formal qualities. I'll be writing a breakdown of formal qualities of popular filetypes in the next few days to aid those who want to explore the concept further. What's important in the big picture is that participators in the art world understand that digital filetypes are just types of media. A GIF is like undeveloped film; it's what you photograph that counts.

Saturday, January 1, 2011

Happy New Years!

Had a nice, low-key New Years' Eve last night celebrating at home (I've been sick this week). Live-blogged the event last night with several other artists and friends at Haze Luux (NSFW), a group blog coordinated by dumper grapeshasta.