> More  PD Artist Tutorials       > All Tutorials       > Video tutorials: pdhowler channel on YouTube    > Landscapes     > 3D Designer   > PuppyRay

Exploring Trees, Creating brushes, Painting over rendered mountains

Getting started - Preparations

So you've launched PD Artist, and wonder how you might re-arrange the layout. For example, keep the toolbar on the left, but move the sidebar to the right?

Look in the View menu, go into Layout, and select Sidebar on right

Here you see the sidebar on the right side:

Next, we also need to do something about the canvas size or aspect ratio. We'll be working with trees at first, which are mostly vertical in nature (pun intended). So we should use a canvas that is taller than it is wide, i.e. portrait mode, not landscape wide. One way to do that is from the File > New menu, and look for some of the portrait presets, or enter your own desired dimensions. Another technique is simply to rotate the current landscape canvas by 90 degrees.

We may also want to change the background color, preferably to a color not likely to be seen in the trees. In other words, don't use brown or green. Plain blue might work. Or black. (unless there are some very dark parts). The key is that we'll want to be able to color key to that background so our brush image with the tree received a transparent background based on that chosen color.

Let's set it to blue. Find the two color squares (primary and secondary colors) at the bottom of the toolbar.They're initially black and white. Click the white secondary color, and change it to some nicely saturated shade of blue.

Then click the erase tool (X) to erase to that newly chosen blue background color.

Note that you can also erase to other colors. Use right-click on the erase tool to see the options.

In fact, many of the tools have a right-click option. Some even have an option to click the button in the upper left or lower right half. For example, the rectangle tool can be used to draw either hollow rectangles or filled rectangles depending on where in the tool button you clicked.

Also notice that most items have a tool-tip. Learn some neat tips and tricks from these.

Now we're ready to fetch our first 3D tree.

The OBJ Viewer for 3D Trees

PD Artist and PD Howler now include a set of 3D trees, defined as OBJ objects. They can be loaded, rendered, and then used in various ways. You can use the rendered image as custom brush, to stamp down a few trees or paint a whole forest. You can export the image with transparent background, for use in other ways, other programs too. To get an idea of what's available, use Windows Explorer to navigate to the folder where you have PD Artist installed.  Down in the Geometry folder, and Foliage sub-folder, you'll find a bunch of OBJ files (which contain 3D geometry of the trees) and accompanying textures, images and other resources.

Did you know? You can preview and use the OBJ files in many other programs. Even Windows 10 itself now comes with a 3D Paint app, and has had another tool to view OBJ files, for example for 3D Printing. Here are some example seen when right-clicking on one of the OBJ files:

Back to PD Artist or Howler:

We'll load and render a 3D object (obj file) of a tree. Start by activating the obj rendering tool:   View > Utilities > Widgets > Render an obj...

This was introduced around v11.3

It is a very simple 3D OBJ loader and viewer/renderer.

Use the button:  Open geometry...

Navigate to the folder of your PD Artist or Howler installation,
and down into the Geometry folder, then down into the Foliage subfolder.

The initial view of the tree may be a little of center.

Use the mouse with the left button or right button to adjust the view.

The right button moving vertically can bring the tree down vertically.

The left button can move into the scene or out of it (when moving vertically). It can also move the tree sideways with horizontal movement.

The rendering of the tree may be quite slow on old systems, so by default, it uses just a bounding box while moving. When you release the mouse button, it finalizes it with a rendering.

You can change the Render mode from bounding box to other options, if your system is fast enough to handle it.

Here we show it in wire-frame rendering mode. The wireframe shows in blue. Clearly, we should have chosen a different, lighter blue or different color for the background. Oh well, next time.

If your system is fast enough to use the wire-frame mode, it can probably also show the shaded rendered mode at acceptable speed.

Now we have the desired view. Let's wait for the finished rendering and click OK. Our first rendered tree.

Now we want to pick it up as a custom image-based brush, but with the background transparent. Or we might want to keep it as an image, but still, make the background transparent, and save it to an image with alpha channel for those blue background pixels. Let's explore several options.

But before we do, let's take a snapshot of the current image. Ner the top right icons bar, click the left-most icon, to store the image.

You can also find that tool in the Image menu: Store image.

Once you have stored an image, you can do a few things with it. Explore.

Turning the background blue color transparent

Go to the menu: Selection > Select by > Color Key

and pick a blue background color

Click OK. You may see the marching ants of the selection borders, and / for purple tinting if enabled (from the menu: Selection > Overlay)

You just selected the background. Invert the selection to select the tree instead:

And there it is, our first tree, selected to standout from the background. Save this as a Tiff, PNG or Default Targa file with 32-bit for RGB plus Alpha. You can use this in other programs.

Picking it up as a Custom brush

There are a few ways to turn this image into a custom brush. One of the easiest is simply from the top of the Brush menu: Use selected as brush

Now you can enable preview of the custom brush image:

And most importantly, you can paint with the custom brush that holds the image of the tree:

You may want to adjust the brush opacity

And one more very important step in your workflow, to work with custom brushes:   Brush > Store and Manage a copy

This gives you quick and easy access to working with your new custom brush. You can change its size and rotation. You can change Hue, Saturation and Value. And the RGB channels.

And there is more. The general Settings option panel shows many more things that a brush can be subject to. Such as random position, random Hue and value... and in the Custom tab you can enable further custom brush transforms (auto scaling with speed for example).

Time to explore and have fun with your first custom tree brush. Try various levels of Opacity, Step, and Sizes. Try different levels of brightness (Value) and saturation or hue.

Restoring the image

If you stored the image earlier, you can simply click inside the thumbnail to restore it. That's assuming that you still have that stored image, and didn't close it. It also assumes that the image dimensions haven't changed. Otherwise, perhaps only a portion of the stored image will show.

First off, if you don't have that stored image anymore, you can sometimes use the brush image. From the Brush menu, store its image as Image:

How that you have a stored copy of the image (including its alpha channel, if any), you can restore parts or all of it, work with its channels, scale to fit, etc...

If you had rotated or otherwise changed the dimensions of your main image (the canvas), use the option to Replace to create a new image:  Replace existing image (creates new image)

Here we've restored the image, coming from the brush iamge, after having stored it as image.  (I hope it's not too confusing :-)  )

One caveat: the very original image had much more border space around it. This one is tight, because the tool we used to pick the selected as custom brush went straight to the tightest bounding box of the selection, which was the tree alone.

You can remedy this if you must, by resizing the canvas (menu: Image > Resize )

Storing Alpha

There are other things we can store. We've seen string an image, and storing a custom brush, and even storing the image from a custom brush back as a stored image.

We can alsp store the selection alone. Call it the selection, or mask, or alpha channel. Either way, you can separately store it. It already gets included with the stored image but sometimes you just want to work with the selection, as a greyscale image, and combine various selections too, or paint on the selections. Lots of benefits.

To store the selection, use the menu: Selection > Store selection...

Once you have a stored copy of the selection, you can later grab the new alpha or a new image into it. Look for Get alpha, and Get image, in the stored Alpha widget.

Notice how you can easy Invert the stored image and then click Replace, to put that inverted selection into the current selection. That's just another way to invert the current selection: Store it, Invert it in the stored copy, Replace it back to make the inverted the current selection.

Working with selections, you'll sometimes want to clear the selection. Use this:  Selection > Deselect  (or Clear the selection in older versions?)

Custom Brush Selector tool:

Manually picking a portion of the image for use as Custom brush

We saw earlier how to use the current selection to pick the content of it and make it a custom brush (Brush > Use selected as brush).

What if you don't have a selection?

You can still pick part of the image, and later use color keying to turn the background transparent in the brush.

The CUstom Brush Selector tool (below the magic wand and before the color picker) can be used to pick up a rectangular region on the image and have it picked up into the custom brush.

Use the same tool again, but this time with BMR (Rght Mouse Button), to show a color keying tool.

There are many ways to turn that background transparet in the custom brush. The easiest? click the blue background

Then store the current custom brush again (menu: Brush > Store and manage copy...)

Compare the stored brush before and after color keying for transparent background:

Now you can easily stamp down the tree, even a partial tree, adding it to your image.

Automatic Transparency - Secondary Color

Instead of working through the steps to select the background and inverse the selection, the program can automatically assign the background pixels as transparent, if they are of the same color as the secondary color. Let's try that with a new tree.

First, erase the image, this time to a lighter blue. Set the secondary color, the same way as we did earlier. Then erase the image to that secondary color.

Now use the Obj renderer (tree viewer) again, this time pick one of the Pine trees.

Don't make any selection. Just use the Custom brush pickup tool. Select a portion of the image so that the entire tree is picked up.

The immediate store the brush (Store and manage...). You'll see it with transparent background in the thumbnail. This was automatically done based on the fact that the pixels in the background were the same color as the secondary color. In other words: The secondary color is automatically used to identify background pixels and turn them transparent in the brush.

You can also just paint with it to see that the brush container is not opaque blue.

Instead of working through the steps to select the background and inverse the selection, the program can automatically assign the background pixels as transparent, if they are of the same color as the

Next, clear the image again, return to the obj renderer and turn the tree by using the slider just a notch.

And again, use the custom brush pickup tool and pick the image of the tree, and store it too.
Now you have another stored copy of the brush.

Repeat this once more, to have a 3rd, and perhaps a 4th image of the tree, again at various rotations.

So, here we have four slightly different trees as stored brushes. Each of these trees came from the same 3D tree but was rendered at different rotation angle to create variety.

Creating a multi-frame Animbrush

You can use those 4 brushes separately, individually, painting with them, one at a time

But you can also combine them into a single brush. A brush that will contain all 4 images, and cycle through them when you paint with that brush. This is an animated brush, consisting of multiple frames. It is also called an animbrush.

For example, select the first brush (click on its icon image). That is now your current custom brush. Store it (Brush > Store and manage ...)

Near the bottom of this stored brush, click on Show filsmtrip

The filmstrip only contains one mage at this stage. Note that you can resize the window from the edges or lower right corner to reveal more frames in the filmstrip.

We're about to change this custombrush to an animbrush by adding another one of the brushes to this one.

Click the icon of the second brush to select it.

Then click the Add frame button on the stored brush that we want to build into the animbrush:

Now you see two frames in the stored brush, two images of different trees in one stored brush: An animbrush of 2 frames.

Repeat this for the 3rd brush, adding that one too.

Repeat this too for the 4th brush, adding a 4th frame to the animbrush.

Now we have 4 images in the animbrush. Select the stored animbrush and start painting with it. Play with the various brush settings, such as random positions and size, and more, including the brightness or saturation in the stored brush.

Here's an example with added lens flare over the Sun.

Creating the background Mountain Scene - First Steps

It's time to create your own background scene, over which you'll stamp a few trees or paint a whole forest.

There are many ways to create a mountain scene, landscape with hills, or terrains like canyonlands. We have many tutorials and free samples of terrains, defined by their elevation map (also known as heightmap). Look here to learn the 3D Designer: http://www.thebest3d.com/3D-designer

The 3D Designer module (a Transform filter) is often used for initial creation of the terrain's elevation map, including with erosion and sediments, and creating a basic texture map that colorizes the valleys, hills and mountain peaks based on their height but alos based on the slope. From there, you can also further work on details of the texture map, or the heightmap, after storing a safe copy of it. You might in the end want to make the heightmap and texture map seamless, and render them in another transform filter: Puppy Ray, the DOgwaffle ray tracer rendering engine. (technically it's a ray caster). Learn about Puppy Ray - and especially Puppy Ray GPU - here: http://www.thebest3d.com/puppyray

Other than 3D Designer, you will also learn that several tools amongst the filters can be used to create some of these effects that make it look like even more erosion, perhaps even wind-generated drifts (sand dunes?) and sediment deposits by way of light diffusion (photographic filter category). The Stylize category of filters also has an erosion filter, and a filter for color by height and slope. (the slope shader).

Without going into too much detail, let's try this:

Let's start with a new image placeholder that will be for a wide panoramic with 2 to 1 ratio, i.e. twice as wide as it is high. Go to File > New and uncheck the box that forces the same aspect ratio as currently selected, then set the height to be half the width. For example 1280 pixels on the width, and 640 for the height. You can also start from a preset and adjust one or the other of the values. Having the "Constrain" checkbox unchecked allows you to change one (such as the height) without affecting the other (the width).

Next, pick the Linear Gradient tool. Right-click the gradients tool and select the Linear gradient tool from it.

Draw a vertical line from about the center of the image down to the bottom and beyong it, about the same distance. It doesn't matter exactly. Just so you have a greyscale transition from black to white.

We actually wanted it to be bright white in the upper section. ou can undo and try again, drawing the gradient from the bottom to the center of the image. Or you can simply invert the image. Now store this image (menu: Image > Store image copy, or as earlier with the mini icon in the top-right zone of the window.)

Now, render the Plasma Filter from the Render menu:

Set the Mode to Difference, and adjust the Scale to 8. Once it is set to 8, try clicking it (without moving it to another value) and see if you like the result even better. You sould see about getting some sort of dark line near the bottom, like the nagative of a lightning bolt, representing the lowest elevation of the terrain, basically preparing the path for a river.

Click Ok and store that image. It is a good start for an elevation map that goes from low elevation (dark) in the bottom front area to high grounds and mountain peaks in the far upper regions.

Perhaps before storing it, Make it seamless:

Image > Make seamless

and then expand the dynamic range, so that the brightest pixels will be white, and the darkest will be black. You don't want it dull and lacking depth of greyscale resolution.

Image > Expand dynamic range

Here's an example of an elevation map:

Now let's work with this in the 3D Designer:   Filter > Transform > 3D Designer

Click the "More" button that sows in the upper left corner of the interface (turns to Less). Then add a healthy amount of Erosion. Then also add some amount of Sediment.

Next, use the Create texture button, and adjust the vertical levels for show and/or grass to your liking. Notice how the show won't stick to all levels, especially the steep slopes. This is a coloring texture that looks for height as well as slope.

Try some more options. Use the Sediment menu to add Snow in the lower valleys too.

There are in fact a lot of options. Try only a few at first, to become familiar with how they work.

Here's a screenshot where we've set a few parameters and started a rendering. We also stored a safe copy of the heightmap and texture map, perhaps for later use in Puppy Ray or export to another tool.

And an example of the rendering:

We intentionally did not let the terrain cover the bottom of the image. The terrain is supposed to be seen in the far distance. Nearby, we'll cover it with some grass brushes from the particles or foliage system.

Here's an example of how to take it further. We hope it inspires.

to be continued... some day