The Illustrated Evolution of Painter UI

Most of the comments I have gotten about Painter's UI over the years have been about how much stuff there is in it. We did implement features about twice as fast as we could organize them, I think. This is a history of that process. If you need someone to blame for its complexity, blame me. If you need someone to praise for how well we handled the complexity, praise John Derry. The images come from a Japanese web site. The commentary is mine, of course.

Painter and Painter 1.2

Both Painter 1 (just called Painter) and Painter 1.2 use this kind of splash screen, which was a rectangular selection grabbed from the original art of the paint can which I painted for Painter 1. This artwork is found on the cans for Painter 1 and Painter 2, as well as the Painter 1 poster. It was painted in August of 1990 at my Mac IIfx workstation using a Wacom tablet and Painter 0.9, an early version of Painter.

Note the ugly dark-green Fractal Design logo (which I designed, BTW). OMG.

The Painter 1.2 user interface shows the very start of our UI. A palette each for tools, brushes, colors, and papers. For controlling brushes behavior, there are the brush size, brush behavior, and expression palettes. For selections in Painter (called Friskets in early versions) there was the frisket palette and the fill palette, which also helped control the paint bucket. Finally, a correction window was more a modal approach to the brightness and contrast of the image.

Note the color picker was a triangle, but with a hue slider at the bottom. The brush icons were a bit inconsistent, and featured gigantic images.



Painter 2.0

Painter 2.0 saw the influence of John Derry. John had a much more literal approach to splash screen design, as you can see. Also, note the inclusion of John Derry and Bob Lansdon as authors of Painter. Bob did work on the watercolor brush technology. Note also the trademark on Natural-Media.

The design of the splash screen is heavily influenced by the CRC Handbook of Chemistry and Physics, which features the same color scheme and gold press. The Fractal Design logo has changed, meanwhile, to the "Big FD" as we called it. The real Fractal Design logo has color paint strokes inside it. Here it was decided that the color paint strokes would ruin the effect John was trying to achieve. For the new logo, John Derry designed the shapes and I designed the brushy fill. Later, Cleo Huggins produced a high-resolution PDF version.

For Painter 2.0, we added Brush Looks, which were presets that we used as a tool to cut through the complex interface for the brushes A brush look was the combination of a brush, all its modified settings, and a paper texture. You could design the icon for the brush in the Brush Look Designer, another palette for trying out a brush and its settings before you went to use it. Most of the features added to Painter 2.0 were brush capabilities, including things like angled tips for the brush, clone location variability, control over the smeariness of a brush using Resaturation and Bleed. The random grain brush strokes capability allows the grain to move around with each dab of the brush that was deposited to the canvas, creating a much better textured look.

We supported tear-off brush variants, brush looks, and textures, so the screen space could be minimized for a user working on a specific task. Incredibly, we added scripts to Painter 2.0. You could play them back at a higher resolution. The brush stroke designer was driven by a script for a brush stroke that could play back with the new brush settings whenever you changed them.

I created two special effects that were unlike any other program at the time. The first was Apply Marbling. This allowed you to create marbled textures like you get when you drag rakes and tines through the surface of a liquid that has spots of ink on it. The second was Apply Lighting. This allowed you to light an image by conical light sources to achieve spot light and other natural lighting effects.

A new brush, called the New Brush Model can be seen in the Brush Behavior palette. This brush was characterized by a cylindrical arrangement of bristles, some portion of which could touch the canvas during any one point of the brush stroke. The diagrams for how this worked are shown in Creativity and Painter, Part 1. They are the yellow pages.

Painter 3

With Painter 3, John and I introduced the world to the image hose.Our new product manager, Steve Guttman, and two new programmers, Priscilla Shih and Shelby Moore are credited as well. We show the real Fractal Design logo here in all its colorful majesty as well. A reference to the '620 patent is seen at the bottom. This patent was for tiled textures interacting with a brush, and Lambert/Beer build-up, which enabled color pencils, charcoal, and felt markers.

John Derry's splash screen used a rocky texture background and the image hose to make it look more natural than it ever had before. The golden letters theme was maintained, though.

The Painter 3 interface was a radical departure from its predecessors, showing the organizational influence of John Derry. Toolbox buttons were now sculpted like the keys of a retro typewriter. The palettes are now gray-backed and the icons are much smaller. The numerous brush icons are now located in a drawer-like structure that can be opened up and closed. We first started toying with drawer-based interfaces in Dabbler. Each of the palettes has 5 graphically-represented sections. Friskets have been renamed to Paths, at the request of Steve Guttman. Our implementation of Layers, initially called Floaters, was debuted in Painter 3 as well. The Nozzle section in the Brush Controls helped the user choose the kind of images that are used with the image hose. With Painter 3, each action you did is now recorded in a script, so it can be played back, even at different resolutions. Color Sets, Gradations, and Weavings have been added. I added multiple undo as well. Painter 3 (including version 3.1) was clearly the single largest change to Painter yet.

An important UI feature was the ability to tear off art materials, like the color palette or the paper palette. Yet they were also nicely organized. This tear-off feature worked with any palette that contained icons.

Oh, and you could make a drop shadow for a floater with the push of a button.

Painter 4

Now comes Painter 4 in 1995. In Skagen, Denmark in the summer of 1994, I coded a mosaic tool, based on the polygonal boolean operations. In this model, one vector-based mosaic tile can be used to clip another. Outsetting operations allowed me to enforce grout requirements. The influence of the mosaic tool is seen in the splash screen, produced by John Derry. The gold letters are now bevel-edged. A dappling of light and shadow graces the image. The venerable Glenn Reid, Vahe Avedissian, and Christy Hall (now Christy Brandt) joined as authors.

Sorry, this UI screen shot is in Japanese. But you can see that individual art materials are torn off into their own palettes. There is a new art material: patterns. There are additional tools for Shapes editing and for shape creation. The gradations palette allowed rotation of the color ramp, and it also allowed different topologies for the ramp: linear, polar (radar), circular, and spiral. Scripts got their own palette, and it had a transport deck for playing scripts back like you might play back a video. Note that the Shapes tools got their own little mini-section in the tools palette.



Painter 5

In 1996, with Painter 5, we added several new kinds of brushes, including liquid metal, fire, and dodge and burn. The influence of these brushes is seen in the splash screen, created by John Derry. You can tell it is his by the painted mark of a hand, which is one of his signatures. Scott Cooper and Erik Johnson are now on the author team.

We added many new kinds of brushes to Painter 5. There were brushes for blurring and sharpening, for bulging or pulling the image around. There were brushes for fire, glow, dodge, and burn. There were liquid metal and transparent water droplet brushes, complete with shines. You could add grain with a brush and change the hue and saturation of a section of the image, while leaving the luminance alone, for easy tinting effects. A relief brush allowed you to draw the surface texture of the image separately from the color of the image, and you could even twirl an area of the image directly. The various distortion effects were supported internally by a vector field through which the image was advected for display, kind of like Kai's Power Goo.

In the UI, you will notice that the icons and the color picker and other screen objects are laid into the gray background rather than having a drop shadow as they did in Painter 4. This further cut down on screen real-estate, and provided less conflict for the eyes. Some of the icons went to half-height also.



Painter 5.5

In Painter 5.5, we added a web-safe palette, and some features for cutting your image into sub-rectangles for easier inclusion into a web page. This is especially useful when some parts of the page design use flat colors or have less detail and can thus be compressed more effectively than others. The additional web features of Painter 5.5 was the effort of some of our new Ray Dream personnel (François Huet, Damien Saint-Macary, and Nicolas Barry) and Scott Cooper.

Meanwhile, I was working on a completely new brush model for the next version.

You also see a new logo on the splash screen, the trefoil knot of Metacreations. This company was the result of the merger between MetaTools and Fractal Design. I began spending more time talking with Kai Krause about new interfaces and features.



Painter Classic was a feature-limited version of Painter, kind of like Painter 4. It was a lower-cost product and designed to be bundled with scanners, cameras, and tablets.

Painter 6

When the feature set for Painter 6 was being discussed, I brought up my brush testbed. This project was my skunkworks for new brush models, where I had employed object-oriented programming using C++. In the new testbed, I had implemented several kinds of new physically-modeled brushes. The first was the multi-bristle brush. With this brush, each bristle had its own path and could allow for splay of the bristles. In addition, each bristle had its own color as well as its own internal model for picking up color from the image. The bristles were initial organized in a bristle bundle, which was based on an irregular tight-packing of spots. The look of the bristle bundle was based on the "monkey eye receptor" model, since the bristles were really in an organic cellular arrangement. To make this packing, I had a special tool for computing bristle arrangements that used reverse gravity to create a very regular spacing indeed. The arrangements were additionally computed in a fold-over square that could tile the plane with this arrangement. So I could compute brushes with an arbitrary number of bristles more economically.

Each bristle path was processed in space by using an exponentially-damped signal of (x, y) pairs. This led to a more physically-based model of the bristles, and gave each bristle a little bit of individuality. If I were to do this again today, I would probably start worrying about the capillary effects between the bristles, since that's more like the way the paint is actually transported through the brush.

I also developed a spatter airbrush model that had a physically-modeled trajectory for each speck of paint. And a proper concentration of trajectories. And to top it all off, it used the Wacom tablet and stylus to drive it as realistically as if you were using a real airbrush. I was quite proud of this brush.

Another brush I developed was a brush where images could be warped along the path of the brush. At this time, we were working with Alex Hsu of Creature House, whose Expression product we sold for a while. I couldn't be outdone by Alex, of course, and so I implemented this brush to warp pixels and do it using mip-maps so there were no undue aliasing artifacts. It could work with masked tiled images so you could draw chains and other cool figures quickly. The width of the stroke could be controlled by pressure with ease.

The marketing and development of Painter 6 are detailed in Creativity and Painter, Part 2. The war for Painter 6!

Metacreations' new three-hump logo was not my favorite, and it was the first logo I didn't have a hand in. Fortunately it was short-lived!



In the Painter 6 UI, we finally tired of not being able to access the deep features of the brush controls in a way that allowed simultaneous tuning. Therefore, we went to an expanding list, with disclosure arrows. On the front of a closed-down item there was a name and sometimes a picture of the art material or a swatch of color indicating what was the current color. We also put a salient parameter on the surface of the closed-down list item, such as opacity or the name of the current script. This could act as an important indicator when the list item is closed. Also, at the right end of each close-down list item is a pop-down menu of commands for that area of the product. This was another important feature for users.

Closed-down list items really cut down on the complexity of the program. they also let the users open up only the features they needed for the task at hand.

This wound up the most significant advance in Painter's interface, the product of John Derry and myself.



Painter 7

In 2000, Painter was bought by Corel and Tom, John, and I consulted for them for a year and a half, while helping to construct Painter 7. You will notice that Tom's name migrated mysteriously to the start of the splash screen credits. I can tell you I didn't have a hand in it; neither did I complain. After all, I no longer owned the product. As we constructed some really interesting features for the product, numerous Corel engineers started the process of taking over the code, and moving it over to Mac OS X.

Now, I'm not sure why they chose to label it under the procreate brand, nor why they put a bunny on it. At the time I found it hard to care, mostly because it was now their product. But I certainly didn't skimp on my enthusiasm for new features.

My Liquid Ink feature was based on a potential height field that metaballs were added into. It actually kept the height field in floating point. Because of the physically based viscosity and surface tension model, it was possible for blobs of ink to join together like two water droplets. this same technology was used for water droplets and also reflective liquid metal ink. What differed was the rendering of the color. Water was transparent, allowed for an amount of refraction, and had a shine model that used environment maps. Because the height field was floating point, it could be easily shaded like a ray-traced bump map. The Liquid ink used a reflection map for its coloring. This was based on a normal calculation from the height field, also from 3D bump maps.

My Watercolor implementation in Painter 7 used several layers to simulate the paint that was still wet, how it traveled, and its interaction with the paint grain. This became the most realistic form of watercolor available yet commercially. It used cellular automata to transport the dyes with liquid while it was wet, and interaction with the paper grain dictated where the ink would dry first, or get absorbed first.

If I had to do this again today, I would model individual paper fibers and use their capillary action to dictate where the liquid dye moves. There is just so much compute power available today; it's dying to get used for something like this.

My Woodcut feature allowed you to algorithmically select areas of the picture that were similar to a given color, process them to model the stickiness of the silk screen ink, and do a wood block stamp of that color onto a separate layer. This would allow you to create several "prints" on top of each other, like carved linoleum pressings.

Tom developed an improved PSD import, crafted continuous zoom, and I think he also worked on the perspective grid tool (though I'm not sure).

Much of my effects and brushes for Painter 7 were perfected with the assistance of John Derry, who contributed more than his share of good ideas, as usual.



The interface for Painter 7 did not change much, except to become "lickable" like the rest of the early Mac OS X aqua interface. Topologically, though, nothing actually changed that I can recall.



Painter 7 was the last version of Painter that I contributed to. It had been a long 11 years since the start. But Painter was a very fun project to work on!

Thanks

And it was always a pleasure to work with the Fractal Design folks! ...and the Meta folks! ...and the Corel folks!

To think it all started in my house in September of 1990 and it might never have seen the light of day had Letraset not been such a messed-up place.

Nonetheless, blessings to Marla Milne, Martin Dowzell, Brian Cohen, David Taylor, and Mike Popolo who worked at Letraset in the early days. I have many good memories of that time.