Vector image of Batumi watercolor drawing. Create a contour brush

What You'll Be Creating

Watercolor textures in Adobe Illustrator trendy today, don't lag behind it! In this course we will create our own textures using a simple watercolor set. We will edit the images in Adobe Photoshop, and then apply textures in Adobe Illustrator using different methods.

You can also purchase essential textures and hand-drawn fonts from Envato Market to complement your designs.

1. Create a watercolor texture

Step 1

Let's start with the materials that are needed to create a watercolor texture:

• Watercolor paint
• Watercolor paper
• Soft brush
• Cup with water

Personally, I believe that such projects do not require particularly expensive materials. A watercolor texture can be created using baby set paints, but you can also use Winsor & Newton paints. In the photo you see what I used.

Step 2

Dip your brush into water, dip it into paint, and start painting. Play with saturation and transparency. Paint large spots or subtle "clouds" of color. It's impossible to go wrong when experimenting with watercolors!

Step 3

When the wet brush hits the dampened area of ​​the paper, you will see the paint spread and create beautiful gradients on the paper. You may get some areas wet paper napkin or create a splash texture using a brush.

Step 4

Apply the paint in layers until you have areas of varying color saturation. Try different colors. In some areas, apply new coats over the dried paint. Keep painting until you have a few areas you like.

Step 5

Draw as many pages of watercolor sketches as you like. When you have something that suits you in color and composition, let the paper dry completely, only then proceed to the next stage.

2. Editing textures

Step 1

Scan your drawings and import them into Adobe Photoshop. Or you can take pictures of the drawings. My scanner is old and the scans don't always come out well, in particular the background isn't always as white as I need it to be. We continue to edit.

Step 2

To get rid of yellowness on paper: Image > Adjustments > Levels. Gently correct the yellowness around the paint spots. I usually move the gray slider to the left and the white slider a little to the right.

Step 3

Now you have clean scans, save your file as JPG With high resolution. Then import into Adobe Illustrator.

3. Convert the texture into vectors

Step 1

Import the image into a new document Adobe Illustrator, open the panel Image Trace. As Mode choose Color, V Palette choose Full Tone. Check the box Preview and wait a bit until the image is vectorized.

Step 2

I've enlarged the tracing result so you can see it better. It's very easy to vectorize hand sketches and there's no need to create them in Adobe Illustrator.

Step 3

You can reduce the detail in the trace if you choose Limited bottom left) instead Full Tone bottom right) in color Palette. Your image will have a more vectorized appearance and a smaller file size.

Now you can Expand its texture and Ungroup her. By using Lasso Tool (Q) circle around the area you need. Copy (Copy = Control-C) And Paste (Paste = Control-V) texture on New Layer in the panel Layers. Hide the other textures to focus only on the section you copied. Group (Group = Control-G) texture.

4. Create a graphic style

Step 1

Graphic Styles are an amazing thing. They allow you to easily apply different variants textures, effects and more, just a click of the mouse. They are also closely related to Actions, which allows you to speed up your work in Adobe Illustrator.

Select the group with the texture, and in the panel Pattern Options create New Pattern. Adjust Width And Height chip with a pattern so that the texture overlaps itself. In the panel Appearance set to Multiply. When you're happy with how the pattern overlay looks, click Finish (Done).

Since we are dealing with a complex vector texture, this may take time. I usually knit and wait for my computer to handle what I'm doing. Save your files regularly to save yourself some trouble in case Illustrator suddenly freezes.

Step 2

Your new pattern will be in the panel Swatches. You can apply it to a simple rectangular shape. Open the panel Graphic Styles, select the rectangle, click New Graphic Style. This will allow you to save everything you create in the panel Appearance and quickly and easily apply to any object. There is no need to reapply the pattern with all its attributes. Be sure to save yours so that it is available to you from any document.

Step 3

Let's try our new one Graphic Style on the text. I wrote one of my favorite quotes from comedian Alyssa Edwards using a fun cursive font. You can purchase similar fonts on Envato Market.

Type text using the tool Text (Type Tool = T), then Expand: Object > Expand, your text will turn into Outlines. Apply your newly created Graphic Style. See if you need to adjust the pattern here and there.

5. We create a design with typography.

Step 1

Let's create something more interesting and apply Graphic Style to a simple font. Sketch a quote for the poster. Think about what font to choose - serif, san serif or handwritten calligraphy.

Or you can group the text however you like instead of drawing a separate design. I used Adobe Photoshop to create the design below and imported it into the document Adobe Illustrator. Try different compositions and font styles with the quote you choose. If you don't use graphic tablet, you can use ready-made fonts in this course.

Step 2

On a new layer use Blob Brush Tool = Shift-B to smoothly redraw your design. Try to draw smooth lines so that your curves are smooth and your straight lines are straight.

Step 3

Vary the stroke width when writing letters. It wouldn't hurt to look at examples of typography and calligraphy here. You can work wonders by knowing which parts of the letter to thicken and which to draw thinly. Experiment with both to see what changes you can make.

Step 4

Keep working on your design. If there is something you are not happy with in your sketch, now is the time to correct it. You can also use another tool to outline the sketch, for example Pen Tool (Pen Tool = P).

Step 5

When working with large areas, draw the outline first and then fill in each shape with the tool Creating Shapes (Shaper Tool = Shift-N) to fill empty sections. Just draw an arbitrary line between the boundaries of the object and it will be filled as in the picture below.

Step 6

When you are finished drawing the text, delete the scan of the sketch and select the newly created shapes. Panel Processing Paths (Pathfinder) - Add (Unite), do not forget Compound figure. As before, apply Graphic Style to your design.

6. Create a clipping mask

Step 1

There is another way, you don't need to create with it Graphic Style. Can Create a Clipping Mask = Control-7 and apply it to your texture. Preparation is similar to the first method: using Lasso Tool select a fragment of the Image you Image Trace, Now Copy his.

I save watercolor textures in separate documents so that my working document doesn't eat up all the machine's memory.

Step 2

Paste texture into the working document. I set the text fill color to light gray so that both the texture and the text are clearly visible. Select Blending Mode - Multiplication on the panel Transparency.

Step 3

Repeat the process of layering watercolor textures over your text. Change Scale, Rotate whatever suits you best to create a design that suits you.

Step 4

As soon as everything starts to suit you, Group texture elements that are located above the text. Make sure all the text is covered with texture. If this is not the case, after using Clipping Mask Entire letters may disappear.

Step 5

Copy And Paste design with text on top of a group of watercolor textures. Hide the original text design on the panel Layers. Select everything and Make a Clipping Mask keyboard shortcut Control-7. If you need to change or add any elements to Clipping Mask, just open the panel Layers and select Clip Group from the clipping mask, redistribute it to Artboard, or even add new textures to it.

Hurray, you did it!

Try to "play" with watercolor textures as you wish. Whether you're using a Graphic Style or a Clipping Mask, you have options for how you can apply that texture, as well as additional details such as splashes or streaks of paint.

For those who haven't heard yet, sad news came today for watercolor artists from Shatter. Trace is no longer accepted. I don’t know about you, but for me this is a rainy day. Because it was watercolors of this type that sold best to me. And you don’t need to tell me that the raster will work now. That’s why I started tracking that he wasn’t walking. In general, on Markovka’s blog we decided to collect all the arguments against such a decision. I collected everything that was written in the comments and composed a letter. Don’t be lazy and write here in the comments that you agree with the contents of the letter. The more signatures, the more heard our voice is. You can write additional arguments. If you don't agree, just don't write anything. I will send this letter and link to the Russian-speaking representative Anna on Shutter. If there is no response, we will translate it into English.

Dear Team Shutterstock!

July 17 in the blog (http:// www. shutterstock. com/ blog/ update- to- our- auto- trace- policy- for- vector- illustrations? pl= SubGF) you posted a decision not to accept more work, converted to a vector by AutoTrace . The reason was given by many complaints from customers who see one thing in the preview, but another in the original.

Your actions are clear and logical. But is such a categorical decision not hasty? For many authors, these works are the main source of income in their portfolio. We do not agree with your decision, and in this letter we would like to present our arguments in favor of some kind of compromise.

1. Many artists paint using the watercolor technique. And watercolors are very popular in the illustration market today. This technique cannot be imitated in Illustrator. The very “technical techniques” that your team suggested to us, unfortunately, do not save the situation. The examples you show in the article are beautiful, but very vaguely resemble real watercolors. Therefore, autovectorization greatly saved the demand for such work. And demand means income for Shutterstock.

2. Demand for vectorized watercolors in Lately has grown incredibly. Specifically, vectorized. It's no secret that raster work sells much worse than vector work. Why? Because vector easier to edit. It is not possible to create a design with inscriptions, sample text, or use masks on raster illustrations. They cannot be used to make stickers or corporate designs. This means that a huge part of such works will simply disappear from your collection. This will certainly hit your income too. And probably many authors will simply transfer their vectorized collections to other stocks. This again is not beneficial for you.

3. Your arguments that vectorized watercolors are not editable are not entirely accurate. Such a vector is an isolated object; it is much more convenient to use than cutting it out from a background with a paper texture with a “magic stick” or manually etching it. In a file with a vector trace, you can easily change the composition of the work by dragging elements and changing their places: it is much easier to select an object than in a raster, if, of course, the object is grouped in advance. When scaling, a high-quality watercolor trace gives a stylized effect, rather than blurring, as in raster works, which must be brought to an acceptable appearance with filters.

4. Your decision was very fast, and many authors have already prepared works of this quality or are working above them in this moment. This means time is wasted. This is not how you treat good workers that bring you income. This is a blow to your reputation.

5. You receive complaints from clients who expected a different quality from vector work. How many dissatisfied customers are there? Even if it was 50%, the rest were happy. Have you notified them of your decision? Many clients knew what trace watercolors were and bought them consciously. Moreover, with some skills, you can quite easily change the color of vector objects; Illustrator has the necessary tools for this. Will the remaining 50% be happy to know that they can no longer buy vector watercolors? This is a blow to your reputation and income.

Conclusion:

Dear Team Shutterstock , we are very happy to work with you, and we are ready to further work and improve together with you! We understand your concerns regarding customer complaints and therefore propose a compromise that could satisfy all parties:

1. Vectorized watercolor is a distinct style that works great if applied correctly. As a compromise, you can introduce separate tags for vectors, drawn and traced, so that customers do not make mistakes when purchasing.

2. Among the watercolor traces there are very high-quality works that are in great demand. A decrease in the influx of such work can alienate buyers who are interested in them and contribute to their departure to other stocks. We propose: increase the requirements for the quality of auto-vectorization, as a result, allow larger file sizes, more than 15 MB

3. Enter new format acceptance - PSD format. This way, clients can edit pixel files and designers can offer a greater variety of edit-friendly, interesting work.

With the arrival of spring, I often think about pastel colors, fresh airy designs and watercolor effects. Therefore, in this tutorial I will explain how to create watercolor brushes and use them to design text.

Watercolor art brush

First you need to set up the pencil tool. Double clicking on the pencil tool will open a window with parameters. Here you need to set the deviation to 0.5.

We begin to draw the outline of the brush with a pencil (N) as shown in the figure below. The edges don't have to match exactly. Try to create rough edges that will blend well into the watercolor effect. Also make sure that your outline is closed. To do this, you can press Alt before closing. Make the fill white and remove the stroke.

Draw a third outline inside the second one without intersecting it. Fill 30% black with no stroke.

Select all three paths and create a transition (Object>Blend>Create). If the transition is not smooth but steps, you need to check that the contours are closed and there is no intersection. In the Transparency panel, select the blending mode Multiply.

Now drag the transition into the brush panel using the selection tool (v). In the dialog box, select a new art brush. In the coloring method, select a color tone shift. This will allow you to change the color of the stroke without creating a new brush.

Now this brush can be applied to any path or text.

Watercolor Scatter Brush

Create a circle as shown in the picture. Make the fill 40% black without a stroke.

Now, using a pencil with the same settings, draw a contour around the circle as shown in the figure. Make sure the circuit is closed. Fill it with white without a stroke and send it to the background (object>montage>background).

Select both contours and create a transition. Blend mode: do multiplication.

Drag the transition to the brushes panel and select the scatter brush. Select the following options.
Size = Choose random and set from 10% to 150%.
Intervals = Choose random and set from 10% to 80%.
Scatter = Choose random and set from -150% to 150%.
Rotation = Select random from -180° to 180°.
Coloring method = select a color tone shift.

When I wanted to trace my watercolors, I was looking for information on what settings are best to make, what to vector in, but I found very little. Mainly on forums. As a result, having collected information, having tried what I liked myself, I decided to write an article for those who, like me, asked the same question. How to convert a raster 9 sketch, sketch, doodle, watercolor, etc.) into a vector?

I scan images for microstocks for several purposes:

1. trace watercolor, gouache, pencil into vector (tracing from the word trace, that is, converting raster graphics into vector)
2. vector black and white graphics, sketches, doodles
3. make different stains and scuffs for the background
4. make the background yourself.

First I scan or photograph the image. It is better to scan illustrations and doodles. Stains or crumpled paper For the background it’s easier, for me, to take a photo. All sorts of stains are suitable: spilled tea or coffee? We take pictures. Are there any scuffs left from sanding or has the paint peeled off over time? We take pictures. Are there small pebbles scattered on the ground? Let's take pictures!

Watercolor scan. Now it needs to be brought into decent shape.

We open Photoshop, and in Photoshop we trace what we are going to do and do the initial processing. What we do depends on the tasks at hand. For example, you need to convert watercolor to vector. We process it in Photoshop: whiten the background, remove dirt.

It’s best to check the background with a pipette in the Info palette. Well, since I get tired of constantly poking, I check this at the end, in places where dirt accumulates.

How I make the background pure white:

1. I create a Levels or Curves adjustment layer (look for it in the Layers palette below) and greatly darken the image. This is where all the dirt comes out.
2. Next, you can simply go over it with a white brush (soft or hard), or you can take the dodge tool and go over it. Simply remove parts of the background with a lasso or other selections and fill them with white.
3. We use a pipette to check in the palette where the color is white and where it is not. Let's clean it up.
4. Delete the adjustment layer.

Scanned in Illustrator SS

Scanning in Illustrator CS5

In the illustrations above: tracing in Illustrator 5 with the number of colors 255 and vectorization from Illustrator SS, the number of colors is 85%, which is the default (the value can be changed). The file in cs5 is naturally larger, the number of colors is because it is larger.