Create a Photo-based Brush

A Concepts Brush Tutorial

Concepts App
Jun 20, 2018 · 6 min read
Image for post
Image for post

With the Concepts custom brush editor, you can easily take any image and make it into a stylish, personalized brush for your sketches, designs, flyers, invitations or artwork.

Here is how you can take a photograph and create a brush from it. Use the image below to play with, or try importing your own.

Creating the Stamp

1. Take a photo — of your face, of your friend or of a flower. Anything goes.

Image for post
Image for post
Download this photo, if you want.

2. Open Concepts and go to Settings. Create an artboard of 512 x 512 px with a plain white background.

Image for post
Image for post
A very nice artboard, zoomed in a bit.

3. Import your image and center the part you’d like to isolate for your brush in the artboard.

Image for post
Image for post

4. Now zoom in a bit, and make sure the image layer is active. Select the hard eraser, and trace around the edge of the flower.

Image for post
Image for post

It doesn’t have to be perfect, but get as close to the edges as you can. A bit of smoothing applied to the eraser helps keep it tidy.

Also, you only have to erase inside the artboard boundary. Don’t worry about the rest of it.

5. Select the soft eraser and apply it to the edges of the flower. This softens and polishes up the edges. A lower opacity (~50%) will help you blend with a little more control.

Image for post
Image for post

6. That’s it! Now tap Export and select PNG, with the region set as Custom and the original paper background. Save your image to the photo roll.

Image for post
Image for post

This is the stamp for your new brush.

Image for post
Image for post

Creating the Brush

1. Now that your stamp is ready to go, double-tap a brush on the tool wheel to enter the Brushes menu. (If it’s already active, tap it once.) Scroll down to My Brushes.

Tap + New Pack to create a new brush set, then tap + New inside the set to create a new brush.

Image for post
Image for post
The Brushes menu.

2. Tap the new brush (or Edit Brush in the viewer up top) to enter the brush editor. Choose Stamp as your core brush type.

Then go down to Stamp Source and tap the + to import your image.

Image for post
Image for post
Import the flower image.

Did you see the stroke in the viewer update with the import? With this stamp applied, the stroke now has petal-like edges.

Image for post
Image for post
Notice the image became grayscale for you when you imported it.

This is technically a brush, but it’s also a really boring brush. Let’s spread out the blossoms so you can actually see them, and give it a little dynamic personality.

3. First, draw a stroke in the viewer with the kind of flow you like to use when drawing.

Now let’s head down to Size. Make the brush bigger so you can get the full effect of the flowers. Here it is at 124 px.

Image for post
Image for post

While you’re at it, add some pressure sensitivity to the brush by applying a smooth, upward slope to the size variance graph. (Make sure the graph is set to pressure.) Start at the left side of the graph and draw upward with your stylus.

Image for post
Image for post
My pressure range is set to about half the graph, as you can see by the white area behind the bars. If yours is different, that’s absolutely fine, just draw the upward slope all the way across the white area.

That’s it, you can see the difference in the viewer.

4. Now scroll down to Shape Controls and find Shape Spacing.

At the moment, the two handles on the bar are at 30%. This means there is 30% spacing between stamps (out of 1000%), and as the handles are together, there is no randomness in their spacing — they are uniformly placed.

Image for post
Image for post

Let’s give them some randomness like flowers in a meadow. Move the second handle until it’s at about 150%. If the slider is tricky, you can tap+hold a value field and enter it in manually.

Image for post
Image for post

For the sake of comparison, if you set both handles at 100% with no pressure variance on the brush size, it would create a very evenly spaced line of flowers — great for a border on an invitation, for example.

Image for post
Image for post

But back to the meadow.

5. Let’s move down to Shape Scatter.

You can apply a range of random scatter to the stamp images along the stroke by separating the handles on the scatter slider. Move the right handle up to 100% to give it a maximum range of scatter.

Image for post
Image for post
Looking a bit more like a meadow.

6. As not all blossoms are rotated to the same angle in nature, let’s give the stamps some randomly-generated rotation, too. Under Shape Rotation, move the handles apart to create the range of random rotation.

Image for post
Image for post
85% looks good to me.

7. Finally, let’s give the brush a layer name. Move down to Advanced Settings and tap the layer label. It reads Custom at the moment.

Choose which kind of layer you’d like your brush to appear in out of the pre-set choices (for Automatic Layering purposes, which sorts by tool type), or give your brush its own layer title: Flower.

Image for post
Image for post

That’s all there is to this brush, well made! It’s ready to be used in an art piece, as a decorative border for a flyer, or as a quick scatter of flowers on a landscape design.

Creating the Art

Tap the stylus to the canvas for a single flower, or draw for a string of blossoms.

Image for post
Image for post

You can change the brush’s color, size, opacity and smoothing at any time on canvas with the usual controls on the tool wheel.

Image for post
Image for post

If you want to select and move the strokes about, you can do that, too.

Image for post
Image for post

Enjoy your new photo-based brush!

Image for post
Image for post
Just a couple strokes of the flower brush, one at 100% opacity and one at 50% opacity.

Do you have questions? Please ask in the comments or email us at concepts@tophatch.com, and we’ll be happy to help.

___
By Erica Christensen — Writer | Illustrator | Designer at TopHatch

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch

Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore

Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store