Make a Handy 3D Vector Calendar Icon (best of Vectut)

Make a Handy 3D Vector Calendar Icon

Learn to make a handy calendar icon to use on your blog, website, or print projects. We’ll use Illustrators Path and 3D tools to create this design. Also, a simple page curl effect will be demonstrated as well. Let’s jump into this tutorial.

Final Image Preview

Here is the final look we’ll be achieving. To successfully complete this tutorial you should have a fundamental grasp of Illustrators tools.

Step 1

Start by drawing a square using the Rectangle Tool (M).

Step 2

Rotate the square by going to Effect > 3D > Rotate. You do not have to enter these exact values, but be sure to make note of the values you do enter because you’ll need to refer to them again when we add text. After you click OK, expand your shape by going to Object > Expand Appearance.

Step 3

To simulate the depth of the calendar we’ll use Illustrator’s 3D Extrude & Bevel Options. Go to Effect > 3D > Extrude & Bevel. Enter 1 degree for the X axis rotation (first box). In the Extrude Depth box enter a high number, as shown below. The larger the X axis number the smaller your value for Extrude Depth will be.

I prefer this method because it distorts the face of the calendar much less than entering a large X axis number and small Extrude Depth number. Click OK, then go to Object > Expand Appearance. Last, go to Object > Ungroup. Note, you may have to ungroup the object several times in order for each shape to be individually handled.

Step 4

Repeat Step 3 to make the base of the calendar. Enlarge the shape so that it is slightly wider than the top. Remember to expand and ungroup the shape so that you can color each side of the object later.

Step 5

Create a small border around each of the edges of the top part of the calendar by going to Object > Path > Offset Path. Enter the values shown below. This small border will allow us to give the edge of each side calendar side a little bit of highlight or alternative gradient, which is a small detail, but adds to the overall quality of the piece.

Step 6

Give the inner shapes you just made a slight gradient. Observe how the left side of the calendar has a slightly lighter gradient than the right.

Using the Pen Tool (P), draw lines inside the inner shapes you just made to simulate the edge of some of the calendar pages. There is no math involved with this step. Just use your eye and make it look good. Notice how the lines taper down to a point.

Step 7

Once you have all the lines drawn, use the Distribute Palette to make the space between each of the lines perfect.

Step 8

Additionally, you can select all the lines at once and give them a gradient to help them blend into the shapes behind them a little more.

Give the base of the calendar some color making sure to apply a slightly lighter color on the left and a darker color on the right.

Using the same line shape you drew to create the edge of the pages, add it as highlights below to give the impression of a shadow and a highlight.

Step 9

Select a font that you like (I’ve used Din) and type the words you’d like to appear on the front of the calendar. Rotate the type to match the angle of the surface of the calendar by going to Effect > 3D > Rotate. Enter the values that you used in Step 2, then click OK.

Step 10

Add the type to the face of the calendar and change the color to white.

How to Create a Vector Diamond Necklace and a Chain (best of aiVault)

How to Create a Vector Diamond Necklace and a Chain

Step 1

CREATING THE DIAMOND SHAPE

Star-off by creating a circle and we all know how to it by now 

Next we will make use of the guides and star dividing the shape with equally sized straight lines and guide as a reference.

Step 2

USING GUIDES FOR DIVIDING THE SHAPE

Create a copy of one horizontal and one vertical line , select the rotate tool , while pressing alt create and rotate a copy of both lines as well as the guide lines.

Keeping the intersecting point of the guides and the lines as a reference align a square inside it , similar to the one seen below.

As shown below create a copy like we did with the lines and rotate it .

Now we need more guides placed , now i dont know any other way of creating the angled guides , i never really explored how to do it  , my process is to first unlock your diagonal and vertical guide select both using select tool , click on the intersecting point hold shift+alt and rotate the copy . Holding Shift will give you a snap to the middle point. hope it is clear below you can see the screen shot while i rotated the guides.

And here i have a copy done again you can do this by hitting CTRL+D which will repeat your last action.

With guides being our reference start drawing lines as shown below these are in pink color so you can see the progress

Step 3

ADDING DETAILS

Step 4

COLORING

Now turn off the guides once you are done. select the full divided / drawn circle with lines and square and using the Paint Bucket Tool fill it up with one color.
Ok you might say why not just fill the circle with foreground color change , the technique i used here is to break the full drawing up in sections and i prefer using live color option HOW? see below.
Here the full drawing is selected and then filled up with one single color . the bounding box you see below show that this is a live color object now .

Click on Expand which you will see on the top bar. This will break the full drawing into devided section making it easy for us to color each. Before doing that left click and ungroup.

Fill it up with gradience as show below

Create a star shape , i will not go into detail on how i did this one in short select the star shape tool with 6 points. create a copy place above and give a slightly tinted color.

Step 5

CREATING THE BACKGROUND

I created a black bounding box now and had sent it to back so i can better develop the final image. create a circle , and go to object>path offset path to create a bit smaller circle placed inside this one.

Using live Paint fill it up with gradient Create a copy and align in the middle

Group the diamond shape that we created above and start placing it inside the RING that we created.

Give a gradient to the rings as show below.

I created another ring silightly broader to place at the back of this whole drawing. ( create one , offset and use pathfinder to intersect You may want to learn the tools if you dont know then See the Guide here )

Again take a copy of this broader circle and place at the top , and draw an oval shape filled with same gradient.

Step 6

CREATING THE CHAIN

Start building the chain with the copy of the same thing

And Finally the whole thing is complete give a finishing touch by using copy of the SHINE we create using star shape and place it on top

FINAL PREVIEW

Create more copies and give a bit of transparencies.

I’m Done! 

Illustrator tutorial: The Perfect Diamond (best of vector dairy)

Drawing a diamond is pretty simple in illustrator. First, let’s do some research on theanatomy of a diamond. We don’t want to do some fancy cut and get rejected by our clients. Here’s a proportional diamond line art taken from the website. We will use this as a guide to help us create a perfect diamond.

1. Create a template guide

First, place the line work by going File>Place and select the graphic. Go to Layers Palette and click the arrow to show the menu and select Template. This will lock and make the graphic transparent for easy tracing.

2. Placing a guide in the center

Turn on your Rulers by pressing Ctrl/Command+R. Drag a guide and place it in the center.

Next turn on the Snap to Grid by pressing Shift+Ctrl+”/Shift+Command+” or go Window>Snap to Grid. You will see the grid appear at the background.

3. Tracing the artwork

Create a new layer in your Layer Palette (new layer icon at the bottom of the palette). Using the Pen Tool, start to trace each facet. The points will snap to the grid. Make sure to close each shape and make the points meet in the same spot. Do this until we complete the right half of the diamond. We can turn off Snap to Grid and manually adjust the points to fix the curves which doesn’t snap to the grid very well.

4. Reflecting the diamond

Select the whole half of the diamond. Select Reflect Tool and Alt/Option+click on the center guide line. This will pop up a menu. Select Vertical for Axis and click Copy.

Let’s start combining the center facet. Select both the facets at the bottom and hold Alt/Option+Click and click Add to shape area from Pathfinder (Window>Pathfinder). Repeat this step for the top facets too.

5. Fill the diamond

Select one of the facet and fill it with Linear Gradient. Create a 3rd point in the gradient by clicking in between the 2 points once and make it black. Also turn off the stroke for the facet.

Select the rest of the facets and using the Eye Dropper Tool, click once on the facet we just filled with linear gradient. This will fill the rest with gradient.

Looks pretty ugly now, so let’s fix that. Select the Gradient Tool and click and drag in different directions for each facet. Do this until you get something below.

I find the black white gradient looks a bit too harsh. Let’s fix that by selecting all the facets and open both your Gradient and Color Palette. Click once at the middle black point in the Gradient Palette. The Color Palette will show the black color. Change it to a darker blue. This will make the diamond appear cooler. Better now, right?

6. Drawing the girdle

You realise I haven’t draw the girdle( new word I learnt from my research). Select the Rectangle Tool and draw a rectangle that meets all the four points of the girdle’s edges. With the Pen Tool, go near the selected rectangle and click once at the middle of the top line. This will add a new point. Click the Keyword Arrow Key and shift the point upwards. Do this for the bottom too. Once done, Right+Click and select Arrange>Send to Back. This will cover the missing girdle.

7. Finishing Touch

How can a diamond do without it’s shining glow and sparkling starburst? So let’s begin to draw a circle and fill it with Radial Gradient from white to black and send it to the back of the diamond.

Select the Star Tool and drag a star on the canvas. Without releasing the mouse, press Arrow Up key to add additional points. Hold Ctrl/Command and drag to increase the radius. Try to get a starburst as shown below.

Here’s the final illustration and hope you enjoy cutting your own diamond. If you like my diamond, pls remember to “grade” my 10-carat diamond.