the way to Create Hand Painted Textures without portray

The hand-painted look is a compelling video game art fashion. It adds a whimsically fantastical feel that photorealism lacks. despite the fact, really reaching the look can also be fairly tedious — on occasion requiring hours for a single texture.

every person's favorite hand-painted texture — the brick wall.

below is a means I've get a hold of for approximating the hand-painted look that can stand on its own — or if obligatory — be the groundwork for a hand-painted texture with no need to start from a blank canvas. This procedure is mainly useful for these pressed for time, say all the way through a online game jam.

discovering a photograph Texture

The system starts with a real picture. somewhere in the image you choose is a hand-painted texture lurking in the particulars. Your aim is to eliminate the appropriate particulars to display the hand-painted texture hidden beneath. in the event you're definitely painting the texture, you're trying to construct up the particulars while here, you are attempting to tear them down.

I are inclined to use Pixabay to discover my photo textures. most of the photographs are free for industrial use and require no attribution which is at all times excellent when constructing your own game.

💡 make certain to find one evenly lit and head on when looking throughout the pictures.

cleaning The photograph

There are two clear up phases. this primary one will put together the photograph for the filters. in this section, function right here so as.

Crop the picture to have the equal factor ratio that the closing texture will have but don't resize the photograph simply yet.

If tiling the photograph, get rid of any distracting repetition.

If tiling the graphic, eliminate any seams.

For exposing the seams, use the offset tool with wrap selected (in GIMP it is Layer > radically change > Offset…) and divide the width and peak with the aid of two.

if you can, identify constituents of the seams that form of suit and mix these areas for my part.

otherwise, use the clone tool and run over the seams the usage of an beginning someplace further away. make sure to play around with diverse brushes as some will work improved than others depending on the picture.

I make all my GIFs with Gifcurry. 😃

as soon as the seams are gone, i like to throw the graphic into Krita and use the wrap round mode to decide the repetitiveness of what I actually have to this point.

The effect at this element doesn't ought to be astounding but the work you do right here will save you time throughout the 2nd clean up.

doing away with The detail

in case you don't have already got it, make sure to install G'MIC. i use it as a GIMP plugin but that you can also use it online.

Open G'MIC and discover the Vector painting filter. here's what you'll use to get rid of most of the aspect but keep the ordinary constitution. I are likely to hold the details surroundings above nine however in some cases I've had to dip into the mid eights.

For especially noisy photos, you may also have to run it via clean [Anisotropic] first after which Vector painting 2d. try to preserve the Sharpness excessive and play with the Gradient Smoothness.

adding the comb Strokes

It wouldn't be hand painted without brush strokes. After Vector portray, run your photograph throughout the Brushify filter present in G'MIC.

For the comb parameters, use the ellipse shape with a really small Ratio. The Maximal size environment can in fact gradual this filter down so retain it between 30 and forty. make certain to set the mild type to None and set the gentle strength to zero. believe free to play round with the variety of Sizes, Fuzzyness, and the Smoothness. Set the Opacity to 1.

For the portray parameters, the Density atmosphere can slow down the filter so start at 50 and work your approach up. Set the Orientation Coherence and the Gradient Smoothness to 1 and 10 respectively. Set the perspective Dispersion to at least one. believe free to play round with the Contour Coherence and the structure Smoothness. many of the time I keep the Contour Coherence at zero.

💡 The purpose right here is to look the brush strokes so having it rough around the edges is pleasant. You want it to look like the colorings and shading have all been roughed in however haven't been smoothed out yet.

Smoothing Out the brush Strokes

After Brushify, run the photograph via Poster Edges. This filter will clean out the brush strokes and add some definition back in. if you deserve to, you can remove greater aspect the usage of the photo Smoothness and/or the Posterization level. suppose free to play with the aspect Threshold and aspect Thickness for a more comedian publication or caricature fashion. preserve each of the Antialiasing settings at 100 and hold the aspect colour at 30.

It'd be great if you could choose the aspect color. in the future, i may build upon this filter and add a area color environment.

cleansing The Texture

Now comes the 2d clear up phase. during this part, perform here so as.

If tiling the image, remove any distracting repetition that wasn't handled past.

If tiling the photo, eliminate any seams delivered by the filters. The process may be the identical as up above.

alter the curves (cost, pink, green, blue) if obligatory.

evenly sharpen the graphic the usage of the Sharpen [Deblur] G'MIC filter however be certain to steer clear of including any considerable highlights and shadows.

Resize the graphic to its remaining dimensions. be certain your dimensions are a power of two if required or informed through your video game engine.

Your hand-painted texture is now carried out and you saved a ton of time within the manner. 🎉 although, you're now not carried out yet. Time to create the maps to make it work with any sort of lighting.

Create The Maps

probably the most issues with hand portray textures is choosing the mild route. It's customarily chosen as directly up above and this works greater or much less with the dynamic lights in the game. besides the fact that children, this may also now not work in all cases.

With the texture complete, load it into AwesomeBump to generate the average and occlusion maps. The interface may also be difficult so I'll stroll you via it.

On the leading toolbar to the left, click the "demonstrate diffuse photograph" button.

click on the "Open new graphic" button and select your texture.

below "Diffuse to Others", check "allow preview".

With "allow preview" checked, scroll down and click the "Convert" button.

Uncheck the "permit preview" button.

On the main toolbar to the left, click the "demonstrate occlusion photo".

Set the "input picture" to "peak (input) + general (input)".

Press the "retailer present picture" button and save your occlusion map.

On the leading toolbar to the left, click on the "reveal commonplace photo".

Press the "shop latest photo" button and keep your usual map.

you should now have your diffuse, ordinary, and ambient occlusion maps.

placing all of it together

together with your maps in hand, that you would be able to now head over to your modeling application (i exploit Blender) and bring together your cloth.

I performed the identical method to create a wood, roof, grass, and metallic texture. here that you could see them all in use, texturing a neatly I modeled.

the use of best just a few free equipment (GIMP, G'MIC, and AwesomeBump), I've put together a reasonably convenient system for growing diffuse, ordinary, and occlusion maps that approximate the hand-painted online game art vogue.

whereas establishing Lambda Lantern — for the GitHub game Off game jam — I had to pass texturing to save on time but I plan to go back and texture all of the models (and any new ones) the usage of this manner. This should still add some incredible detail to an already satisfactory art fashion I selected.

Anyway, hopefully this will prevent some time when developing your own games. in case you occur to make use of the technique, be sure to share your creation within the comments beneath. 😃 👍