Tools for working with vectors in Photoshop have appeared a long time ago, but they began to be used in work relatively recently. This is due to the fact that for a very long time they were "raw" and since vector in Photoshop is not a specialized tool for work, and it has not been modified. But that all changed with the release of Photoshop CC.
Why do you need a vector in Photoshop
First, I want to tell you why I use a vector in Photoshop. There are many proven vector editors out there. The most common are Illustrator, CorelDraw, Xara. Most often, I do web design, which means my work is not the end result. Those. before it becomes a site, an interface, an application, the layout gets to the layout designer. Most layout designers are fluent in Photoshop, but very superficially familiar with Illustrator. Therefore, the desire to "stuff" everything into one file is quite logical. It's great when the layout designer gets one PSD that contains the full layout and even with the ability to edit elements. Change the color of the button, change the radius of the menu shape, increase or decrease the block without losing quality - in 2 clicks and 1 minute! Vector in Photoshop allows you to do this without any special skills.
Features of working with a vector in Photoshop
If you've worked in any vector editor before, then a lot will seem familiar. But you have to get used to a lot. All work in Photoshop is built with layers, this also affected all vector tools.
1. To easily edit a vector in Photoshop, you need to place each shape in a separate layer.
2. Operations for "merge", "subtraction", "overlay" are best applied to no more than two objects.
3. After the operation of "merge", "subtraction", "overlay", the outlines of the original objects remain available for editing.
4. Raster styles can be easily applied to all vector objects. It is very comfortable.
5. You can apply transparency to vector objects and apply filters to them.
6. Individual layers and groups of layers with vector objects can be easily cloned within the document or copied to another PSD document.
7. Sign each layer and group layers - this will save a lot of time.
Basic primitives
As in any vector editor, a vector in Photoshop has ready-made primitives. Basic primitives:
Rectangle, Rounded Rectangle, Ellipse, Polygon, Line, Freeform Shape. For each shape (at any time), you can set the thickness / type / color of the stroke and fill. Additional properties are available for specific primitives. For example, for a polygon, you can specify the number of corners, and for a rectangle with rounded corners, you can specify a fillet radius.
Basic tools
To draw an arbitrary vector or edit an existing one (including the contour of primitives), you must use the "Pen" tools (draw an arbitrary path), "Pen +" (add new anchor points to the finished path), "Pen-" (remove anchor points from the finished contour), “Free pen” (draw an arbitrary contour by hand), “Angle” (change the bends of the contour curves, set the types of connections between the anchor points). 
To illustrate the process, a short video from which you will learn:
1. How to create a primitive
2. How to draw an arbitrary vector shape
3. How to edit the outline of a primitive
4. How to edit the outline of an arbitrary vector shape
Basic vector operations in Photoshop
There are 4 operations in total: "Combine shapes", "Subtract the front shape", "Combine shapes in overlay", "Subtract shapes in overlay". All these operations are available through the main top menu Layers\u003e Merge Shapes, or through the "Properties" toolbar (top menu Window\u003e Properties).
Attention! Before starting any operations on combining vector shapes, make sure that the layers of these shapes are selected in the "Layers" toolbar (turn it on F7 or Window\u003e Layers).
A short video illustrating the basic operations of “combining shapes” in Photoshop.
Change color, size and apply styles
Here we come to the most interesting part. Vector in Photoshop allows you to resize both up and down without losing quality. To do this, select the required layers in the "layers" toolbar, press Ctrl + T (or Command + T if you have a MAC) and drag the markers of the selected path with the mouse to adjust the size. To change the size proportionally, you need to hold down the Shift key. 
Short video:
1. Resize the vector shape
2. Change the fill color of the vector shape
3. Add style to the vector shape
Download PSD example (free)
To make it easier for you to figure out how to use a vector in Photoshop and see how you can use these tools in practice, I upload an Infographic file made by me entirely using vector tools.
Ask a Question
If something does not work for you or if you have any questions, write in the comments and I will help you figure it out. You can also watch the video using vector tools.
Many novice design lovers are sure to face this problem, because in some moments a vector image is needed. This article explains in detail how to make a vector image.
What is the translation from a raster object to a contour object used for?
One example of this is a fill on which a vector mask is applied. The group of vector primitives is a group of tools for creating masks without payment and in automatic mode. In this example, it turns out that the image outline will be vector, while the fill is raster.
However, you need to understand that "Photoshop" does not work in full force with the vector, using the positive side where possible. When working intensively with graphics, specialists have various tasks, in solving which it is more convenient to immediately transform the selection into a contour, and not use an illustrator for this task. For similar tasks in "Photoshop" there is a function that allows you to convert raster objects into vector, because not all specialists prefer to use an illustrator.
How to make a vector from a bitmap?
To do this, in "Photoshop" you need to perform a certain order of actions. First, you need to select an object using the Select toolbox. The program converts any selected and selected object into a contour.
If the described methods of working with are difficult for you, then it is better to get acquainted with the interfaces of the programs first, because this is the basis, without knowing which, you cannot go further.
An example is the process of depicting a person from a picture. You can take the original picture and use a tablet and a hard-edged brush to outline the object. After that, you can modify it, for example, replace the face. After this image is converted into a vector, it will be possible to scale without loss of image quality.
Pictures for tracing
For an illustrative example, a light image is taken - a butterfly. When translating, keep in mind that the larger the picture, the better the vector image will be. This rule works in "Photoshop", similarly in "Illustrator". Large images are those larger than 1000 pixels.
Object selection
The process of selecting an object should start with the choice of tools. You need to use the most common Magic Wand Tool from the Tool set, and then right-click once in the white part of the workspace. As a result of these manipulations, you will make the work area.
Then you need to select the butterfly using the Select - Select Inverse set. In this procedure, inversion is performed in order to highlight the image. However, it is worth noting that this or another option does not affect the final result, the main thing is that the required object is selected.
In the photo above, you can see the so-called vector patterns. Such a picture is called a fractal - it is an object that, when enlarged, changes according to certain algorithms. A vector image is just right for depicting a fractal, you just need to drive in the formula and get the finished result, as shown above. This is called a vector pattern.
Create a vector outline
This is almost the final part of how to make a vector image. It is worth remembering the main thing: there are many programs for creating such images, a specialist needs to choose one (maximum two), otherwise your efforts to study all of them at once will be in vain.
After you have selected the area, convert it to a vector path. To do this, you can use the selection tools, such as the Lasso Tool, Rectangular Marquee Tool, Magic Wand Tool, etc. Next, right-click on the selection area, after which a menu will appear, in which you should select Make Work Path. Next there will be a menu that sets the level of smoothing Tolerance. The more anti-aliasing, the fewer the number of vector nodes and the less accurate the repetition of the raster path.
After all the above, a work path should be formed in Path. If there is no such palette, you can find it using the Windows window and select Path in it. Then you need to double-click on the Work Path and save it elsewhere. The paths in this area act similarly to the layers in the Layers palette. A highlighted outline means that it is activated and can be used.
Then select the path using the Path Selection Tool or the Path palette. You need to click the Layer button, then in the tab that opens, select New Fill Layer, and already in it Solid Color. Thus, you will create a fill layer, which is immediately assigned a vector mask in the form of your path.
End of work
To refine the image, you can use the Pen Tool - to select the mask of the fill layer. Then - adjust the Pen Tool, namely set the Subtract. With this, you can draw additional elements and patterns on the image.
This is how easy it is to make a vector image. This skill will definitely help novice designers.
In this tutorial, we'll talk about how to convert a bitmap to a vector shape in Photoshop. Of course, the Photoshop program is primarily intended for working with raster images, and the vector in it is a kind of addition in the form of paths with a vector layer mask, which is superimposed on the object and creates a vector shape. In such a vector shape (Shape), the path will be vector, and the fill will be raster.
In this lesson, consider the following steps:
Create a document and draw an object
First, create a new document of any size and layer.
Now let's draw any image. Take the Brush tool with soft edges and full opacity. Let's draw some simple geometric shape, for example, as shown in the image.
Selecting a bitmap object
To translate a raster image, you must first select it with any Select tool. Now select the drawn object either with the Wand Tool, or click on the layer with the left mouse button while holding down the Ctrl key.
Convert the selected object to a vector path (Path)
Call the context menu using any Select tool. To do this, move the tool over the selected object and press the right mouse button. In the menu that appears, select "Make Work Path ...".
A window will appear where you will need to enter the tolarence parameter, which determines how many control points the vector shape will contain, the more there are, the smoother the vector object will be, but the quality of the control points will be low.
Create a vector mask for a layer from a vector path
Go to the Paths tab, where the vector path we just created should appear.
Double click on it to give a name.
Then in the main menu select "Layer -\u003e New Fill Layer -\u003e Solid Color ...". You can name the new layer something, then click ok. Select a color for the future shape in the color selection dialog.
Now a new layer with a vector mask should appear in the Layers tab.
How to save a vector object to the vector shape library in Photoshop
Then you will be prompted to name the new vector object. Click ok and then test the new object in the library using the Custom Shapes Tool.
If the lesson on converting a raster to a vector turned out to be useful for you, then share it on the social network (icons below).
1. Picture. Below is a picture of a mini-car that will need to be worked on to give it a vectorial look. The image quality in this case is not so important, as long as there are details for tracing.
2. Process. First, right-click and do one of two things: a) Copy. Then in Photoshop "e Edit - Paste [Editing - Paste]. In this method Photoshop leaves the background layer locked and pastes the image on a new layer Layer 1 above the background. Double click on the word Layer 1 to select the text and name the layer more appropriate. For example, "theimage".
b) Save Picture As on the screw. Then in Photoshop File - Open [File - Open] and find where you saved the picture. Maybe on the desktop? .. Notice, in the layers palette, the image icon shows that the image is "indexed" [in short, it is a gif]. Notice also, it is blocked. To fix this, just go to Image - Mode - RGB color [Image - Model - RGB] and thereby transfer the locked layer to the background layer. Double clicking on the background layer will convert it to the editable layer. [Rename Layer 0 friendlier ... For example, "theimage".]
Now let's create a duplicate of the theimage layer. If you're using Photoshop 7 or CS, create a new set of layers to keep all individual objects. Just click on the folder icon at the bottom of the layers palette, double click on Set 1 and name it like mine.
3. A powerful pen tool. Let's start by creating a stroke around the entire car. Set the foreground color with the eyedropper, taking the color from the darkest place in the image. In this case, very close to black. Now select the pen tool from the toolbox. Make sure the Shape Layers option is on [top of the options bar], I've outlined it in orange.
Now just add anchor points where you want to edit the path.
Hint: Ctrl + [Plus on the numeric pad on the right of the keyboard] to zoom in. Accordingly, Ctrl is the reverse action. I recommend using these functions to enhance your image.
4. Connecting anchor points. After creating a path around the car, connect to the first anchor point to create a solid shape. Now hide the theimage copy layer to see what happens. [As I did in the image below.] Now let's start manipulating the anchor points to give our auto a slender shape.
This is how the Layers palette now looks with a new Vector Shape layer highlighted in blue. Also if you click on the Paths tab of the layers palette, you will see a "path" version of this layer.
5. Converting anchor points. Select the anchor point conversion tool and manipulate the areas that need transformations to give a clear border to the car.
Make sure the Shape 2 layer is selected.
I started converting points with the wheel. Click on the anchor point and move in the direction of the black arrow [see. fig.] until the path begins to follow the contours of the wheel.
Tip: The Conversion Tool creates 2 Bezier points to adjust the curvature.
Manipulate with Bézier curves to achieve as accurate a repetition of the paths as possible.
Tip: After converting multiple anchor points [or anchor points], you will realize that some of the original points are not needed at all. In fact, the fewer anchor points, the smoother the selection will be. So use the Anchor Point Removal Tool.
Here's what I got. We will use this form as a base.
Next, I made a copy of the Shape 2 layer and manipulated the points to draw the dominant color [blue, in this case] of the car. Click on this layer's thumbnail, grab the eyedropper and change the black color to blue # 3672BD.
This is what the car looks like now.
Now let's work on the windows.
Turn on the theimage copy [black] layer again and hide the Shape 2 copy [blue] layer.
Take the Pen Tool and in the Options Bar turn on the Subtract from area shape option [I've outlined it in orange].
Hide the Shape 2 copy layer. Select the Shape 2 layer. Start by tracing the windows on the opposite side of the car.
Turn off the visibility of the theimage copy layer, see the result.
Subtracting from the black shape created the illusion of transparency.
To apply this effect to the other two windows without adding a new layer, just hold Ctrl + Alt, click and drag this subtraction path to copy. [Do this twice.] Now place the duplicates in their places. Use the Anchor Point Conversion Tool again to smooth corners and shape precisely.
Apply the same technique on the Shape 2 copy layer to get the same image as mine.
Now that we have the base of the vector car shape, all that remains is to add new shapes, lines and a few textures. We'll fill the windows later!
Now using the ellipse tool in the Toolbox draw the center of the rear wheel, then hold down Shift and do the same for the front wheel.
For precise positioning, Ctrl plus click on the new ellipse, then right click on the simple ellipse and choose Free Transform Path. Right click again and choose Distort. I also started working on the headlights [on a new layer] using the same technique: Ellipse - Free Transform - Distort - Set to Position.
Since the new layers were added, they could accumulate, it is reasonable to name them correctly. [I thought it was possible to use as few layers as possible, but ...]
Next, I added a bumper. Again, using the tracing pen tool, an anchor point conversion tool to smooth corners and shape accurately relative to the original. [All of this is a long-established and accepted practice of tracing, honestly!]
Then I applied a layer style to the bumper to give it a chrome effect. Right click on the bumper layer and apply the following settings.
Create a new layer and name it Lines. This layer should be above all. So, on the toolbar, the pen tool is selected, on the options panel, the settings correspond to the specified ones, we begin to add anchor points in the direction of the white arrow.
Now set the active color to black [or just press D], press the B key to select the brush tool, now in the options bar set the Brush Preset Picker and choose a small, soft-edged brush about 3 size. But change the diameter by 2 pixels [try even 1], since even 3 can be a lot.
To reselect the pen, press P, activate the Lines layer, right click and select the Stroke Path option.
You will be prompted to select the tool with which you want to create a new stroke. Choose Brush from the dropdown menu and click OK.
I changed the opacity of the Lines layer to 54% to soften it.
Then I continued in the same spirit, using the same technique to add other lines.
Added a mirror, wipers and a badge on the hood.
Tip: For areas that are too small to handle with the pen tool, use the polygonal lasso. Just click and add anchor points like a stylus, and when you're done, right-click on the selection and choose either the "Create Work Path" or "Fill" option.
For structures like highlights, use the polygonal lasso [L] to trace around these areas, right click and Fill with soft blue [I used # 86A9D7].
All that's left to do now is add details. The detail is up to you. Below is the result of my work after adding details to the headlights, wheels and te teh.
Hope you enjoyed the tutorial.
Final result 
As you know, vector illustrations are currently very popular in web graphics. Professional designers can create such illustrations in a matter of hours. If you are a beginner or a hobbyist, web graphics lessons will certainly be extremely useful for you. The purpose of this lesson is to shed light on the process of creating the selected image. I will demonstrate the whole process step by step and explain all the steps using my comments.
To create a really cool image, you have to choose the program you want and follow certain rules. If you want to draw a vector illustration, you should keep in mind that for this you use editors such as Adobe illustrator or CorelDraw... However, Photoshop has sufficient funds to develop vector illustrations. I will illustrate this in my lesson on how to translate a drawing into a vector. I have chosen the sketch of a cat as the basis for the illustration. I decided to portray a blue cat with pink flowers in its paws.
Step 1
Let's start by creating the background. Draw the shape using the selection tool () (in the Shape layers (Layer Shape)). Settings - (Fill Opacity) \u003d 0% ... Now use a gradient overlay: ((Layer Style - Gradient Overlay)) to fill the created shape. All settings are default, you only need to change the angle (I will specify the degree) and the gradient. Add Stroke (Stroke) ((Layer Style - Stroke)). We use all the default settings, except for the width in 1 px and colors.
