how to draw a 3d telephone box
Preview
Step i: Draw a 3D Box
Open up up a new document in Illustrator. Set information technology upward in the manner you prefer. Select the Rectangle Tool (M) from the Tools Panel.
Describe a square object on the artboard; hold downwardly the Shift key to make a perfect foursquare. Fill the square with gray.
Next, we will convert the gray box into a 3D shape.
Make certain the box is selected (if non, use the Option Tool) and then go to Outcome > 3D > Extrude & Bevel. For the 3D Extrude & Bevel options, use the settings below.
With the shape yet selected, get to Object > Expand Appearance.
Now we have a simple 3D box shape.
Stride two: Draw the Box's Flaps
Select the top side of the box with the Direct Choice Tool (A). With the pinnacle side selected, copy it (Cmd/Ctrl + C) and and so paste it in front end (Cmd/Ctrl + F).
We want to increase the size of the copied meridian side proportionally.
In guild to do that, we tin can apply an Starting time Path (Object > Path > Offset Path) of 25pt. We will end up with two objects, the original top side (inner shape) and the 25pt path surrounding it (outer shape).
Now nosotros desire to subtract the inner shape from the outer shape.
We will use the Pathfinder Console (Shift + Cmd/Ctrl + F9) for this. Select the two objects and then click on the Exclude button in the Pathfinder Panel. This will cut out the inner shape.
Make 4 copies of the tiptop side of the box again and and then marshal them with each corner of the shape we just made.
Select all shapes and utilize the Split up option in the Pathfinder Panel. Then with the Direct Selection Tool (A), delete all unnecessary objects.
Make sure to delete the middle shape because nosotros want to create a box that is open.
Step 3: Add Some Color
Since we are creating a cardboard box, nosotros want to add some cardboard colors. Select each shape and add together the colors of your liking. For the lighter sides of the box, I used #c19862 and for the darker shade, #6f431e.
Step four: Create an Edge for the Flaps
Select the flaps shape and make a copy of information technology underneath (Edit > Re-create and then Edit > Paste in Back). Fill the duplicated shape with a darker dark-brown (#6f431e).
Stride 5: Add the Inner Walls
Use the Pen Tool (P) to describe the inside walls of the box. Draw the paths below all the other objects to hibernate any awkward seams. Brand sure that each shape has a different chocolate-brown color so that we can distinguish each shape and make our aircraft box look three-dimensional.
Since the box will have some shadows falling into it, we need to simulate that sort of lighting with some elementary shapes.
Step five: Correcting and Enhancing the Box's Flaps
In a previous step, we made a copy of the flaps and placed information technology underneath to support the 3D shape of our box. However, the corners don't look correct. We demand to fix that.
With the Directly Option Tool (A), select the corner anchor of the bottom flap and drag it inwards and so that it's vertically aligned. Repeat this with each corner where information technology's necessary.
On the front-facing parts of the flap edge, nosotros need to add some rectangle shapes so we become the thickness of the cardboard.
Merely makes some rectangle shapes (shown in cherry) with the Pen Tool (P) and fill them with a darker brown color.
Footstep 6: Add Surface Highlights and Packing Tape
Let's give our box surface a bear upon of detail. More than specifically, we volition give the left side a highlight that will aid us keep our lighting consequent. Create a triangular shape and identify it underneath the flap, and and so fill it with a darker chocolate-brown color.
Nosotros will tweak the transparency of the triangular shape using the Transparency Panel (Shift + Cmd/Ctrl + F10). In the Transparency Panel, set the Blending Mode to Multiply and reduce the Opacity to xxx%.
Shipping boxes will usually accept tape on it to seal it up.
Let's brand a simple packing record item that goes vertically down the front of the box. Add together a rectangle as a tape strip to the front.
Step 7: Create the Box's Shadow
We volition at present bandage a shadow on the floor. Use the Pen Tool (P) to create a rectangular path at the front of the box (below where we placed the packing tape). We volition utilize the Gradient Panel (Cmd/Ctrl + F9) to fill the path with a linear blackness-to-transparent slope angled in such a style as to friction match the perspective of the box.
Detect that since our light source comes from the top left, the shadow is slightly bigger on the right.
Step viii: Add Torn Packing Record on the Flaps
Let'southward reinforce the realism of our icon by having packing tape hanging off the flap to arrive await like an opened box. Create a rectangular shape with the Pen Tool (P) that is aligned with the box'due south flap on the left. Add some extra anchor points to the end so it looks like the tape is ripped off and dangling off the flap.
Then fill the packing tape'southward path with a beige color. Make certain that you placed the shape underneath the flap; you can movement information technology down past pressing Cmd/Ctrl + [ if yous drew it on top.
Step 9: Creating a "Delicate" Stamp
For an extra added bit of detail, let's add a cerise postage stamp that says "Delicate." Often, you'll meet this in situations where the contents of a parcel are easily breakable, such equally computer parts or dishware (e.g. porcelain plates). Nosotros'll create a postage from scratch apace and easily.
I picked a font called Portago ITC TT. Whatsoever stenciled font should work well. All you want to practise is employ the Type Tool (T) to type out the text in all caps.
Prepare the color to a ruddy color. Afterwards, but utilise the Rounded Rectangle Tool with a reddish stroke to draw a border around the "Frail" text.
Then create outlines for the text (Type > Create Outlines or Shift + Cmd/Ctrl + O), select the text and the rounded rectangle, and so group them together (Object > Grouping or Cmd/Ctrl + G).
Place the "Fragile" stamp on the side of the box. Match the perspective/angle of our box past using Effect > Misconstrue & Transform > Free Distort.
Pace 10: Finishing Details
I thought the shipping box would look great on a beige groundwork, so I just created a rectangle to serve as the background beneath the box and filled it with beige (#e4d0b5).
Feel free to add together more than details to the box. For example, I added a barcode that was created using black vertical lines assault top of a beige rectangle (drawn with the Rectangle Tool).
I used the same method (Consequence > Distort & Transform > Free Distort) to match the angle and perspective of the box.
Tutorial Summary
This tutorial involved producing a 3D shipping box icon in Illustrator. We used the 3D Extrude & Bevel effect to create the base shape. We used a bully technique to depict the flaps using the Get-go Path command.
We detailed our box with things like packing tape, a red "Fragile" stamp, highlights and shadows. Below, I grouped all the shapes of the box, duplicated the group, and scaled them downwards in a variety of popular icon sizes. I hope y'all enjoyed this tutorial.
Download Source Files
- shipping_package_box (ZIP, i.07 MB)
Source: https://www.webfx.com/blog/web-design/create-a-3d-shipping-package-box-icon-in-illustrator/
0 Response to "how to draw a 3d telephone box"
Post a Comment