Three-Dimensional Thinking, Part 2

The last time I wrote about three-dimensional thinking, I discussed impossible figures. They are fun ways to challenge our brains to see things in a different way. But to me they signify more than just artwork.

Different Angles

Looking at objects from different angles helps us understand their spatial structure.

Looking at a given subject from different angles is a requirement for creativity. But eventually, in your mind, you realize that reality itself is malleable, and this is the domain of dreams. And dreaming is good for creativity because it helps us get out of the box of everyday experience and use our vision in a new way.

The key

Once I asked myself a question about impossible objects: what is the key to making one?

The key trick which is used in impossible figures is this: locally possible globally impossible. In the case of a Penrose triangle (also called a Reutersvärd triangle because Oscar Reutersvärd was the first to depict it) local corners and pieces of objects are entirely possible to construct but the way they are globally connected is spatially impossible.

I have constructed another impossible figure which is included above. This figure contains several global contradictions, yet remains locally plausible. However, there are two global levels of impossibility in this figure. Let's consider what they are.

First off, there are plenty of locally plausible geometries depicted in the figure. For instance, the M figure is a totally real and constructible object in the real world.

My original drawing didn't actually have M's at the three corners. It was a Penrose triangle. To make the figure compact, I added the M's on each of the three corners of the Penrose triangle. This doesn't make the figure any more possible though. It just adds a little salt and pepper to the mix; it helps confuse the eye a bit.

The next part shows the three strands connected to the three loops that wrap around the Penrose triangle.

There is really nothing about this strong figure that is impossible either. It can be totally constructed in real space.

Actually, it is a nice figure by itself, standing alone. You can see each block sliding by itself through the set of blocks.

And further, I this this figure would make a good logo. It feels like an impossible figure even though it's perfectly realizable. And it can be depicted from any angle because it is an honest three-dimensional construction. I have an idea to construct one out of lucite or another transparent material.

The next part of the figure is the loop. Each loop wraps around one of the sides of the Penrose triangle and creates an interlocking impossible figure, a concept I have shown examples of before in this blog. For instance, there is the impossible Valknut.

But this is the first level of impossibility. Such a loop is not really constructible without bending the top face. In this way, it is related to the unending staircase of M. C. Escher's Ascending and Descending.

The second level of impossibility is, of course, the Penrose triangle itself. When it comes to levels of impossibility and a clean depiction of impossibility, consider Reutersvärd. Pretty much all of Reutersvärd's art contains this illusion as a key. Though, I would encourage you to look at all of his work, because individual pieces can be both stunning and subtle simultaneously.

The next impossible figure is another modification of the Penrose triangle, showing what happens when the blocks intersect each other.

Any two blocks may certainly intersect each other, but to have all three intersect each other in this way is a clear impossibility.

It would probably have been more striking to make the triangular space in the center a bit larger.

Impossible objects take imagination out of the real world and into a world that maybe could be. Perhaps it's the world of flying cars, of paper that can hold any image and quickly change to any other, or of people whose thoughts are interconnected by quantum entanglement. In such a world, imagination can fly free.

Disorganization

Why is it that we need things to be a little disorganized to understand them properly? Because perfect order doesn't really exist and it is most certainly the flaws that draw our gaze and make us think.

Mistakes are classic examples of disorder: an accidental paint spill, or a hand slips and draws an errant line. Perhaps they are intentional: on a whim, we decide to take a different path home, or we try a different turn of phrase or melody line so we can convey our thoughts in a novel way.

Even the need to convey disorder is useful to us. The Firm, in their song Radioactive, evoke a kind of complexity and disorder in the solo with what appear to be random notes.

In fact, I'm not sure that any perfectly ordered world would even be desirable. Consider Pleasantville: when everything is perfect, it becomes irrelevant, and the intrusion of the real world causes things to turn upside-down very quickly. To make the best music, perhaps we have to have trauma and discontent. One of my favorite of this genre is Everclear's Wonderful: childhood trauma makes for the best songs, right?

So music is clearly affected by this notion that increasing entropy is inspirational. But drawings and painting are not immune to this. Recently I wrote about the nail that sticks out, and this testifies to the effect of disorder on progress and disruption. Really, the world wouldn't be the way it is without the crazy ones.

In fact, Darwin would almost certainly agree that humans wouldn't even exist if it weren't for disorder. If DNA just replicated perfectly and everything was stable, we would never evolve. If that stray cosmic ray didn't wreak havoc in somebody's gene, we would still be amoebas. Or, more likely, amoebas wouldn't even have existed at all.

Some say that the stray rays also come from the earth itself. This is true. We have radioactive elements in the earth's crust and so they contribute as well. Trace impurities thus become central to essential change.

Order implies lack of change and therefore stagnancy. Perhaps this is why it is so seldom that I clean up my office! Yet I like to solve the Rubik's cube. This inherently is an act of finding patterns in randomness and restoring order, like solving a jigsaw puzzle.

We can see patterns and images in disorder. Little things become noticeable. Our imagination wanders. We are all looking to make sense of randomness, like when we see familiar shapes in the clouds. Perhaps it's a kind of wishful emotional need.

Let me tell you a short story. Kai Krause and I were visiting Steve Jobs to show him our recent advances in human interface in 1999. I showed the Idea Processor, which was almost all the joint work of myself and John Derry. It featured the concept of disorganization. There were stacks of unsorted pages that could overlap into little messy piles that, once they were in a pile, you could straighten them up. Or clip them together. One could be double-clicked to spread it out for perusal.

Of course, Steve instantly showed us that it wasn't scaleable. But he also made a comment about disorder. "People don't need computers to make messes. They need them to organize." That's one of the things I liked about Steve: he always got right to the point.

But, of course, it wasn't thirty days before Steve walked into our booth at a Seybold show in San Jose, located me in our press room, and set up a one-on-one meeting so he could recruit me.

When I make patterns and texture, I'm looking for another kind of disorder. Well, the patterns repeat and therefore they are by definition ordered. But they look disordered to the eye. What I want is an artful kind of disorganization that is pleasing to the eye. So once again creativity is involved in the crossroads between order and disorganization. Like in the annealing pattern above.

And once again I have applied some principles that don't seem to apply (the principle of disorganization to the process of creating order) and it leads to a creative result.

Creativity and Invention

Invention is the act of making something entirely new or of discovering an entirely new way of accomplishing something, and so often this is a result of trying many different approaches. For me, when one method doesn't work or achieve the results I need, I just try something else. Yet what will make an approach different from someone else's approach is the spark of creativity. To solve the problem, try applying a technique or a principle that, at first glance, doesn't seem to apply.

When I invent things, I know I'm trying to solve a problem. I'm exhausting all of the possible ways to solve it. I'm looking for an efficient way to make use of the information or progress that has been made so far. I'm finding a better way to do it. Or a way to do it at all.

Try Something Unlikely

In ancient Egypt, blacksmiths were good at forming swords other rudimentary tools by holding a piece of iron into a fire to make it malleable and beating it with a hammer. The hammer and anvil had been used for many years, having been invented in the iron age. But sometime around 1450 BCE in ancient Egypt during the reign of Twthomosis III somebody decided that a leather bag could serve as a bellows, and that the increase of forced air would make the fire hotter. Because of this, metal became more malleable, and could even be melted.

This is a clear example of using an unlikely object in common use for something else entirely. A leather bag, used for carrying things, becomes a bellows for metallurgy. Many inventions, in fact, require this kind of discovery.

To make these kinds of discoveries, we must learn about as many things as possible, but perhaps not in depth. Absorbing a little about plenty of subjects is food for invention. It helps you make connections between things that are, for all intents and purposes, not connected in the first place.

For instance: knowing about Voronoi diagrams helped me figure out how best to render fascinating patterns like those produced by raindrops on a windshield. My blog post on where ideas come from is helpful in understanding how to exercise your brain to make such connections.

Try Try Again

But even more discoveries happen a small bit at a time. And the light bulb is the perfect example. Most people associate Thomas Edison with the discovery of the light bulb. But really, he only participated in part of the invention: the part that made it practical.

In 1800, Humphry Davy, in Britain, discovered that applying electricity to a carbon filament could make it glow, demonstrating the electric arc. Some 77 years later, American Charles Francis Bush manufactured carbon arc lamps to illuminate Cleveland, keeping the filament in a glass bottle. Two years later, Thomas Alva Edison discovered that filaments in an oxygen-free bulb would still glow. Then he tried literally thousands of materials before settling upon carbonized bamboo for the filament. The new bulb could last 1200 hours. And it had a screw-in base! But it wasn't until 1911 when modern sintered ductile tungsten filaments were invented at General Electric, that their useful lifetime was increased substantially. Then, in 1913, Irving Langmuir started using inert (electrically nonconductive) gases like argon (instead of a vacuum) inside the bulb, which increased luminosity by a factor of two and also reduced bulb blackening. Nitrogen, xenon, argon, neon, and krypton are routinely used inside bulbs today. However, when mercury vapor is used, the gas itself is the conductor, producing blue-green electric arc.

Of course, light bulbs are being reinvented every few years now. Fluorescent bulbs are used in businesses largely because they are four to six times the efficiency of incandescent bulbs. Then there were compact fluorescent light (CFL) bulbs, sharing the same efficiency advantage, but in a compact light bulb form factor. And now light-emitting diode (LED) lighting. These new bulbs save about 80-90% of the energy (over incandescent bulbs) required to illuminate us. And they last about 25 times longer than CFL bulbs.

The future is going to be just as much about conserving energy as it is about producing it.

Try Harder

The main use for creativity in invention is simply so you can solve the hardest problems of all. These are the problems that don't have an apparent solution.

Two supreme examples of this kind of problem are computer vision and computer cognition. Teaching a computer to understand everyday objects like faces, kinds of clothing, the make and model of a car, and even something as simple as a tree is incredibly difficult. Humans do this very well, of course, and this belies its complexity. Teaching a computer to read and understand a book is also hard beyond comprehension. Small parts of this, like optical character recognition and a small amount of natural language processing have been accomplished. But for the computer to actually understand the subject matter and discuss it, or even better to learn from it, is practically impossible. People dedicate their lives to solving this problem.

A small example of the problem of computer cognition is what I once dreamt about: subject space. I envisioned a space where all concepts are related in different ways. Each concept is a node in the graph of subject space and arcs between the nodes relate them.

Here I show is-a relations as a green arrow between two objects. So the green arrow between FLEA and BUG represents the information that a flea is a kind of bug. Similarly meat, rice, and carrot are a kind of food. This is a subset relationship. Another kind of relationship has to do with ownership or possession. A cyan arrow from one object to another means that the source object can possess the destination. A dog has legs, and so does a bug. A has relation can have other information associated with it. For instance, a dog has 4 legs and a bug has 6 or 8 legs. Any relation, which generally is where the verbs live in this space, can have additional information associated with it, in the form of an adverb. For instance the eats relation can have quickly associated with it.

Action relations concern a direct or indirect object. These are shown in indigo. Legs walk on the floor. A human buys food, and a dog eats the food. A flea lives on the dog. In this way buys, walk-on, lives-on, and eats are relations. And by definition, those relations can have a timestamp associated with them. The sequence in which actions occur affect the semantics. Sometimes in a causal way.

Very complicated relations are two way arcs, like the dog-master relationship. There are other obvious relationships, like is-an-attribute-of, where appropriate adjectives may be associated with subjects. Even idiomatic expressions get their representations here. For instance hair of the dog is slang for an alcoholic drink.

Note that a human has legs but I didn't include an arc for that relationship. This shows that subject space is not planar. In fact, it is n-dimensional.

Such a graph is useful in understanding and parsing the grammar of text or spoken language. A sentence can then be encoded into a series of factual semantic concepts. For instance, if you know the man buys food, then you will have to determine what the food consists of. Based on this graph, it could be meat, carrot, or rice, or some combination of them.

Also, the relation eats really means can eat. When parsing text, the fact that a given dog is eating or has eaten food is yet to be discovered. Once discovered, this subject space graph helps the semantic understanding system codify the actions that occur.

Sometimes the solution, however complex, can come to you in a dream. And this shows a creatively-applied technique, graph theory, and how it is applied to a nearly impossible problem, computer understanding.

Trial and Error

It is quite remarkable when a discovery gets made by accident!

Physicist Henri Becquerel was looking for X-rays from naturally-fluorescent materials in 1986. He knew that phosphorus would collect energy by being exposed to sunlight. And he had a naturally-fluorescent material: uranium. But there was one main problem: it was winter and the days were all overcast.

So the put his materials together in a drawer, including a bit of uranium and a photographic plate, and waited for a day when the sun would come out. When that day came, he removed the materials from the drawer and soon found that the photographic plates were affected by the uranium without being first exposed to sunlight.

And radioactivity was discovered.

My point is that sometimes a discovery is the result of unintended consequences. As for me, I have invented a few effects by accidentally creating a bug in a program I wrote. This is part of the pleasure of working in graphics. In fact, the cool visual effect in my Mess and Creativity post was discovered as the result of a bug in a program that computed image directions.

Trials and Tribulations

One problem, the lofting problem, was an elusive problem to me for years. I spent a lot of time constructing better and faster Gaussian Blur algorithms over the years, and even learned of a few new ones from such people as Michael Herf and Ben Weiss. But it wasn't until late 2004 that Kok Chen suggested that I apply constraints to the blur. And an iterative algorithm to solve this problem was born. This is detailed in my Hard Problems post.

Three-Dimensional Design

It takes awhile for a design to unfold in my mind. It starts with a dream of how something can best function, and, with real work, iterates into the optimal form for that workflow. Yet it's not until it assumes real form that I can say whether I'm satisfied with it.

When designing, I often consider the benefit of workflow I have experienced in the past. Consider maps. When I was a kid, driving across the US in summer, I collected maps from gas stations (back when they still had them). I was trying to collect a map for each state. This is when I became familiar with the basics of functional design. A map had to be compact, and yet describe many places with sufficient accuracy for navigation.

I observed how both sides of a map were useful for different purposes. How many locations of interest were indicated with icons. A legend indicated what the icons meant. This was a time of real curiosity for me. Of essential discovery.

Such hobbies as building geodesic domes and technical illustration kept me focused on function for the longest time. But eventually, in high school, I discovered Graphis, an international magazine of graphic design. This struck a chord with my innate drawing talents. And suddenly I was also focused on form.

And then it was impossible function that caught my eye. At Fractal Design, I continued this design philosophy. Here is an illustration from those days, reinterpreted in my modern style that expresses form. A wooden block penetrates through glass. This is ostensibly impossible, of course, but it was in tune with my sense of materials and their simulation in UI.

At the time, I was lost in a maze of twisty passages, all alike: the labyrinth of UI design.

John Derry and I were concentrating on media, and had been since Dabbler introduced wooden drawers into paint program interfaces. Like the paint can, it was a return to the physical in design. Interfaces needed something for users to conceptually grab onto: a physical connotation that made the interface obvious to the user.

One project I was developing at the time was Headline Studio. This was an application specifically intended to create moving banners for web ads. It concentrated on moving text. So when working on a hero logotype, I sketched out these letters. The idea was that, in a static illustration, the letters might appear to be walking in. And the addition of the cursor was a functional cue. This ended up being pretty much what we used.

Every bit of Headline Studio was designed in minute detail. This included many designs that were not used. For instance, I show here a palette that was rejected because it was thought to be too dark.

This brings up the subject of visual cues. To visually cue the user to thinking of a palette as something to adjust the image, we chose simpler designs that those we used for windows. But sometimes we went overboard on palettes, as you know from the Painter UI design.

In the Headline Studio timeframe, we started thinking about three-dimensional UI. We considered different three-dimensional functions. For instance, we considered the window shade.

A window shade is hidden when you want to see out, and you pull it down when you want to block the view. At the time, there was a trend to make a window collapse to just its title bar when when you double-clicked it there. I considered that to be an extension of the window shade.

And by extension, we could turn palettes into window shades so their controls could be accessed only when they were needed.

Eventually this technique was replaced by the expanding list with the disclosure triangle. We liked this because when the list was closed, certain crucial data could be displayed in the list element. The user could thus discover the current state of the most important controls in a quick glance, even when the list was closed.

You get a bit of that here where the current color is displayed even when the palette is rolled up.

And like a real window shade, a small amount is shown to grab and slide down. This sort of technique would work even now in the multi-touch era.

You can also see a nod to the three-dimensional look, because the palette bar has depth. This makes it more sensible to the user that it can somehow contain the rolled-up shade.

The real cost of producing a three-dimensional UI is the need to develop an visual language of controls. Take for example the humble check box.

It has been a box with an X, a box with a check coming out of it, even a simple bump that becomes a different-colored indentation. Eventually the box with the X became a close square in a typical window (though Mac OS X uses little colored balls. Which really are very nice, I think. The close ball uses an X, of course).

But the check box is really an on-off item. It could easily be a ball in a box that just changes color when you tap on it, for instance. On and Off? Red and Green? Or it could be a 1 and a 0.

You become endlessly mired in an array of choices when it comes to this necessary visual language. And some things just don't make sense. Eventually we came to the conclusion that objects were more useful than icons. Because the objects become more readable and their behavior is already known.

When we came to sliders, we realized that they were also used as visual indicators. Having played a pipe organ from time to time when I was a teenager, I found that drawbars might make a nice physical metaphor.

Here is a prototype for the actual sliders themselves. One of the metaphors used was like a ruler with a dot at the end. This dot marked a grab-point. You could tap and grab at that location to extend the slider to the right. This would increase its value. The marks at the bottom give you an indication of the magnitude of the slider's value. Another more drawbar-like metaphor is the glass semicylindrical rod. You can see its magnitude based on the number of lines you cross (and which refract into the rod as you drag them over).

This was an example of form leading function, but it was compelling enough to experiment with. If you turn this one into a real control, it must be possible to have several of them, like drawbars on an organ.

Another way to look at them is as a bar chart. Each parameter has a magnitude that is indicated by the length of the glass rod. The interface is three-dimensional, as you can see. The section to the left of the bars is thick enough for the bars to be embedded into.

Probably the inclusion of even more shadows would make it visually more interesting and also more easy and obvious to interpret.

These are re-drawings of my original sketches from 1999, colored and rendered using a woodcut look.

The idea of using a sticky note that sticks out of the edge of a three-dimensional pad was one simple physical construction that seemed useful. But how? In real life it is used to mark a place. Sometimes it is used to specify where in a large document you need to sign.

Either way, it was similar to a bookmark in the web: a quick way to get back to a specific place that you want to remember

The pad signifies a multi-page document, like a PDF. So, how might this be envisioned in actual use? I actually drew out a few examples. And here is one.

This shows an idea for a storyboard project. The storyboard is the multi-page document, with frames showing in sequential order. Different scenes might be marked using colored tags. The blue arrows allow the user to sequence through the pages in the normal linear ordering.

Probably the colored tags would live in small piles like a sticky pad. The user can click and drag a sticky note from the pad to tear one off and continue to drag the note to the document for use as a placeholder on the current page.

A nice, clean three-dimensional interface for non-linear access to a linear document!

Here's another three-dimensional interface, used for a document window. It's kind of a gratuitous use of 3D though, as you can see. Still, it features an infinitely thin document, like paper, stretched in a frame made up of the scroll bars and the title bar.

Perhaps the red item in the corner is a close box.

Down in the corner is a kind of tactile device used for adjusting the window size. All of these parallel what a window has in it right now, of course, and has always had in it.

It's all about using a different visual language for the UI elements, which is something you have to choose before developing a UI in general.

Here is another, more generic example, devoid of the accoutrements of a title bar. It shows that it might be possible to put transparent stuff into an interface as well.

It is unlikely that I had any idea why I wanted a transparent element in the interfaces (I have colored it green to single it out). It is another example of form leading function.

I am still interested in how such an element can be used, though. It does look cool. It is also possible to make the document itself transparent. This might even be a nice frame for a layer in a touch environment. Consider touching the layer, and then having some controls appear around it. In this case, the three-dimensional interface makes more sense since they are like objects that appear on touch command.

But you can consider elements like the blue arrows in the storyboard example above. They could be made transparent easily, with no real loss of readability. And that would look cool as well.

And what, I wonder, is the shadow being cast on? The elements seem to float in space in the example. It is an example of a visually interesting impossibility. If we were going for true realism, this wouldn't qualify.

And that, in a nutshell, is one of the endearing qualities of three-dimensional UI. It doesn't have to simulate something totally real. It can be magic, simply transcending reality.

The amazing thing is that, as a user, you still get it.

When it came to the Headline Studio packaging, I needed to come up with a way of showing animation on the box: a completely non-moving way of showing animation. I came up with several ideas, but this one stuck in my mind as a good way to show it.

Once again, three dimensional design becomes a useful tool, because it helps to replace the missing dimension of time.

Why I Like to Draw

Drawing seems like something that is just built in. When I want to visualize something, I just put pen to paper. But why do I like to do that?

It exercises my creativity, for one. And my right brain needs a bit of exercise and use after doing programming all day. But it's more than just exercise I seek.

I also seek to bring what I see inside into some kind of reality. I like the interrelationships between the spaces I see. Positive space and negative space. Three-dimensional space. Containment. Folding. Entrances and exits. Liquid spaces.

All these qualities are enfolded into a single unit: the illustration. I feel there should always be more than one way to look at it because is multi-sided.

It Starts With Media

I have been drawing for quite a while. But I think I learned most of my craft in early grade school. When I went into High School, as a freshman, a friend and I took an advanced Art class and this is when I started drawing ever more ambitious projects. Mostly I worked in felt pen, which suits me even now, since I have been using Sharpie on thick white paper as my main medium. Or at least my main traditional medium.

But I also liked to use pencil. I bought Faber Castell Ebony pencils and thick, rough paper.

It's really this medium that got me started on Painter in 1990. I loved the rough grain and the progressive overlay of strokes to create shading. Shading brought out the spaces I could see in my mind, and made then into real objects.

My main medium has become something quite different now. It is Painter.

Disrupting the Art World?

What happened when Painter was introduced? Well, there were a lot of artists who didn't need to go to art stores any more. This was a form of disruption, I think. But I doubt that art stores will go away any time soon. The traditional media are still quite compelling. And they are probably the quickest way to learn.

Yet disruption is like chopping off the golden tip of the pyramid and walking away with it. The old one crumbles slowly, having lost its luster, and the new one becomes a smaller, faster, better version of the old. And because it's mobile, you can have it in your hand rather than having to go out to the old brick-and-mortar to see the pyramid. In the digital world, this is like digital delivery: you can read the book on your iPad without having to go to the library or bookstore. The advantages are easy to see.

In the same way, Painter has all but eliminated my need to buy pencils. The Ebony pencils I own are ten years old at least.

The Mechanics of Replacing Traditional Styles

I learned to shade in Painter, using one of my first creations, the Just Add Water brush. I would apply colored pencils, which gave me a varied color with grain. In a shade that wasn't too primary. And then I would use the Just Add Water brush and smooth it out into a cohesive shading, like watercolors.

Recently I have taken to a woodcut-like shading technique. It's a bit like engraving. Usually black lines delineate the subject and the shading is applied in a manner similar to the way a linoleum-cutting tool works.

In Painter, I sculpt each of these shading lines separately, often going over the edge of it five or six times.

Drawing From the Mind

But the main thing for me is the form I am drawing, like a two-dimensional sculpture. Many times a drawing is really a projection of a three-dimensional concept onto a two-dimensional surface.

To enhance the rendering, I sometimes employ a "watercolor overlay", which is a layer with a Gel composite method. I can draw into this layer to add color to the illustration. I can use Just Add Water to soften the edges of a color change.

While traditional media are still the easiest way to learn illustration, Painter may be the easiest way to experiment with different media.

Most of my recent illustrations concentrate on three-dimensional relationships. The letter A with some depth, but hand-wrought. Interconnected boxes. A pyramid with an eye in it. Some of these are new versions of my older sketches. But all of them feature some overlap, folding, interlock, or holes.

Take for example this piece. Two S-shaped pieces of rebar interconnect, showing a very small weaving. There is over and under, interlock, shadows, and also shading. It's all tied up in the way I think about things, and what I find interesting.

I draw because I want to show what I'm thinking about. I want to freeze the thoughts and make then concrete.

And the way the illustration interweaves with my text is also quite important. Sometimes the drawing gives me ideas, and even defines the discourse.

Sometimes drawing can be like solving a puzzle to me. I must figure out where the pieces have to go before I can compose them properly. Painter saves me because in the digital world I can draw construction lines and totally erase them afterwards. Or I can draw crudely and then rework edges to make them straighter after the fact. The digital medium is extremely malleable. It has changed the habits of artists since Painter came out. Features like mixed media all in one package, undo, and perfect erase make the digital medium the ideal place to try stuff out for your next illustration.

Inspiring Sources

When I draw, it is therapeutic to me. And the good thing is to produce something you can look at.

The style I choose is a bit like engraving, as I have mentioned. These are inspired in part by the Flora Danica prints and illuminated manuscripts.

Chet Phillips, who has inspired me by his creativity, also likes to use the scratchboard-watercolor style. His imagination in creating characters seems to be unparalleled. And much like in the old work of Fractal Design, old items are repurposed in style and substance to make new fantasies of illustration and storytelling. He even uses magically-transformed packaging to build his works.

More Than an Illustration

The whole package, extending illustration into more than just pictures, is also why I like to write. While an illustration can leave me hanging by a thread when I look at it, a full-blown explanation can cinch the knot tight around your subject and create an artful connection to the reader's mind.

Two Sides

Someone is saying there are two models of innovation. Some people say innovation is simply an investment, and that anybody can do it with enough money. Others say it is simply difficult, that good ideas are merely rare and it's just hard to innovate.

They're both wrong.

Where Does Innovation Come From?

Innovation comes from creativity and focus. Creativity is the willingness to try different ideas and map them onto what you are working on. Focus is the ability to turn away even great ideas in order to develop a clear, simple, easy-to-use product. This approach produces iconic results that are valid for the market because it's obvious what their benefits are. This is the fearless approach.

If you have the right mindset, this technique is not as difficult as it looks. But your typical fat corporate entity operates based on fear: the fear of failure, the fear of being fired because you are a renegade, the fear of trying new things because if it ain't broke, don't fix it. In such a world, the nail that sticks up gets hammered down quick.

That's not my world, and I have great sympathy for people who live in that world yet still want to break out and be creative. But consider where they might be working.

Large corporate environments are afraid to take the creative angle on a product. They will stick with what works, and if they are not successful this often means slavishly copying what is already successful. They are afraid of trying something new.

Large corporations operate according to a time-tested investment technique: diversity. The more diverse the investment, the lower the chance of failure. Once again, this is a fear-based choice.

This technique is fundamentally incompatible with focus because you want to diversify your product portfolio, like Sony, which makes thousands of products. Their motivation is to satisfy each market individually to achieve 100% penetration into their marketplaces: there's a product for everybody.

Unfortunately, this technique can't really work. When you aren't focused on a small number of products, you unintentionally water down the quality of each one. Pretty soon nobody wants your products because their design is diluted, their user experience is lowest-common-denominator, and their quality is simply insufficient.

But let's take the flip-side of the argument: the focused, iconic result doesn't always prevail. In order to make this approach work, you have to do almost everything right. The product must necessarily have a really important hook, a life-changing aspect to it.

Once in a Generation

Game-changing ideas seem to come only once per generation. Like a bolt from the blue they make people think differently about their world. They transform daily life, business, and even relationships.

When the iPhone came out, I compared it with holding the future in your hands. It is true that before the iPhone, almost all smartphone devices employed a small screen and had a keyboard. The idea of using a touchscreen device in everyday life was suddenly upon us.

Some say that all information should be free. That technology is free and that once something can be demonstrated, it becomes fair game for everyone. Some say that music, books, movies must all be free.

They are wrong.

All of these forms of content and invention take time and effort to develop. They are the result of sweat from the brows of many good people. A writer of a book generally believes that their content is their own and that they should in fact be paid for their contributions to the art.

But like the baker who gives away the tasty samples so you will go get more, sometimes the artist will release one of their works in a form that can be shared. But that doesn't mean that all their works should be shared as well.

The same is true of the intellectual property that makes advances in technology.

How To Compete?

The best way to compete with innovation is to innovate. Show your best. All ideas don't have to look the same.

But to do that, you have to be able to support both innovation and focus. This means that you will have to start doing things in a very different way. This means the very structure of your corporation must be different. The very way of developing must change.

Personally, I'm don't really believe that most corporations are up to the task.

You will have to rebuild your corporation from the ground up, step by step. Each incorrect layer might be a mistake, so you should be very careful how you do this.

But, make no mistake, it can be done. For instance, Microsoft has shown that the iconic iPhone interface is not the only valid interface. It can be countered by using good ideas and taking a chance. Being fearless. But Microsoft, with its Windows-based corporate mentality, has a long way to go!

Back to Drawing

After a hiatus, I like to start drawing again to clear my mind. Usually it starts with pen on paper. And eventually it finishes with a tablet and stylus in Painter.

I have been on a big project with lots of details recently, and hence the lack of posts. I must apologize, but sometimes work does call!

And when drawing comes back, like when music comes back, there is a lightning bolt moment of realization, like I have been swimming in a deep sea and I finally washed up on dry land: that drawing is a golden touchstone of my existence and how could I ever live without it for so long? The end of dark days and the start of a golden age, a renaissance of expression.

There is something ineffable to this moment. So I have attempted to create a smart banner to show my inner joy. This is the first piece I did after joining the living again at the end of the long dark tunnel.

In this work, like so many others I have done recently, I am attempting to create clean lines. Lines in search of a woodcut or linoleum cut look. Lines sculpted and individually shaped. But still irregular and hand-made. I can't see the value of perfection in this kind of work, like someone used illustrator to create the design.

If I used Illustrator to do this, I would have to continually play with the result because it would look too regular. Perfection still has a hand-made look, to me.

The second piece I created in celebration of having time to solve the Rubik's cube again, which I find to be another touchstone of my inner self, is this one.

In this piece, each line is once again sculpted. Drawn and re-drawn. Tapered, carved from left and right.

I created this by setting up a clone and drawing using crude, fat lines wherever I saw an edge I wanted to keep. This produced a very dumb-looking drawing in black lines on a white page. being unsatisfied with the look, I began to sculpt the lines to create a look that simulates using a ductal carving implement in soft linoleum. It took hours and hours before I had a piece that was worthy of coloring. It was in black-and-white and actually made a pretty nice drawing in and of itself.

Then I colored the cube. But I switched around the colors, which were originally yellow on top, green to left, and orange to right.

To shade the hand, I created a layer of the original picture and set it to gel, pasted it on top of the image, and carved away all the other parts of the image using the eraser.

Then I processed the remaining image, with locked transparency, using Just Add Water to create a smooth shaded version of the image. Because it was a gel layer, it preserved the black lines underneath it. I think I lowered the opacity as well, to give it an ethereal look and also to favor the lines.

I also started using a chop mark, which also smacks of a woodcut. I imagined the woodblock coated with orange and red paint to give it more of a hand-work look.

The original piece is almost three thousand pixels high, by the way, since it comes from an iPhone 4S frame grab.

Siri, where did I put my tablet?

Drawing On Your Creativity, Part 4

Just a small post on my birthday: a little present to you. In a world of Instagram snaps and Hipstamatic effects, actual hand work is undervalued these days, so I have sought a style for my blog posts which uses handmade illustrations. This also conveniently relieves me of the problems associated with copyright infringement.

Why Not Hand Illustrate?

All the logo work I have seen recently, for instance was done in Illustrator, a brilliant Bezier-spline-based tool for cleverly crafting the smooth edges of figures. And it has grown to be so much more, with its incredible control over negative and positive spaces. But, to me, there is a pleasure in crafting something by hand, shaping it, cleaning it up, styling it with real brush strokes, and hand-coloring it. There is so much more life in hand-illustrated artwork. Imperfection is simply part of the style.

Hand Work: Bridging the Domains

For me, hand work always starts with real paper and a real ink implement. This used to cause me some worry: worry about making mistakes, blotting out a section, making a line too thin or too fat. But I have learned to just start over until I get something which is approximately right. I use this same approach in songwriting.

The reason for the "just good enough" approach is that I can edit it later using digital means. For music, perhaps I can use ProTools, Ableton, or even GarageBand to shape the final result and re-record overdubs. For artwork, I have confidence that I can make it right using similar hand work in the digital environment. Suddenly it becomes possible to rework "permanent" ink lines and even to erase them. Work that was simply impossible in the pen-and-paper domain. Suddenly, in the digital domain, we are in the world of undo and pure unadulterated color.

I use Painter with a Wacom tablet for this work, but, of course, it can also be done in Photoshop or any paint program with good support for a tablet. I also envision doing an increasing amount of work on my iPad. In the mobile environment I use a Wacom Bamboo stylus to do my drawing. Drawing with a finger, while interesting and convenient, is a bit restrictive and inaccurate. Especially with my big fingers.

For hand-drawn traditional artwork good scanner is always important for bridging these domains, and with this comes some tonal compression and re-interpretation of the colors of the work, which is why I stick to black-and-white for my sketches. This means that simple equalization and gamma correction can convert your sketch to something that becomes useful in the digital domain.

Hand Work Entirely in the Digital Domain

OK I lied. Sometimes my hand work doesn't always start with pen and paper. This is because there is also extreme value in starting in the digital domain and staying there. In this environment you have several advantages that are not present in the pen-and-paper domain. For instance: cloning.

A specific example is shown here.

But instead of cloning, this is more to the tune of using the original as a reference.

I proceeded by opening an image captured using an iPhone. Then I cropped it to a good size and brought the smaller image into Painter.

Once there, I created five serigraphy layers using Effects:Surface Control:Serigraphy. This mimics a silk screen process, and creates layers that I can move into any priority that makes sense.

Then I collapsed all the serigraphy layers into a single layer and proceeded to rework every edge in the layer, selecting colors, redoing edges using a tiger stripe look characteristic of woodcut or linoleum cut.

I had to introduce several new shadings where there was none before.

And I am left with a self-portrait in woodcut style. I would like to say that it only took a few minutes. But in fact it took several hours. Actually, I'm still not completely satisfied. I figure about twenty hours of work should do it. But who has time for that?

Drawing On Your Creativity, Part 3

I like to draw. I just can't help it. The process of sketching and drawing has always interested me. As with music, if I stop for a while and then start again, it all comes pouring out!

As the original author of Painter, of course, I had to study drawing from many angles. Now, when I draw, I feel a certain freedom in simply returning to the art without the burden of analysis. And I can begin to realize just why I started drawing in the first place.

Doing the Clean Line-Art Style

I keep thick pieces of standard-size paper around to sketch on, my favorite creative weapon being an ultra-fine Sharpie (retractable!). Drawing, for me, is a way to exercise my creativity.

My process for making art has been documented in this blog post series before: scan into Preview using a networked scanner, tonally adjust and crop, export to JPEG, import into Painter, clean up, resize to blog-compatible sizes using Preview again. Sometimes I will use a gel layer in Painter to colorize, particularly when I'm doing a technical illustration.

One of my styles is thus a clean, line art style with the hand-wrought look that is usually lost with Adobe Illustrator. A little like a woodcut. All of the pieces shown here were done in this manner, in the last few days. I have been practicing my implied edges: a cool form of negative space.

I like to use my desktop for most of my posts because it simplifies my process and allows me some very nice editing opportunities. I like to edit using the Wacom tablet in Painter.

Rotating the Image for Sketching

One of the reasons I like this is because I can rotate the image, making all my hand work more natural and ergonomic. In Painter, you can hold down the space bar and the option (alt) key and rotate your image by direct click-and-drag in the image. With the same keys held down, a single click restores the normal orientation. But, as I draw and clean up lines, I generally keep the drawing rotated at whatever angle most makes sense.

I learned this workflow with sketching by watching Disney artists in studio. Their old-school sketch workstations had a turnable easel. I would bet that they have something much more like Painter these days. Because I thought to migrate that workflow to the computer.

Ideation

So, I'll get an idea and ponder over how to express it in this style. When I get an idea, I like it to be one that's out of the box, not in the box.

Sometimes I will go back to the old sketches from the Painter days and I'll get an idea that I might have pursued once, but is lost to me now. And to re-examine it and explore it afresh is exhilarating. So much has been packed away. There is so much to rediscover.

Other times I will think of an idea, like Up and Down and have an internal vision for how I would like it to appear. When it intersects another of my favorite pastimes, like impossible figures, then it is settled. I begin to draw. So it's all in the perspective: how you look at it.

With Up and Down, I actually drew it a few times before I got the right shape for it.

I chose the impossible picture, with entrances going into space that simply can't exist, to make the sketch more of a personal expression, more my style.

When I was a kid, I used to have my room in the upper floor, and then later in the basement. So I know the feeling of going up and down stairs quite well, and the feelings when it changes from up to down.

I chose to let the color connote shading in this one. And the blue for sky and red for, well, the fiery depths. More allegory. Just a tiny bit of symbolism. But in my house as a kid, the upper floors had more sunlight or overcast light, which had a bluer color temperature. The lower floors had a redder light, because we used incandescents there.

In my post about iconic things, I draw several figures that derive from the concept of One. When I was drawing them, I imagined a mould that you could pour lead into that could make a three-dimensional one.

Some Technique

This is what I could envision. I just now drew it but I used a creative technique for the cross-hatching. This time, when I sketched it, I did the cross-hatching by hand. Then when I brought it into Painter, I brought each of the different directions of hatching into a separate layer so I could sculpt their shapes separately.

I tend to use a tiger-stripe technique for simulating woodcut looks. This comes from the V-shaped tool that is used to carve out linoleum and wood blocks and the shapes that they make in the blocks.

In scratchboard, a similar look is achieved. This ease of width-control was the reason I created the original scratchboard tool in Painter.

So this sketch actually comes from a six-layer image.

Iconic Patterns

I demonstrated in the iconic things post that there were speckles that didn't just use dots when you render them. The old Good'n'Plenty design. Here we have a design where there is a complete 360-degree freedom to each placed item, which is the ultimate speckle. Even the hatchings that I demonstrated before only had a 180-degree freedom to their placement.

I can imagine controlling the direction of each item by a random process, like the one I used to create the hatchings, or by using the directions from a vector field. You could create random flockings of bird-symbols in this way.

Often, in architectural renderings, random tree placement, with different sizes, is used to stylistically symbolize a grouping of trees. Sometimes this kind of pattern was used in the formica tables of the 1960s. It's worth looking up. Thinking about patterns and the way they fit together is one of those little creative things you can do.

Liquids and Different Perspectives

In a continuation of the earlier pieces here, I thought I would do more liquid stuff, because I have been doing that kind of rendering since I was young. It was always an excuse for shading, and as you may know by now, I do like to shade things.

Drops of water or oil are fascinating to me. When I was a kid, I would sometimes look at the world through the drops or rainwater on the outside of the car window. I could see the world as a microcosm of distorted figures, and back then it was a good exercise for my brain to see things from a different perspective. I love the pattern of raindrops on a windshield: the way they avoid each other, the way they coalesce, the natural pattern of their look.

Real raindrops don't actually look like these. They are really globules of liquid, and they move and wobble as they fall. Kind of like metaballs, they have a shape defined by surface tension and equilibrium. Water drops are free from many forces, when they are in flight.

I used to look at liquid mercury, and marvel at the shines. I think that reflection and refraction have always been of interest to artists' perceptions. I'm thinking Vermeer, of course.

But these liquid renderings are more about stark shading than reflections and refractions.

Rendering the quality of reflection and refraction in line art is rather complex but a laudable goal. When you hold a drop of water on your finger, I often have watched the fingerprints beneath become magnified to a huge extent, and the skin also took on an interesting glow inside the drop, due to the caustics (concentration of light by the bending of rays by refraction) created by the shape of the bead of water.

Along with a bright shine on the drop, it creates a marvelous miniature scene, allowing us to watch yet another perspective: one magnified instead of the one viewed through the car window that seems to shrink the entire world into a single drop of rainwater.

As a small kid, I was nearsighted, and so things like this would constantly be of interest to me.

Other perspectives interested me as well, as a kid.

Like the doorway. Both entrance and exit, it was the thing that kept the kids captive in the schoolroom, or kept them out. Being the guardian of in and out, a door seemed more profound to me than just a block of wood on hinges.

And, while I was at it, what made the inside in and the outside out? Why couldn't things switch? Another perspective change, quite relevant in the 1960s.

After all, I watched Star Trek, so I knew that doorways could be more than just a way in and out. A door could be a portal to another planet or even to another dimension.

So, when I tried my hand at Up and Down, initially I thought of something we were looking into directly, even with glass doors.

This is the original sketch for Up and Down. Actually, unlike the final product, it didn't really have any magic. That's when I thought about the impossible version.

It is the change of perspective that makes this kind of piece work. When you get to drawing, liquify your workflow to make your sketching smoother. And pour on the creativity!