How to draw a vector stopwatch in Adobe Illustrator (translation). How to draw a clock
In this lesson we will learn how to quickly draw a stopwatch (or clock) in Illustrator. The lesson will be especially useful for those who draw for.
Step 1. Settings
Let's create a new document with a size of 600x600 pixels. Make sure the Align to Grid checkbox is unchecked. Then turn on the grid (View > Show Grid) and snap to it (View > Snap to Grid). In the settings, set the grid cell size to 5 pixels (Edit > Preferences > Guides > Grid) and set the units of measurement we need (Edit > Preferences > Unit > General).
Step 2. Draw the shape
Create a circle (L) with a radius of 140 pixels and fill it with a gradient, as shown in the image. Without removing the selection, let's go to the Appearance panel. Add a 4pt stroke and apply it to it: Stroke - inside, Opacity 30% Soft light. All operations are done in the View window, by clicking on the word Stroke and in its properties.
Let's duplicate our circle (Ctrl+C -> Ctrl+F). Let's create a 190 x 110px ellipse without a stroke and fill it with black for convenience. Let's place it as shown in the figure ( bottom edge one cell below the center of the circle), select both objects and, through the Pathfinder window, cut out the upper one from the lower one.
Select the resulting object and remove its strokes in the View panel. Next, fill it with black and select opacity 20%, Soft light.
Step 3. Draw the dial
Let's create a circle with a radius of 120px in the center of our shape and fill it with a gradient, as shown in the picture. In the View panel, apply the Inner Glow filter to the fill with the values shown in the figure. Add a 2pt stroke with colors R=165 G=175 B=178 and apply a Drop Shadow effect to it with the following parameters. Let's add another 1pt stroke with colors R=135 G=145 B=148.
Duplicate the stroke through the same View panel and set its thickness to 2pt. Let's repeat this step, setting the thickness to 1pt. Using the Pen Tool (P), draw a line that is 5 px high and has a 2pt stroke thickness. Set the stroke color to R=176 G=184 B=186. Let's place the lines on the “60 seconds” of our future dial. Duplicate the line and place it at “30 seconds”. Let's group (Ctrl+G) and apply the transformation as shown in the picture (Ctrl+Alt+Shift+D)
Extend the line at “60 seconds” to 7px and give it a stroke color of R=135 G=145 B=148. Duplicate it for “30 seconds”, group it and transform it, as shown in the figure.
Step 4. Draw an arrow
Draw a 4 x 52px rectangle (M) exactly below the 60 seconds mark. Use the Direct Selection Tool (A) to move the top points one pixel to the center. Draw a circle with a radius of 1 pixel and use the Pathfinder panel to combine the arrow with the circle. Fill the result with color R=50 G=50 B=50. Using the View panel, create a new fill in the object and set its color to white. Let's set its blending mode to Soft light. Using the Effects menu, reduce it by 1px (Effect > Path > Offset Path)
Set the grid to 5 pixels again. Let's draw a circle with a radius of 10 pixels and fill it with a gradient, as shown in the figure. Let's add another fill with color R=241 G=236 B=232. Let's move it by -3 pixels. Group the arrow with the resulting “rivet” (Ctrl+G) and add a shadow to the new object.
If desired, the arrow can be rotated to the desired time using the Rotate tool (R)
Step 5. Draw glass
Draw a circle with a radius of 120 pixels and apply a white fading gradient to it and place it as shown in the image. (Note: You can use an opaque gradient with a Multiply blending mode. In this case, the visible edge of the gradient should be different from white. this may be especially important for wastewater). Set the fill opacity to 65% and offset the outline by -3 px.
Add a 1pt inner stroke. Give it a Soft light blending mode and 30% opacity. Add a second stroke. This time set its Weight to 3pt, Opacity to 20% and Blending Mode to Soft light.
Add another fill, this time linear, from black to white and with a transparency of 15%.
Let's draw an ellipse (L) measuring 70 x 20px. Fill it with black and set the opacity to 3%. Apply the Arc effect as shown in the picture. Duplicate the ellipse, fill it with white, set the opacity to 20% and change the arc to 50%
Step 6. Draw the details
Let's create a circle with a radius of 30 pixels without fill. Give it a 3pt stroke. Let's change the stroke to fill Object > Path > Outline Stroke and fill it with a gradient, as shown in the picture.
Add a second fill to the object, moving it by -1 pixel, blending mode Soft light. Let's add another fill and position it as shown below.
Let's add a fourth fill with values as in the picture and transparency 70%. Now let's add a day for the entire object (select it in the very top line of the View panel).
Let's draw a 10 x 20px rectangle (M) and fill it with a gradient as shown below. Apply the Rounded Corners effect (Effect > Stylize > Rounded Corners) with a value of 3px and expand the appearance of the object (Object > Expand Appearance). Add a radial fill with 70% opacity.
Set the grid to 1 pixel again. Let's draw an 8x2 pixel oval, fill it with white with Soft light transparency. Let's add two black rectangles 10x4 and 10x2 with a Soft light blending mode and opacity of 15% and 30%, respectively.
Select the ring with the holder and move it to the back (Shift + CTRL + [). Let's draw a 10x1 rectangle, fill it with color R=195 G=200 B=205 and place it in front (Shift + CTRL + ])
Let's draw a square with a side of 10 pixels. Fill it with a gradient and apply the Rounding Corners (1 pixel) and Arc effects sequentially. Then let's expand the view.
Remove the snap to the grid (Ctrl + Shift + "). Duplicate our shape twice, raise the second copy by 1 pixel. Subtract these two copies from each other, apply a 30% transparency to the resulting result and fill it with black. Repeat the operation, only now raise one copy by 3 pixels and set the transparency to 15%
Let's return the snap to the grid (Ctrl + Shift + "). Draw a 20 x 10px rectangle, round its corners by 3 pixels and fill it with a gradient. Align it with the previous shape. Unsnap and repeat the trick with cutting out copies (1 time).
Select the rounded path again and blend it by -1 pixel (Object > Path > Offset Path). Duplicate the result (CTRL + C > CTRL + F) and lower it by 1 pixel. Let's subtract these two objects from each other. Fill the result with a gradient and set the mode to Soft light. Select the rounded outline again, make 2 copies of it, move one down 1 pixel and subtract from each other. Fill the result with black with 30% transparency and Soft light mode.
Let's group the resulting button and rotate it 45 degrees. Let's add a shadow with parameters as in the picture.
Let's place our grandson on the stopwatch. Let's duplicate it and flip it horizontally. Let's place a second button. Let's change the shadow of the second button a little. Almost done.
Add a background with color R=56 G=147 B=160 to the background. Let's select all our objects and convert the lines into fills, and also expand all the objects to which we applied the effects Object > Expand Appearance, Object > Path > Outline Stroke. Select the outline of our stopwatch, duplicate it (CTRL + C > CTRL + F), fill it with color. Add a 1pt stroke to the outline with Opacity 25% and Soft light mode. Let's add another 3pt stroke with 15% opacity. Then apply a shadow effect to the outline several times. Let's place it behind the stopwatch.
Our stopwatch is ready. Using different color variations, you can get other very interesting options.
Photoshop provides a wide range of drawing options for those new to Illustrator. In this lesson you will learn how to draw a stopwatch.
Final image:
Step 1
Create a new document (Ctrl + N) with the parameters that you see in the screenshot. Now turn on the grid (View - Show - Grid)(View > Show > Grid) and attachment to it (View - Snap To - Grid)(View > Snap To > Grid). Need to set a grid every 10px Edit > Preferences > Guides, Grid & Slices).
In point Line every ( Gridline Every) set it to 10, and in the Subdivision item set it to 1. Also, set the grid color to #a7a7a7. After all parameters have been set, click OK.
Step 2
Turn on the rulers (Ctrl + R) and pull out two guides from them.
Step 3
For color foreground set #a1d8ff and select tool Ellipse Tool). Draw a 240px circle and place it in the center of the document. Duplicate this vector shape (Ctrl + J) . Decrease the parameter Fill (Fill) this layer in the Layers palette to 0% and add a style to it Stroke (Stroke):
Step 4
Select the top blue circle that you created in the previous step. Select a tool Ellipse Tool, click on the button Subtraction in the properties panel at the top of the screen and draw a 200px circle as shown in the first image.
Go to the Layers palette and change the blue color of the shape to #d7d7d7, then apply some layer styles:
Step 5
Select the shape you edited in the previous step and duplicate it (Ctrl + J). Right-click on the duplicate layer and select Clear Layer Style. Decrease the parameter Fill to 0% and add a layer style Embossing(Bevel & Emboss).
Step 6
To perform further steps you need to add a grid every 5 pixels (Editing - Settings - Guides - Grid and fragments) (Edit > Preferences > Guides, Grid & Slices). In the window that opens, set each field to 5 pixels.
Tool Ellipse Tool draw a 200px circle and position it as shown in the first image.
Without changing the tool, with the layer with the circle you just drawn active, click on the button Subtraction in the properties panel and draw a 190px circle as shown in the second image.
Step 7
Focus on the vector shape layer we created in the previous step. First, change its color from blue to #c8c8c8 and add a layer style Inner shadow(InnerShadow).
Step 8
Select a tool Ellipse Tool, draw a 190px circle and position it as shown in the first image. To this shape add some layer styles:
Step 9
Select a tool Ellipse Tool, draw a 180px circle and position it as shown in the first image. Decrease the parameter Fill (Fill) this layer to 0% and add a style to it Stroke (Stroke).
Step 10
Now you need to set the grid every 1 pixel (Editing - Settings - Guides - Grid and fragments) (Edit > Preferences > Guides, Grid & Slices) . In the window that opens, set each field to 1 pixel.
Set the Foreground color to #141414, draw two 10px vector shapes and position them as shown in the first image.
Create a duplicate of this rectangle (Ctrl + J) , move it down and position it as shown in the second image. Select both layers with rectangles (while holding down the Shift key, click on these layers in turn). Now convert these layers into a smart object (right-click on the layer in the Layers palette and select Convert to Smart Object).
Step 11
(Ctrl + J) and turn it 90 degrees (Edit - Transform - Rotate 90°) (Edit > Transform > Rotate 90°CW). In the Layers palette, select both smart objects and convert them into one smart object (right-click on the layer in the Layers palette and select Convert to Smart Object).
Step 12
Duplicate the smart object you created in the previous step (Ctrl + J) and rotate the duplicate (Edit - Transform - Rotate) (Edit > Transform > Rotate). On the properties panel, enter the value 30 - the number of degrees you want to rotate and click Enter.
Duplicate the smart object layer that has been rotated (Ctrl + J) and rotate this duplicate by 60 degrees (Edit - Transform - Rotate) (Edit > Transform > Rotate).
Step 13
Set your Foreground color to #54a5e8 and draw two 5px vector shapes. Arrange these shapes as shown in the first image. Duplicate the layers with these rectangles (Ctrl +
J)
, slide them down and position them as shown in the second image.
In the Layers palette, select both layers with rectangles and convert them into a smart object (right-click on the layer in the Layers palette and select Convert to Smart Object).
Step 14
Rotate the smart object created in the previous step by 6 degrees and click Enter (Edit - Transform - Rotate) (Edit> Transform> Rotate).
Duplicate this smart object (Ctrl + J) and turn the duplicate by 12 degrees (Edit - Transform - Rotate) (Edit > Transform > Rotate).
Duplicate this smart object (Ctrl + J) and rotate the duplicate 18 degrees (Edit - Transform - Rotate) (Edit > Transform > Rotate).
Duplicate this new smart object (Ctrl + J) and turn it to 24 degrees (Edit - Transform - Rotate) (Edit > Transform > Rotate).
Step 15
Select four smart objects blue color created in the previous step, convert them into a single smart object) (right-click on the layer in the Layers palette and select Convert to Smart Object) and duplicate the resulting smart object (Ctrl + J). Rotate the duplicate by -30 degrees (Edit - Transform - Rotate) (Edit > Transform > Rotate).
In the Layers palette, select both blue smart objects, convert them into a single smart object, and then create two copies (Ctrl +
J).
Rotate the first duplicate 60 degrees (Edit - Transform - Rotate) (Edit > Transform > Rotate).
Rotate the second duplicate by -60 degrees (Edit - Transform - Rotate) (Edit > Transform > Rotate).
Select all the blue smart objects and convert them into a single smart object. Add a style to the resulting smart object Color Overlay (ColorOverlay).
Step 16
Set the Foreground color to #141414 and use the Text (Type Tool) write the numbers as shown in the first image. To create the text I used the font Calibri, Bold, size 15pt.
Select all the text layers, convert them into a smart object and add a style to the resulting layer Shadow (DropShadow).
Step 17
Set your foreground color to red and use the tool to draw 4 vector shapes of 97px size. Place these shapes as shown in the first image, select the tool Arrow (Direct Selection Tool) and focus on the bottom of one of the red rectangles.
Select the left anchor point and move it 1 pixel to the right, then select the right anchor point and move it 1 pixel to the left.
Step 18
Select the vector shape created in the previous step and click Ctrl + T. Focus on the center point on the red shape. While holding down the key Shift, drag it as shown in the first image. Finally, rotate the red shape as shown in the second image:
Step 19
Focus on the vector shape edited in the previous step. To start, replace the red color with #141414 and add a layer style Inner shadow (InnerShadow).
Step 20
Foreground color set to #141414, select tool Ellipse Tool and draw a 14px circle. Add a layer style to this shape Inner shadow (InnerShadow).
Step 21
For the foreground color, select #d5cdc3 and use the Ellipse Tool draw a 4px circle. Position the shape as shown in the screenshot. Add layer styles to the layer with this shape:
Step 22
Select the three vector shapes you created in the last five steps and duplicate them (Ctrl + J). Select these copies and convert them into a smart object. Decrease the parameter Fill (Fill) to 0% and add style Drop Shadow.
Step 23
Select the smart object you created in the previous step and duplicate it (Ctrl + J). Drop Shadow.
Step 24
Select a tool Ellipse Tool, draw a 55px circle and position it as shown in the first image. Decrease the parameter Fill Layer with the shape you just drew to 0% and add a layer style Stroke (Stroke).
Step 25
Focus on the circle you created in the previous step, set your Foreground color to #141414 and draw two 4px vector shapes. Select both of these rectangles and convert them into a smart object.
Step 26
Duplicate the smart object created in the previous step (Ctrl + J) and rotate the duplicate 60 degrees (Edit - Transform - Rotate) (Edit > Transform > Rotate). Duplicate the smart object again (Ctrl + J) and rotate the resulting layer by -60 degrees (Edit - Transform - Rotate) (Edit > Transform > Rotate).
Tool Text (Type Tool) write the numbers (I used the font Calibri, Bold, size 8pt).
Step 27
For the foreground color, select red and use the Rectangle ( Rectangle Tool) draw four 43px vector shapes. place the shapes as shown in the first image, select the tool Arrow (Direct Selection Tool) and focus on the top of that red rectangle.
Select the left anchor point and move it 2 px to the right, then select the tool Delete Anchor Point Tool and delete the top right anchor point. The figure will look like the second image. Next, rotate it as shown in the third image.
Make active the layer with the shape you created in the previous step and change its color to red to #141414. Add style to this figure Inner shadow (InnerShadow).
Step 29
Set the foreground color to #141414 and use the Ellipse Tool draw a shape 10px in size. Add style to this figure Inner shadow (InnerShadow).
Step 30
Set the foreground color to #f0eae3 using the Ellipse Tool draw a 2px circle and add layer styles to it:
Step 31
Select the three vector shapes you created in the last four steps and duplicate them (Ctrl + J). Convert the resulting copies to a smart object, reduce the parameter Fill this smart object to 0% and add a layer style to it Drop Shadow.
Step 32
Duplicate the smart object created in the previous step (Ctrl + J). Add a layer style to the duplicate Drop Shadow:
Step 33
Duplicate the vector shape you created in step eight, remove the layer styles from it and move it to top part Layers palette (Shift +Ctrll + ]). Set the parameter Fill to 0% and add layer styles:
Step 34
Duplicate the vector shape edited in the previous step (Ctrl + J), remove layer styles from the duplicate, reduce the parameter Fill to 0% and add a layer style Stroke (Stroke).
Step 35
Select the 3px radius tool, draw a 24x30px vector shape and position them as shown in the first image. Apply the command to the drawn figure Warp (Edit - Transform - Warp) (Edit > Transform > Warp). From the drop-down menu, select the Arc deformation type, set the Bend field to 25 and press Enter.
From the drop-down menu of the Deformation command, now select the Arc Upper type, set the Bend field to -10 and press Enter.
Step 36
Apply some layer styles to the vector shape you created in the previous step. When you get to the layer style, save the gradient you are using by clicking on the button New.
Step 37
Focus on the top of the vector shape you edited in the previous step. Now select a tool Rounded Rectangle Tool with a radius of 3px and draw a vector shape measuring 30x20px.
Apply the command to this shape Warp (Edit - Transform - Warp) (Edit > Transform > Warp): from the drop-down list, select the Arc Lower type, set the Bend field to 20 and press Enter.
Step 38
Apply some layer styles to this shape. When you come to style Gradient Overlay, use the gradient that you saved in step 36.
Step 39
Tool Ellipse Tool Draw a 30x6px shape and add layer styles to it. When adding a style Gradient Overlay also use the gradient saved in step 36.
Step 40
Set your Foreground color to #d7d7d7 and use the Ellipse Tool draw a circle of 80px size. Position the shape as shown in the first image. Without changing the tool, with the layer with the shape you just drawn active, click on the Subtract button on the properties panel and draw a 68px circle, as shown in the second image.
Step 41
Focus on the bottom of the shape you created in the previous step. Select a tool Rectangle Tool with the Subtract option and draw a 22x10px vector shape. With the layer with the shape you just drawn active, select the tool Ellipse Tool, click on the Add button on the properties panel and add two 6px circles as shown in the second image.
Step 42
Add layer styles to the shape drawn in the previous step:
Step 43
Focus on the bottom of the vector shape edited in the previous step. Set the Foreground color to black and use the Ellipse Tool draw two 6px circles. Arrange the shapes as shown in the first image.
Add a layer style to the left and right circles Drop Shadow. Now select both circle layers and move them under the vector shape edited in the previous step.
Step 44
Tool Rounded Rectangle Tool With a radius of 3px, draw a 16x18px vector shape. Apply the command to this shape Warp (Edit - Transform - Warp) (Edit > Transform > Warp).
Select Arc Lower and Bend to 30. Press Enter to apply the changes.
Apply the command again Warp (Edit - Transform - Warp) (Edit > Transform > Warp), but this time select Arc Upper. Set the Bend parameter to -10 and press Enter to apply the changes.
Apply layer styles. In Layer Style Gradient overlay (Gradient Overlay use the previously saved gradient:
Step 45
Tool Rounded Rectangle Tool with a radius of 3px, draw a 20x20px shape and apply the command to it Deformation(Edit - Transform - Warp) (Edit > Transform > Warp). From the drop-down list, select Bulge, set the Bend field to 15 and press Enter.
Add layer styles, and when adding a style Gradient overlay (Gradient Overlay use the previously saved gradient. Convert this shape into a smart object.
Step 46
Now we need to create a texture. First, create a new document (Ctrl + N) , in the Width and Height fields, set the value to 2 and click OK. From the Layers palette, remove the "Background" layer, set the Foreground color to black and select the tool Rectangle (Rectangle Tool).
Draw a 1x2px shape and convert it into a pattern (Editing - Define Pattern) (Edit > Define Pattern). Give the texture a name and click OK. Close this document (no need to save it) and return to the main document.
(Paint Bucket Tool)
Step 58
Convert the layer you created in the previous step into a smart object and add to it filter Noise (Filter - Noise - Add Noise) (Filter > Noise > Add Noise).
Translation: Slutskaya Svetlana
Good afternoon Today it's time for a drawing lesson in which we will tell you how to draw a clock! Clocks, as you know, can be wall clocks, wrist clocks, giant clocks installed on architectural buildings, and, of course, soft clocks. Alas, we will not be considering the work of the brilliant Salvador Dali today, but the clocks that we will draw will be quite realistic. Let's start a drawing lesson and find out!
It is quite possible that someone will consider wall clocks a thing from the past, because now everyone has a clock on their cell phone and other devices. However, every interior will become much cozier and more pleasant if there are well-chosen wall clocks on the wall. Actually, let's start drawing!
Step 1
First, let's mark out our workspace with these perpendicular (that is, intersecting at right angles) lines. Of course, it’s very cool to draw this without a ruler, but if you’re not entirely sure, use a ruler. 
Step 2
Then let's draw a circle like this. You can use a compass or some round object, but it’s best, of course, to try to draw by hand.
Step 3
On top of the circle from the previous step, draw another one, slightly larger in diameter.
Step 4
Using the markings from the first step, we will apply the strokes of each hour along the entire circumference of the dial. We draw 12, 3, 6 and 9 o'clock first, and mark the rest at equal distances between them.
Step 5
We mark the second divisions with very small strokes. Watch the distance, it should be strictly the same between all divisions.
Step 6
Great, now let's put numbers near each hour mark. Try to have the same numbers drawn the same way on each hour.
Step 7
We put even arrows - in our case they intersect and show seven o'clock. You can set any time, the main thing is to correctly convey the size and shape of the hands
IN New Year's Eve We are all waiting with bated breath for the chimes to strike and the New Year to begin. Clocks are one of the main symbols of the holiday, and it’s not for nothing that they are painted on New Year’s Eve. greeting cards and posters. Pick up the New Year's issue of any magazine, and there with a high degree of probability you will find beautiful watch with the hands frozen at almost midnight. In this article we want to talk about how to draw a New Year's clock correctly. And if you decide to do new year poster with a clock, or draw beautiful postcard in order to give it away to a loved one- then this drawing lesson is just for you.
Example No. 1
You can try the simplest method first. To do this, draw a circle using a compass. Then you need to draw neat numbers on them. On their surface it is desirable to create New Year's drawing. Santa Claus sitting on the moon will look beautiful.
When everything is ready, it is advisable to decorate the numbers with one color, and the surface with others. Wonderful New Year's watch is ready. The drawing can be cut out or left as is.
Example No. 2
Another way is to create a New Year's cuckoo clock. Previously, such an element was in every home, although now it is found in some. If there are none, then you can easily draw them.
First you should draw a small village house on which the round dial is placed. At the top you need to make a cuckoo and a small place for it. After this, you need to decorate your work with any chosen colors of paint.
Example No. 3
This method produces unusual New Year's watches. They are similar to homemade ones, only they have some additions. First you need to draw a circle using a compass. Then semicircles should be drawn along the edges of the entire surface. In each petal you need to place numbers and separate them from each other.
After this, you need to draw arrows with a pencil, which can also be unusual shape. All that remains is to add color to the product, and it is ready. You can decorate them with any details, it all depends on your desire.
Example No. 4
You can create a clock not only in the shape of a circle, but also in the shape of a square. By decorating them with unusual decoration, they may well become New Year's. First of all, you need to create an even square. It is advisable to leave a space at the edges that will be the field of the product. Numbers will be placed next to it. Moreover, they can be both Arabic and Roman.
Then you will need standard arrows. It is advisable that they show the time closer to twelve. It is recommended to decorate the resulting drawing with any colors.
Example No. 5
You can make another one using this master class holiday drawing, since a New Year's wreath will be placed around them. First you need to draw a round clock, decorating it with arrows and numbers. In a circle you need to draw a wreath of their spruce branches. Then you will need Christmas tree decorations to decorate it.
When the drawing is ready, it is advisable to transform it with paints different colors. We got it holiday hours that can be hung on the wall. He'll make a great New Year card or poster. Gift wrapping will be no less beautiful. You can make a beautiful New Year's alarm clock.
Video master class on drawing a clock
Clocks can be made different ways. They are decorated with various ornaments and relief figures. Snowflakes, stars, a month, a Christmas tree will look beautiful; they can be cut out and hung on the wall or on the Christmas tree. While working, you should make the lines smooth and neat. The clock making activity is very interesting and therefore perfect for children and adults.
