Skip to main content

How to Create Car and Van Emojis Using Adobe Photoshop

Final product image

An emoji is a specific type of pictorial icon. In this tutorial, we will draw a set of car and van emojis in Photoshop using its amazing vector feature. We will start by drawing a standard van and car and then turn them into other cars, such as an ambulance, firetruck, taxi, and police car. I hope you like it.

For inspiration, check out Envato Market for emoticons and icons
It is always a good idea to put every element inside a separate layer group. Each car and its elements (bumpers, tires, etc.) should be placed inside a specific group layer and given an appropriate name. I also suggest that you start some research on car icon design. By seeing other icon designers' work, you will learn which element is essential in the design. 
Organize your layers into group layer
Start by creating a new document in Photoshop. Hit Control-N or click File > New. We don't need a big canvas. Set its size to 320 pixels x 140 pixels. ClickOK.
New file dialog box
Click the Add Adjustment Layer icon and then select Solid Color. Select a dark gray color for the canvas background. After this, you can simply delete the Background layer to decrease the file size.
Add background layer
Select dark gray color
Click Arrange > New Window for [file name]. The same file is opened in a separate window. Both are the same. You can edit in one of the windows and the changes will appear in the other one at the same time. We'll use this to help us see the real result, in 100% magnification, and at the same time working with the details. 
Drag one of the tabs to detach it from the main workspace. Set its zoom level to 100%. Set the other window at a larger zoom level.
Make  two Windows for the same file
We start by drawing the basic van shape. Activate the Rounded Rectangle Tool, and then click and drag to draw a white 14 px × 18 px shape. From theProperties panel, set the top left corner radius to 10 px.
Draw a simple rounded rectangle for the vans head
Apply Inner Shadow and Inner Glow layer styles to the layer to add shadow and a bit of depth. Use the following settings.
Apply Inner Shadow
Apply Inner Glow
We want to keep each layer organized. Get yourself used to naming every layer with a sensible name.
Add suitable name to every layer
Duplicate the vector shape of the van's cab by hitting Control-J, and then pull its lower and right side to turn it into a windshield.
Draw the vans windshield
Modify its points
Add the following Layer Styles to add blue lighting to the shape. In the Inner Glow dialog box, use blue.
Apply Inner Shadow
Apply Inner Glow
Draw a 2 px width white rectangle on the lower part of the van. Add Inner Shadow and Gradient Overlay layer styles to add simple lighting to the shape. This shape is going to be the van's bumper and base.
Draw a rectangle for its bumper
Apply Inner Shadow
Apply Gradient Overlay
Draw a rounded rectangle with a radius of 2 pixels on each corner. Here, we are using yellow for its color. You may have a different favorite color. To add lighting to the shape, we simply add Inner Shadow and Gradient Overlay layer styles. Play around with the Angles settings until you get a satisfying result.
Draw the box behind the vans head
Apply Inner Shadow
Apply Gradient Overlay
Vans box
The next step is adding the wheels. Of course, we just need to add a simple circle shape by Shift-dragging using the Circle Shape Tool. From the Option Bar, set its Fill color to white and its Stroke color to dark gray with a size of 1 pt. The diameter of the wheel should be even, such as 8 px, 12 px, or 16 px. This will make the next steps easier. Apply Stroke and Inner Glow layer styles to add simple lighting to the wheel.
Draw the wheel
Apply Stroke
Apply Inner Shadow
We will use two sets of wheels, front and rear. Because both are the same, it's a good idea to use a Smart Object. Right-click the wheel layer and chooseConvert to Smart Object. Next, Alt-drag to duplicate the wheel.
Convert wheel to smart object
Duplicate the wheel
We are going to add a small gap, 1 px width, between the wheel and the van's body. Create another dark circle shape, with diameter 2 pixels bigger than the wheel. Place it behind the wheel. Add a rectangle covering half of the wheel under the car's bumper and set its path mode to Subtract Front Shape. Add black Stroke and Gradient Overlay.
Draw empty area behind the wheel
Apply Stroke
Apply Gradient Overlay
Add the same shape behind the other wheel.
The result
We're almost done. The last step is adding the shadow. We can easily paint shadow under the van using the Brush Tool. But the downside is that the result will be in pixels, and images based on pixels tend to blur uncontrollably when they are resized. You really don't want that to happen in a small image such as this. 
Our approach is to draw a dark rounded rectangle underneath the van and then fill it with Inner Shadow and dark Outer Glow layer styles.
Draw a rounded rectangle underneath the van
Apply Inner Shadow
Apply Outer Glow
There you go, complete with shadow.
Van with shadow
I guess we have just missed one small detail: the rearview mirror. All we need to do is draw a triangle and a square. That's it. We now have the basic shape of a van emoji. You can stop at this point or continue adding small ornaments to make it unique.
Draw rear view mirror
The complete van with rear view mirror
Starting from here, the following steps are optional. Draw a 1 pixel tall rectangle shape on the box. Shift-drag to add another shape to the box. For its color, set it to lighter yellow.
Draw rectangle
Draw more rectangles
Add Inner Shadow and Drop Shadow layer styles to add depth to the box surface.
Apply Inner Shadow
Apply Drop Shadow
The vans appearance
Let's add a company name on the box. Draw a white rectangle using the Rectangular Marquee Tool.
Draw a rectangle
Add text inside the white area. While the text layer is active, change the anti-aliasing method of the text and pick the clearest appearance, Usually, for small text, Crisp works best.
Add text on the box surface
We've finished the standard van. By adding slight modifications, such as changing color, we can create other types of van. 
In this tutorial, we will make an ambulance. First, we need a reference to see the common characteristics of an ambulance. You can find them onPhotoDune. Just search for ambulance or ambulance car. From these photos, I notice three common elements of an ambulance: sirens, a cross sign, and red and white color.
Search for ambulance photo references
This ambulance is made from the previous van. So, Alt-drag to duplicate it.
Duplicate basic van emoji
We don't need the stripe detail and text on the box. We can remove it.
Remove uneeded elements
Change all the color to white.
Change vans color to white
Add a new red rectangle using the Rectangle Tool. Draw a red cross sign made from two overlapping rectangle shapes. The path mode should be Combine Shapes. Add Inner Shadow and Drop Shadow layer styles to add depth to the red shape.
Add red rectangle and red cross shape
Apply Inner Shadow
Apply Drop Shadow
Draw a rounded rectangle on top of the ambulance cab. Add a radius to its top left and top right corner until we have a half rounded rectangle for the siren's shape.
Add sirens on top of the ambulance
For its color, add a layer style Gradient Overlay with linear gradient from red to blue.
Apply Gradient Overlay
Use gradient from red to blue
Add Inner Shadow and Outer Glow to add subtle light to the sirens.
Apply Inner Shadow
Apply Outer Glow
And here they are: a basic van and ambulance.
We have finished drawing the ambulance
For the car, we start by drawing a simple rounded rectangle. Add the upper part of the car by drawing it manually using the Pen Tool.
Draw car basic shape
Add Inner Shadow and Gradient Overlay layer styles to add simple lighting and three-dimensional perception to the shape. 
Apply Inner Shadow
Apply Gradient Overlay
Car basic shape
Duplicate the car's lower body and change its color to black. Add a rectangle and set its path mode to Intersect Shape Areas.
Draw cars bumper
Add wheels to the car. We can simply copy and paste the wheel we made earlier for the van.
Duplicate wheels from the van and put them on the car
Let's add a windshield to the car. The process is similar to what we did earlier to the van. Draw a polygonal shape using the Pen Tool and then apply layer styles Inner ShadowInner Glow, and Outer Glow to add blue highlight to the glass.
Draw windshield
Apply Inner Shadow
Apply Inner Glow
Apply Outer Glow
The result
Just like we did with the van, there's no need to draw a door. But we need to add a small 1 pixel line to separate the front and rear door. Draw a 1 pixel width white rectangle between the two windshields. Apply a slight drop shadow.
Draw a 1 pixel line
Apply Drop ShadowA
We have an inset line dividing the door
Reduce its layer Opacity to 10%.
Reduce lines opacity to 10 percent
Duplicate the car's main body. Change its color to white. Add a rounded rectangle on the front of the shape and set its mode to Intersect Shape Areas. This is going to be the car's headlight.
Draw cars head light
Repeat the same for the taillight. Use red for this one.
Draw cars tail light
Draw a dark rounded rectangle shape underneath the car and apply layer stylesInner Shadow and Outer Glow to turn it into the car's shadow.
Add rounded rectangle shape underneath the car for its shadow
Apply Inner Shadow
Apply Outer Glow
We have done with the basic car. We can add certain elements to turn it into a specific car, such as a police car. What elements are essential for a police car? Search police car photos for reference from PhotoDune. We can see that there are three essential elements in common: its black and white color, sirens, and police text on the door.
Search for photo references of a police car
Let's duplicate the standard car. Change its main color to black. Apply anotherGradient Overlay layer style by clicking on the plus icon next to the already available Gradient Overlay. So we use two Gradient Overlays, one for the highlight on the car's body and another one for its color. Set this new Gradient Overlay layer style from white to black with Style: Reflected.
Apply another Gradient Overlay
Change its color to black and white
Add text on the side of the car. Experiment with the anti-aliased option to achieve clear visibility of the text.
Add text on the door
Add a rounded rectangle for the siren and apply Gradient Overlay. We have drawn this before for the ambulance. You can just simply duplicate it. Depending on the country's law, the color for ambulance and police sirens might different. Check your country's emergency light color in Wikipedia.
Add sirens from the ambulance
Change its color from the Gradient Overlay option
We have finished drawing the emojis. They are all made from vector shapes, without manual pixel brushing. As you can see, they are both just a variation of the basic van and car. If you add other elements, you can modify them into a firetruck and taxi too. Try them yourself. Good luck!
Ambulance is a variation of van and police car is a variation of car
Try to draw a firetruck and a taxi

Comments

You may also want to read these ⤵️

Referee kills player in a football match

A referee is facing murder charges after football players allegedly forced him to

Do not watch this while driving

Kids are lovely and fun to watch most times. I know most of you did this and so many other funny stuffs as a kid. Feel free to share yours... Do not watch this while driving

Over 40 Million Accounts Found Guilty

Microsoft has uncovered 44 million user accounts using usernames and passwords that have been leaked through security breaches.

RAW TALENT ep1 (freestyle by Gdlpeid)

Just watch! Freestyle by ''Gdlpeeid''. A rapper with a difference.  Pure raw talent.

These 10 Powerful Words And Phrases Defined The Decade

Honestly, it has been a wonderful decade to remember.  A lot has happened and a lot has been spoken also. But our focus is on the words and phrases spoken.  Below are words and phrases spoken between 2010 - 2019 that defined the decade.....

By February 2020 - WhatsApp Will Stop Working on These Phones

Every now and then, WhatsApp does fish out a list of old phones for which support is discontinued and if you have an old phone lying around as a backup, you might want to read on.

Apple Has Released iOS 13.2.2 And Fixes Major Issue

All thanks to Apple,  the tech  giant just released iOS 13.2.2, which addresses the issue of background apps being killed prematurely, along with a handful of other annoyances.

This Magnetic thread Can Be Used To Clear Blood Clot in The Brain

Link from mashable.com  Researchers at MIT developed a thread that can be steered magnetically to glide through the brain's blood vessels and

This gigantic monster device turns wave energy into electricity

This 826-ton buoy was developed by OceanEnergy to turn wave energy into electricity. IEEE Spectrum reported that "OE Buoy" was towed from Oregon to Hawaii, where it will undergo a series of tests that will prove whether it can withstand the battering waves while generating electricity. Click the link below to watch the video..

Lionel Messi Barcelona exit date revealed

The Barcelona Legend has decided on when he wants to quit the club and even has a successor in his mind already.