Tuesday, December 16, 2008
I've started compiling a list of some of the more interesting stuff that I've found. You can see it here:
As an additional clue, I put a link to this at the top of this blog page, so you can always get there by clicking on "References."
Note that some of these books, such as Oppenheim et al's Signals and Systems, are pretty technical. I mention them for completeness, not because I think you should run out and buy them. Wait for the movie.
Saturday, December 13, 2008
A while ago, in a blog far, far away, I posted a bit about the Gaussian distribution, and how it can be used for blurring images, as in Photoshop’s Gaussian blur function. What the Gaussian distribution really is is a way of describing the probabilities of certain kinds of events. For example, suppose your wondering about rainfall in New York City, and you want to know how much rain is falling on different parts of the city during a storm. Well, chances are that all of New York is getting socked, and the rainfall amounts are probably pretty even all over. If there’s an inch of rain, there’s going to be an inch of rain on Wall St., and inch on 14th St., and inch on 42nd Street, and so on going uptown from the Battery to Harlem.
So, what does the rainfall in New York have to do with art and technology? Nothing, but the interesting thing is the shape of that Gaussian distribution, often called a bell curve, for obvious reasons.
I talked about using this for blur, but it's useful for other kinds of effects. For example, think about how an airbrush works. It sprays a stream of very fine droplets of paint, and they land mostly along a line traced by the airbrush. A lot of paint also falls just to one side or the other of the line, and a little bit less falls a little further away. In other words, the amount of paint is like a Gaussian distribution, with most falling along the path of the airbrush, and less and less paint as you get further and further from this path. That's how airbrushes give that nice soft edged look.
Click on the images for a larger view.), but it shows that the center of the stroke is darkest, and the line gets gradually lighter near the edges. Here are some more examples, drawn by a PostScript program that creates random curves, and then applies a kind of airbrush effect with the Gaussian arrangement of dots of color:
Friday, October 17, 2008
So I reserve the right to change my vote later, but for now, the top three CS4 features for me are:
- Illustrator's Blob Brush
- Photoshop's Quick Selection Tool
- Photoshop's Rotate View Tool
The Illustrator Blob Brush allows you to paint areas which immediately get converted to outlines. You can even use the eraser in combination to white out areas that have been painted. This feels much more like drawing with natural tools, but with the advantage of getting nice, easily manipulable outlines.
The Photoshop Quick Selection tool works the way you always wanted the Magic Wand tool to work. It just seems to know what you want to select. You can even drag it over an area to select all the parts that make up that area. You still have to watch what you're doing, but it seems to behave very well.
Photoshop's Rotate View tool is also long overdue. (Painter has had this for years.) Basically, you can simply drag to rotate the image in the window to get a more comfortable working angle. This is like rotating your paper on your drawing surface to get a better angle. Double-clicking the tool icon straightens everything up again.
I'm sure I'll be finding more as time permits, but these three alone make Illustrator and Photoshop vastly more useful to me.
Tuesday, September 30, 2008
We don't think about halftoning much in connection with on-line images, because we can display so-called true colors in a Web image. They're still made up of primary colors, but the process and the dots are mostly invisible to people who create and view Web sites.
However, there is one issue with Web images that can still make good use of halftoning. That has to do with transparency. Images on the Web can have transparent parts, but they can't have semi-transparent parts. In other words, if you use Photoshop to make beautiful soft-edged images, your Web page will have to have a white background to keep that look.
If you want an image to appear to have a soft-edge, but the background is complex, with different colors and/or patterns, you can approximate that soft edge by using halftone dots. An example of this is at:
The interesting thing is that the halftone dot pattern is almost invisible. That's right. The human eye more or less tunes out this regular pattern, so the white box appears to fade more or less smoothly into the background. (Not now, of course, because you're looking for it! Try squinting a bit.)
So, here's how you can get this effect with Photoshop:
- Create the basic shape for the image background (rectangle, ellipse, etc.)
- Blur the edges with Gaussian blur to get the right edge "fuzziness"
- Convert the image mode to "Bitmap," using one of the dither or halftone options. These give you a lot of control over what pattern gets used to approximate the grayscale of the blurred shape.
- Now convert the image mode back to "Grayscale". It's grayscale, but all the actual pixels are either black or white.
- Use the Select->Color range ... tool to select all the background pixels, and delete them, leaving a transparent background.
- You can use Select->Color range ... again to select all the opaque pixels and make them any color you want.
Tuesday, September 23, 2008
Thursday, September 4, 2008
Two of Adobe's preeminent software products, Illustrator and Photoshop, have sometimes suffered in comparison with the former Freehand (Aldus and then Macromedia) and Painter (Fractal Design, then Metacreations and then Corel). Adobe came close to grabbing Freehand when they acquired Aldus in 1994, but the original developer, Altsys of Texas, sued to regain the marketing rights they had licensed to Aldus, and then was promptly swallowed by Macromedia. Adobe finally gained Freehand as part of the Macromedia acquisition, and they immediately killed it off as a competitor to Adobe's own Illustrator.
Fortunately, I think many Freehand lovers will rejoice at new features in Illustrator CS4.
Likewise, I think fans of Painter will welcome the new additions to Photoshop in CS4. The core set of photo retouching tools will continue to expand more and more into the realm of image creation.
So what features do you think will be in CS4? What would you like to see? Click on 'Comments' below to add your ideas.
Thursday, August 28, 2008
It's been 45 years since Ivan Sutherland wrote the Sketchpad program for his Ph.D. thesis, and we still haven't found a computer drawing tool better than pencil and paper for those initial sketches. I'd like to know why not. Why are artists not inclined to do their initial drawings on the computer? It's certainly easier to make corrections and revisions, and it would allow you to preview a more finished looking drawing while you're still sketching it. So what's the appeal of pencil and paper?
One possibility is cheapness. I don't mean the cost of materials. Once you have a computer and software, the cost of making additional drawings is essentially zero. I mean cheapness in the sense that pencil drawings feel like they can be tossed out. On the computer, it's so easy to make things look perfect that I think there's a tendency to be perfectionist even in the early sketch stage. It's just too intimidating.
Another possible factor is comfort. You can sit in any position you like, with any reasonably flat surface in front of you, and draw on a piece of paper. At the computer, even with Wacom tablets and other accessories, you're forced to sit up in a more deliberate position. You can, of course, plop a Wacom tablet on your lap, but you still have to see the screen. Future technologies may make the physical activity of drawing on the computer more like drawing on paper.
One of the big comfort factors is being able to move and turn the paper around to draw at a comfortable angle. If you're right handed, for example, it's probably easier to make the 'C' shape than the 'D' shape. Some tools (e.g., Painter) can do this, and I expect to see it in Photoshop at some point.
For me, one of the things I love about drawing in pencil is accidents ... those little blips, dots, unintential curves and jags and other marks that find their way into the drawing. The lack of full control is part of the charm. (Of course, I may just be less coordinated than other artists!) But that's the part that I find hard to replace ... the haphazard flukes of drawing by hand. When I try to draw an oval, for example, it looks something like this:
Then I redraw it a few times, picking the lines I like and ignoring those I don't. (Actually, the above is too perfect ... I did it in Photoshop since I don't have a scanner handy.) I unconsciously make lines lighter or darker depending on how tentative I feel about them. As I go over the pencil drawing, with more confidence, I automatically darken the lines I like.
Certainly this can be done with digital tools. But it won't be unless there's an economic justification for it. Will Adobe sell more copies of Photoshop if they make it more pencil-and-paper-like?
What are your reasons for choosing pencil and paper or some other tool?
Monday, August 25, 2008
Now, of course, with tools like Photoshop, you can combine photos, cull the best features, and come up with an archetypal photo of a bullfinch. But then the photo becomes an illustration! That process of selecting, adjusting and arranging is the difference between recording and creating.
To make matters more confusing, recording is still an art of selection. The photographer makes decisions about when and how to capture the subject before the shutter is snapped. That, in itself, puts the artist's stamp on the photo.
This is central to the topic of art and technology. There's a widespread misconception that artists working in digital media aren't really doing much. The computer does it for them.
Certainly the computer does relieve the artist of some mundane chores, in the same way that animators have assistant animators and in-betweeners to fill in all the drawings it takes to create hand animation. That doesn't make their task any less creative or artistic. The artistry is in the concept and in the judgement ... the choice of what images to use, how to combine them, how to present them, etc. All this, and many other conscious and unconscious decisions, determine what effect the work will ultimately have on the audience.
So the difference between the hand-painted bullfinch and a photo of a bullfinch is one of degree ... of how much and how directly the artist was involved with every detail of the image.
Sunday, August 24, 2008
Basically, it let's me monkey with all the important settings in Photoshop with my left hand, while my right hand is holding the stylus for my Wacom tablet. This feels a lot more like working with real art tools, and not having to type keyboard commands. With my left hand, I can make the brush larger or smaller, zoom in and out, and scroll anywhere in the image, even while zoomed. I could add a few more functions, but I haven't figured out what I want yet. I can almost put away the keyboard while using Photoshop (except that I'm on a MacBook Pro!)
There are some other interesting specialty input devices, such as the ShuttleXpress and Logitech's own Space Navigator 3D Mouse, but these don't seem as well suited for graphic arts.
Unfortunately, I don't seem to be able to access any NuLooq pages on the Logitech site today, but it's still available through Amazon.com and elsewhere.
Friday, August 22, 2008
Thursday, August 14, 2008
I think there's a better way. You can try my approach out here:
The basic idea is that you first set the two endpoints, and then move the mouse around to balloon the arc to the right size.
So which method to you like?
Yes, mainstream computing has finally recognized the importance of tablets. This machine is being targetted mainly at photographers using Photoshop, I think, but it certainly benefits all of us by raising the bar for what creative tools can be expected to be available on a laptop.
By the way, the title of this blog post, "I can has monster laptop," is a play on the "I can has cheezburger" caption that went with a cat photo posted on 4chan.org. That photo and caption spawned an entire multi-million-dollar mini-industry of posting cat pictures, using them on t-shirts, etc. So there's another intersection of technology and art: viral marketing.
Wednesday, August 13, 2008
But what's relevant here is that the nature of the experience is different in a private setting than a public one. Think about watching a movie in a movie theater, versus watching at home on a big screen TV, or a personal computer, or an iPod. If you're alone watching a comedy, do you laugh out loud? That's why canned laughter was invented. (Why they don't have canned "sniffing" for tear jerker shows?) As John Tierney writes in The New York Times, studies are showing that laughter is a social behavior, and that it's affected by the apparent rank or social level of the audience, etc.
So the experience of the movie or TV show is fundamentally different depending on whether you watch in a theater or privately. It seems reasonable to assume that this may also apply to listening to music, or looking at art, or any other kind of artistic experience. It also seems reasonable that it might apply to other aspects of our emotional state than just laughter. Certainly going to a rock concert is very different from listening to an MP3, though they're both electronically amplified. Does looking at a painting in a museum affect you differently from looking at the same painting in a small gallery or private collection? (I'd like to apply for an NEA grant to study this.)
The direction of technology seems to be pushing us more and more towards private or intimate experiences, and away from anything public. What does that mean for the type of art being created?
Monday, August 11, 2008
Basically, the graphics pipeline is the set of steps that would carry a given work of computer graphics from the idea to the actual dots on paper or pixels on a screen. Generally, the low end of the pipeline, making actual dots or lighting pixels, would be pretty common to a variety of graphics software, while the high end would depend on what level of graphics you start with. One way to think of the pipeline might be:
- 3D computer models of characters and scenes
- 2D geometry (maybe from flattening the 3D model)
- 2D bitmap of pixels
- physical dots on paper or pixels on screen
It used to be that a 3D computer model would get turned into a bunch of 2D shapes, each with a color that simulates the shading of the 3D object with the desired lighting. Then these 2D shapes would get turned into actual areas of pixels, and these would get displayed or printed. It turns out, though, that it's more successful to go directly from 3D scene to pixels, without flattening the scene into 2D shapes first. The techniques are based on an approach called ray-tracing, where software computes the color of each pixel by imagining beams of light from each light source reflecting off the objects in the scene and reaching each pixel to determine its color.
If you're creating a graphic in Illustrator, for example, you're starting in the middle of the pipeline, around step 2, with 2D shapes. You arrange the shapes within the Illustrator composition, and they still get turned into pixels for display and printing. Even while you're editing in Illustrator, the software is continuously turning your picture into pixels to display it on your screen.
On the other hand, if you're manipulating digital photos in Photoshop, you're starting at the pixel level. The work of turning 3D scenes into pixels is already done by the digital camera. You can't easily edit the text on a sign in the picture, for example, though there are techniques for making it look that way.
So another way to think of the above pipeline is:
- Maya, 3D Studio Max, etc.
- Illustrator, etc.
- Photoshop, etc.
- physical pixels or printed dots
Friday, August 8, 2008
However, when you hold the Shift key down to force the shape to be a circle, the mouse pointer is suddenly cut loose, and can appear inside the circle. This is, I think, even more surprising than having the mouse be outside the circle.
So I came up with another idea. Basically, the mouse drags an invisible line from the starting click point, and whether the Shift key is down or not, that line should always bisect the shape you're drawing, so the mouse is always on the shape.
You can try this out here:
Again, I'd love to get your reactions, preferably as comments to this blog. (Just click on the "comments" link at the bottom of this post.)
Thursday, August 7, 2008
The problem with this is that the starting point, and the mouse pointer, are never actually on the shape you're drawing. If you draw a line, the mouse pointer defines the end points. If you draw a rectangle, the mouse defines the opposite corners. But with a circle or ellipse, the shape is somewhere inside an invisible rectangle that you stretch with the mouse, but the mouse never touches the shape.
I've always thought that a better way to do this is to put the circle or ellipse outside the invisible rectangle, so the mouse pointer is actually on the shape at all times. The proportions of the ellipse are still determined by this inner rectangle, but now you have more control over where the shape actually gets drawn.
To compare these two approaches, just try out
Note: You'll need to have Java enabled in your browser for this to work.
It may be hard to tell which is easier just from these isolated examples, without actually trying it in a drawing program. I may try to elaborate these examples later, but I hope these give the idea, and show the difference between the two methods.
Which do you prefer?
Thursday, July 31, 2008
That other blog, by the way, was sort of a precursor to this one, so I may refer to it from time to time, but more often, I'll rewrite and repost any good stuff here.
Wednesday, July 30, 2008
could be thought of as a signal of lightness ... a measure of how light each pixel is. I also drew a graph like this:
of that signal. Each of the ramps in that graph is one horizontal row of pixels, read from left to right (darker to lighter). So if you think about two pixels next to each other on the same row, their lightness measurements on the signal might be like this:
In other words, the pixel to the left, which is slightly darker, occurs in the signal just before the slightly lighter pixel to the right of it.
If, on the other hand, we want to locate two pixels, one above the other, with the same lightness, their positions on the signal might look like this:
This discussion is more general. I'm hoping it's not just for artists, but for anyone interested in how art and technology play together. I'll be happy to share what I know about the engineering side of digital art tools, but I'm also hoping to present my ideas about some broader topics like aesthetics, art as signals, etc. Most of all, I'd love to hear some comments and questions back, so I can learn some new ideas.
Some of the things I was going to include in that book:
- Basic math (in non-mathematical terms!!) for understanding digital images, video, audio, etc.
- How digital images work
- Raster images
- Vector images
- Color theory
Tuesday, July 29, 2008
In fact, what I'm really interested in is all of the possibilities of combining art and technology. How is technology used in making art? How is art used in making technology? How do they influence each other?
So, I started a new blog, ArtTechFusion, that is really open to all that stuff. The tech part of the name covers how engineers think about images, video, music, and all forms of digital media. There's a whole area of engineering called signal processing. It's usually taught as a very technical, mathematical discipline, but there are ideas in signal processing that can be understood visually, and can be a really interesting and informative way of looking at art.
The art in the name comes from ... well, ... art. ArtTechFusion is about art, technology, and any combination thereof.
I hope you'll come visit, ask questions, put in ideas, etc.
In the physical world, any quantity measurable through time or over space can be taken as a signal.
Photoshop, for example, is filled with code that uses signal processing techniques to process images. Filters, blur, sharpening, edge enhancement, etc. all come from signal processing.
To understand this a little better, remember that a digital image is basically a grid of picture elements, or pixels, arranged in rows and columns. For example, consider this image:
If we zoom in on Cindy's (the gray cat's) right eye, it looks like this:
Each of those colored squares is one pixel. If we consider each pixel, one row at a time, starting from the upper left corner, we get a sequence of values. There's the upper left pixel, then the one to the right of that, then the one to the right of that one, etc. until we get to the upper right pixel. Then we move down one row and consider the one just under the upper left, then right, etc.
If the image were 10 pixels wide, the order in which we'd consider the pixels is given by these numbers:
In this way, the whole image can be thought of as a sequence of numbers, each representing a pixel value. That's a signal.
Consider an image that has alternating black and white vertical stripes:
If we consider just one row of pixels in this image (indicated by the red box), we can think of the signal as a graph of how much light is given off by each pixel. So the graph of the signal for this row can be thought of as looking like this:
The graph is very low where the pixels are black, because almost no light is given off. It's very high for the white pixels, which are giving off the maximum level of light.
Let's consider another example:
Again, thinking of just the row highlighted in red, the graph of the signal for this looks like this:
The light value starts out very low, and gets gradually higher as we move toward the right edge of the image. But remember that when we get to the right end of the row, we move down a row and start again at the left, so the actual signal for this image looks more like this:
Of course, there are more than three rows. This pattern keeps repeating with one diagonal for each row of pixels.
Is this making sense so far? These are simple examples, but I think they illustrate how images can be thought of as signals (and, I suppose, how signals can be drawn as graphs, which are basically images.)
Sunday, July 27, 2008
The area of technology most widely connected with what we now consider digital art, be it graphics, animation, music, video, or other media, is what engineers call signal processing. Basically, all these art forms are represented as signals ... sequences of numbers. We'll talk more about that, but the most obvious interpretation of ArtSignals is the widespread use of technology ... of signal processing in art.
But, in another sense, technology not only enables some art forms. It inspires and directs them as well. Some art deals with technology as an explicit or implicit subject. A work created in Photoshop means something different from a similar looking work done with more traditional media. Even movies like Star Wars or WALL-E have important technology themes.
In addition, art plays a role in the creation of technology. The clearest example is the abundance of opportunities for visual designers and industrial designers in the creation of new high-tech products. In some sense, you can consider the difference between Apple and Microsoft as a difference in the priority each company gives to design.
Finally, art itself can be thought of as messages, although not always easy to interpret. Art works themselves are signals.
- Technology is used in the creation of art.
- Art is used in the creation of technology.
- Technology is often the subject, directly or indirectly, of art.
- Signal processing, and perhaps other aspects of technology, can provide one avenue for interpreting art.
So I want to use this space to talk about all these things about art and technology. I'm hoping we can keep it light and conversational, and still get into some interesting ideas. Even talking about signal processing, we stick to pictures and non-geeky language.
I've worked for many years in the creation of graphics and multimedia software for art, design, animation, and education. I'll be happy to share what I know, but there's so much more I want to learn. I'm hoping to learn from you.
Thursday, July 24, 2008
But if you're trying to create art on the computer, you have several options:
- Draw it on paper, and scan it in.
- Draw it with a mouse (or keyboard?!)
- Get a graphics tablet
- Use some other exotic device, like a trackball or a joystick or something equally weird.
If you create the art on the computer originally, you can simply select and resize those parts of the drawing. You can also make a drawing in multiple layers, allowing you to try different positions for head, hands, etc. Layers also let you do something like pull in a photo and trace part of it (not stepping on anyone's copyrights, of course) or rearrange it to use as a reference.
The most pencil-and-paper like tool for working directly on the computer is the graphics tablet. Briefly, it's a flat board, usually used with a pen-like or pencil-like gadget called a stylus. There are a number of makes and models, but the best known and most popular are from a company called Wacom.
The main difference between a tablet (and stylus) and a mouse is how it positions. With a properly set-up tablet, the corners of the tablet always match the corners of your drawing area, and the center matches the center, etc. So if you pick up the stylus, move to one corner, and start drawing, you'll be drawing in the corner of your artwork on screen. Not so with a mouse. A mouse only measures movement, not position. So if you pick up the mouse and move it somewhere, it has no idea it's been moved, and will simply continue drawing where it thinks it was before.
This may sound like a subtle point, but once you get used to working with a tablet, you won't want to go back. Note, though, that it does take some getting used to. For one thing, you're probably already used to using a mouse, clumsy as it is, and those habits will need changing. Also, unlike drawing with a pencil on paper, using a tablet typically requires looking at the screen while moving the stylus. In other words, your eyes are not looking where your hands are. I don't have statistics, but from years of developing software for artists, and observing artists adopting software for the first time, I can assure you that this is pretty easy to get used to.
Not surprisingly, tablets come in different sizes, ranging from postcard size all the way up to large drafting table size. If you're shopping for one, consider how much space you have to devote to it. You probably want the tablet in front of you, between you and the screen. Since a lot of graphics software uses key sequences to vary brush sizes, etc., you'll want to be able to reach the keyboard, perhaps with your non-drawing hand off to the side.
Also consider your drawing style. If you like to make loose, sweeping strokes, you'll be much more comfortable with a bigger tablet. For some artists, trying to use a small tablet is like trying to draw a masterpiece on a Post-It note. Still others are comfortable working at small size. One advantage of larger sizes: You can place a drawing on the tablet and trace it with the stylus. I've found this very useful on a number of occassions.
Thursday, July 17, 2008
Now, finally, the U.S. Copyright Office has come up with a way to register copyrights electronically. You can fill out the form, pay by credit card, and even upload the work in almost any of the commonly used formats. There are still some formats and works that require sending a hardcopy deposit of the work, but there's a vast amount that can be processed completely electronically. You even save $10 on the fee.
There's another alternative that lets you fill out the copyright form on-line and then print it. You then mail the printed version along with your work. The printed version will include bar code data of the fields you enter, so it can be processed automatically once it's received by the office.
For more info on all of these options, check out:
Now you have no excuse for not registering!
Friday, July 11, 2008
So the basic blur operation is to look at each pixel in turn, and mix in a little color from the surrounding pixels. Typically, we still want the pixel to be mostly its original color, but with some of the surrounding colors mixed in. We can come up with a kind of recipe for doing this .... mix so much of this color, plus so much of that color, stir ... etc. Let's look at a simple example.
Each pixel (except the ones at the edge of the image) has eight neighbors ...
like a tic-tac-toe board. So one way to make a mixing recipe is to figure out a percentage of each neighbor's color to mix into the center pixel's color. Since the left, right, top and bottom neighbors are slightly closer than the diagonal ones, let's take more color from them. So one example recipe could be
In other words, to figure out the new value for the middle pixel, we take 40 per cent of its color, plus 10 percent from each of the pixels above, below, left and right, plus 5 per cent of the diagonal ones.
So, suppose we have an image with a sharp edge where the top is black and the bottom is white, for example:
When we're modifying the black pixels just above the white area, the recipe will look like this:
So, in total, 20 per cent will be white, and 80 per cent will be black. In other words, we change each pixel in the bottom row of black pixels from 100% black to 80% black ... dark gray. Likewise, when we get to the next row, the top row of white pixels, they will go from being 100% white to 80% white ... light gray. The result
contains dark and light gray bands along what was originally a sharp edge. In effect, the edge is blurred. Notice that only the edge is affected. When you apply the recipe to one of the pixels in the middle of the black area, all its neighbors are black too, so the result will be ... black!
Of course, that's a very simple example. In practice, we'd use a recipe, called a kernel, that covers a lot more pixels, so for each pixel we're considering, we'd mix in a little color from pixels 2, 3, 4 or more away. This is what the radius setting in Photoshop's Gaussian blur function is for.
So, why's it called Gaussian? Because this kind of recipe, which could be visualized like this
is modeled on a mathematical function called a Gaussian distribution, named after the mathematician Carl Friedrich Gauss. Gauss was a brilliant guy. The story is that when one of his teacher's tried to challenge him by asking him to add all the numbers from 1 to 100, he thought about it for a moment, invented a quick way to solve this, and responded almost immediately with the answer. Of course, it's 5,050, as you knew, right?
Wednesday, July 9, 2008
Some of the stuff discussed in earlier posts will reappear, in friendlier form, but I'm really hoping for comments and questions. That will drive the content.