Create a Tasty Burger Icon in Illustrator

In this delicious tutorial I’ll show you how to create a three-dimensional, scrumptious burger using Adobe Illustrator. Remember that I’m a vegetarian, so you should definitely appreciate the effort!
Create a new document in Illustrator and set the canvas to 72×72 pixels. This icon size is used for Android launcher icons. I won’t go into the details of pixel-perfect icon creation, preventing blurry lines etc. That’s for another tutorial.
You should make a sketch every time you design anything to block out the shape and the colors and check out the perspective. I did my sketch directly in Illustrator, painting with the Blob Brush using a tablet. I cannot recommend a tablet enough so start saving today…

Zoom in until the canvas fills the screen and draw the shape for the bottom bun (1a), filling it with the proper gradient (1b).
Add some Inner Glow from the Effect menu (1c) to make the bun appear round.

Draw the inside of the bun (2a) and fill it with a lighter gradient (2b). SInce it falls out of the bottom shape we need to crop it. Duplicate the bottom shape and place it above the inside (2c). Now select both shapes and hit Cmd+7 to create a clipping mask: now the inside is cropped to the bottom (2d).
We’ll use this technique every time an object needs to be cropped to another so keep referring to this step.

The filling

The first item to add is a leaf of lettuce (3a) filled with a strong green gradient (3b).

Add the patty (4a) and select a meaty gradient, burnt to a crisp (4b).

Add a slice of tomato on top of the patty (5a) using the proper colors (5b). As you can see we don’t waste time drawing the texture of the meat or the inside of the tomato because these details won’t be visible at the final size, they’ll only add visual noise.

The fillings cast a shadow onto the bottom bun so duplicate the lettuce and make it black. Set it to Multiply and lower the Opacity to 35% (6a). Go to Effect > Blur > Gaussian Blur and choose the appropriate settings (6b).

As you can see the shadow bleeds out from the bun’s outline (7a) so we need to crop it with a clipping mask (see previous step) (7b).

Let’s also add a drop shadow below the bun, this is not a flying burger. The shadow is a black ellipse set to Multiply with an Opacity of approximately 50% and a good dose of Gaussian Blur added to it. I guess you now know how to create shadows!

Wait a minute, no cheese? Of course! Draw a squarish shape but make it droop at the corners like a good slice of semi-melted cheese does (8a). Check out the cheesy gradient (8b)! Duplicate this shape and move it up (8c). Make it lighter, modifying the color stops in the gradient (8d).

All we need to do now is draw the shadow cast by the cheese on the tomato and the filling is complete.

The top bun

Mmh, the hamburger is almost complete.
Draw the top bun much like you drew the bottom bun (9a, 9b).

Create a smaller shape to act as top highlight and set it to Screen and 85% Opacity (10a). Add some Gaussian Blur to smooth its edges (10b) then use the clipping mask method to crop it to the bun (10c).

Finishing touches

Let’s not forget the top bun casts a shadow onto the cheese so just like before add your blurry shadow (11a). Finally draw a bunch of small, light yellow ellipses on top of the bun: the unrenounceable sesame seeds (11b).