Note: This tutorial is an English translation tutorial, and the software is not skilled in operation, so try it carefully. If there are any deficiencies in the translation or typos, make up for it yourself.
1. Create a new document
File > "New" to open a blank document, as set in the figure.
2. Create the bottom of the icon
Grab the Rectangle Tool (M) and draw a 256 x 256 pixel square. Select a black stroke for now, then go to Effects> Stylize> Rounded Corners and apply a 25px radius. To expand this effect, go to Object > Extend Appearance and ungroup (Shift + Ctrl + G).
3. Create a sand texture
Step 1
Fill the base shape with the indicated color, and then look at the Appearance panel. Once this fill property is selected, press the Duplicate Selected Item icon at the bottom of the panel. As a result, you will get a second fill above. Replace the color with a pattern called "USGS 17A Quicksand" that can be found in the Swatch library > modes> basic graphics > basic Graphics_Textures. Change the blending mode of this mode to Soft Light.
Step 2
Now, copy the second fill attribute as you did in the previous step. Replace the existing mode with "Stipple Fine", which you can find in the "Basic Graphics_Textures" category. Set the blending mode to Color Dodge.
Step 3
Duplicate the first fill attribute and replace the nude color with brown. Drag this property to the bottom of the panel, then go to Effects> Distort & Warp, > Warp and apply the settings shown below. You will get a brown edge in the upper right corner of the base.
Step 4
Copy and paste (Ctrl + F) in front of the base shape and delete all existing appearances. Select Brown as the fill color, then go to Effects> Art> Film Grain, and apply the settings that appear. Set to Blend Mode Overlay.
Step 5
We're still using the shape from the previous step. Select a 1pt white stroke and set it to Blending Mode Soft Light.
Step 6
Now, go to the Appearance panel and select Add New Fill from the pop-up menu. Use the linear gradient shown and set the angle to -90 degrees. Move this fill attribute between the first fill and the stroke, then set the Blending Mode to Color Burn and reduce the Opacity to 50%.
4. Add details to the sand bottom
Step 1
Now, let's improve the look of the beach and make it more realistic. To do this, we will use some of the art brushes available in Illustrator and take them down one by one in their order.
Grasp the Pen Tool (P) and draw a path in the bottom left corner of the base as shown below. Give it a 2pt brown stroke (1). Also, use an art brush called "Dry Ink 2" to find the path in the brush library >Artistic> Artistic_Ink (2). Still selecting this path, go to Effects> Blur, > Radial Blur, and apply the settings shown in the next image (3). Set the blending mode to Overlay and reduce the opacity to 40% (4).
Choose the Spin method in the radial blur window, good quality and quantity of 20.
Step 2
Use the Pen Tool (P) to draw a second path and draw a 1pt brown stroke (1) for it. This time with an art brush called "Chalk", you can find it in the "Brush Library" > "Artistic" > "Artistic_ChalkCharcoalPencil". Double-click the applied brushstroke in the Appearance panel to open the Stroke Options window, select the Flip Along Object option, and then click OK (2). Use the same settings (3) to apply the Radial Blur effect again, and then set it to Color Burn (4).
Step 3
Let's move on to the third path and give it 2pt brown strokes (1). Stroke it again with the Chalk art brush (2), then go to Effects> Blur, > Radial Blur and apply the settings shown in the next image (3). Set to blend mode overlay and reduce opacity to 40% (4).
Choose the zoom method in the radial blur window, good quality and quantity of 20.
Step 4
Grab the Pen Tool (P) and draw another wavy path as shown below. Give it a 2pt brown stroke (1) and use the Chalk Art Brush again to brush it (2). Apply the Radial Blur effect using the settings shown above, then set it to Color Burn and reduce the opacity to 40% (3).
Step 5
Draw the next path in the bottom left corner of the base and select a 1pt brown stroke (1). This time, use the "Dry Ink 2" art brush to stroke it (2). Use the settings shown at the beginning of this step (4.1) to apply the Radial Blur effect, and then set it to Color Burn (4).
Step 6
You haven't done it yet. Take the Pen Tool (P) and draw the next path, then select a 2pt brown stroke (1). Use the Chalk art brush to stroke it (2), then apply the Radial Blur effect (Setting-4.1). Set to blend mode color darkening and reduce the opacity of this path to 75% (3).
Step 7
Draw another path in the upper left corner of the base and draw a 2pt brown stroke for it. Use the Dry Ink 2 art brush to stroke it (2), then apply the Radial Blur effect (Setting-4.1). Set to blend mode, color burn (4).
Step 8
Finally, draw the last path in the top right corner and draw a 1pt brown stroke (1) for it. Use the Chalk art brush to stroke it (2), then apply the Radial Blur effect (Setting-4.1). Set it to Blending Mode Overlay(4) to complete this section.
5. Clean up the edges of the icon
Step 1
We want the edges of the icon to be clean, so we need a mask. First, copy and paste (Control+F) in front of the base shape, then delete all existing appearances (no strokes, no fills). Put this copy on top of everything by going to Objects> Arrange > Bring to Front. With this copy selected, along with the eight stroke paths, go to Object> Clipping Mask, > Make (Control + 7).
Step 2
At this point, the bottom of the icon should look like this:
6. Add a highlight to the icon
Step 1
Copy and paste (Ctrl + F) in the base shape again and delete all existing appearances. Place it in front of everything by going to Objects> "Arrange" > "Bring to Front", and make 1pt strokes on it with any color (1). Using the Add Anchor Point tool (+), add two additional points on the left and right edges (2). Next, grasp the scissors tool (C) and click on the four points indicated to cut the path into segments (3). Delete the unwanted paths and keep only the two paths shown below (4).
Step 2
Use the Blended Art Brush to get two paths in the previous step, and I've explained how to create that in my Neon Art Brush tutorial. It's just that it's not 200 x 5px, it's 100 x 3px in size. Set the Pen Weight to 0.75 pt, and then reduce the Opacity to 75%.
7. Add a shadow below the icon
Grab the Ellipse Tool (L) and draw an ellipse with the dimensions shown. Move the shape to the bottom of the icon and send it to the back of everything by going to Objects> Arrange > Send Back. Select Black as the fill color, then go to Effects> Blur, > Gaussian Blur and apply 10 radius.
8. Draw the shape of the flip flops
Step 1
Use the Ellipse Tool (L) to draw an ellipse with the dimensions shown. Use the Direct Selection tool (A) to select only the top and bottom points, and then drag their handles to make them longer. Next, select two points from the middle of the shape and drag the handles to modify their position as shown in the image.
Step 2
Grab the Add Anchor Point Tool (+) and use it to add two extra points at the bottom of the sole shape and adjust the handle if needed. Next, use the Direct Selection Tool (A) to select the highest point, and then modify the position of the handles as shown below. Use the Add Anchor Point tool (+) to add two other points at the top and move the handles as shown below.
9. Draw the straps of the slippers
Step 1
Take the Pen Tool (P) and draw the following two paths, then stroke it with the Cone Tip art brush, which you can find in the Brush Library> Artistic> Artistic_Ink. Set the weight to 0.3pt. From Object> Unwrap Appearance, then ungroup (Shift+Ctrl+G) twice, and you'll get the belt shape.
Step 2
Select the left strap and go to Object> Paths> Add Anchor Point, then select the right strap and go to Object> Paths> Add Anchor Points twice. You will get some extra points on each shape. Now, use the Direct Selection tool (A) to select only the two points highlighted in green and move them a little to the left. Next, select the three dots highlighted in blue and move them to the right.
Step 3
Use the Direct Selection tool (A) to select only the points highlighted in green and move them down a bit, then do the same for the four points highlighted in blue.
Step 4
Grab the Direct Selection tool (A) and drag a selection as shown below to select only the points in the area and move it down a little. Finally, move the two points from the top to the other and prepare the belt.
Step 5
Use the Pen Tool (P) to draw the shape from below, as the inside of the belt.
10. Create a construction pattern on the sole
Step 1
Now that we have the basic shape of flip-flops, we need to put it into practice. Hide the strap for a while and focus on the sole. Select the shade of pink indicated as the fill color. Next, use the Pen Tool (P) or even the Pencil Tool (N) to draw some random wavy paths on the sole.
Step 2
Copy and paste to the front of the sole shape (Ctrl + F), then go to Object > Arrange > Bring to Front to place it in front of everything. Group (control + G) for all wavy paths, then select the copy of the sole and group and press the chasm in the Pathfinder panel. Ungroup (Shift+Ctrl+G) and remove larger shapes from the top and bottom. Fill in the stripes with the indicated color.
Step 3
Copy and paste to the front of the sole shape again (Ctrl + F) and place it on the front. Fill it with a linear gradient shown in black and gray (40% black) and set the angle to 90 degrees. Change the blending mode to Overlay and reduce the opacity to 20%.
Step 4
Next, use the Pen Tool (P) and draw a segmented vortex as shown. When the sun's rays draw a short circuit around it. Select a 1pt light gray stroke for all paths and press the Round Cap option in the Strokes panel.
11. Color the flip-flop straps
Step 1
Start by unfastening the belt. Fill the belt on the right with the indicated pink. Go to the Appearance panel and select this fill property, then press the Copy Selected Items icon at the bottom. As a result, you will get a second fill above. Use a linear gradient from white to black, then set it to "Blend Mode Overlay" and reduce the opacity to 20%. Repeat the same for the left belt.
Step 2
Now select the left inner strap and fill it with dark pink. Duplicate this fill property as before, this time using a radial gradient from white to black. Set it to "Blend Mode Multiplication" and reduce the opacity to 20%. Repeat the same for the right inner band.
Step 3
Copy and paste in the left strap (Ctrl + B) and delete the existing look and choose bright pink as the fill color. Use only the Direct Selection Tool (A) to select the two points indicated behind the shape, and then move them 1px to the left by pressing the left arrow key on your keyboard once.
Next, copy and paste on the back on the right strap (Control + B) and change the fill color. Use the Direct Selection Tool (A) to select only the four points indicated and move them 1px to the left to reveal some pink shapes on the back.
Step 4
Copy and paste the inner strap on the right (Ctrl + B), delete the existing look, and select the shade of pink indicated as the fill color. Use the Direct Selection tool (A) to select only the two highlighted points, then move them up by 1px by pressing the Up Arrow key on your keyboard once.
Next, copy and paste on the back of the left inner strap (Ctrl + B) and change the fill color. This time, move the entire inner belt (not the copy) to the right by pressing the right arrow key once.
12. Create a toe bar
Step 1
Grasp the Ellipse Tool (L) and draw two small circles with the dimensions shown. Arrange them as below and fill them with the radial gradient shown.
Step 2
Now, as shown, use the Pen Tool (P) to draw a path between the hole and the belt. Set the Stroke Weight to 4.5pt and press the Round Cap option in the Stroke panel. From Object> Expand and Ungroup, and then fill the resulting shape with dark pink. Move your toes to the back of the belt.
Step 3
Copy and paste in front of the toe bar (Ctrl+F) and scale it a bit. Replace the fill color with the gradient shown, then set it to "Blend Mode" and reduce the opacity to 75%.
Step 4
Draw two ellipses using the Ellipse Tool (L) at the bottom of the inner belt and fill them with the colors indicated.
13. Add a highlight to the belt
Step 1
Grasp the Pen Tool (P) and draw two paths along the edge of the belt as shown in the image below. Use the Blend Art Brush strokes you used earlier to stroke these paths, then set the weight to 0.25pt and the Blend Mode to Override.
Step 2
Draw the other two paths along the edge of the belt and stroke them using the same Blend Art Brush. Set the weight to 0.25pt and reduce the opacity to 75%.
14. Create a glossy look
Step 1
As shown, draw a rectangle with the Rectangle Tool (M) and on the right belt. Fill it with the linear gradient shown, then set it to "Blend Mode" to lighten and reduce the opacity to 60%.
Step 2
Draw a smaller rectangle at the top, then choose white as the fill color. Set it to Blend Mode Overlay and reduce the opacity to 50%.
Step 3
Copy and paste the right strap on the front (Ctrl+F) and remove all existing appearances. Place it in front of everything by going to Objects> Arrange > Bring Front. Now, select the two copies of the rectangle and the belt, and go to Object> Clipping Mask, > Make.
Step 4
A similar situation occurs on the left side. First, draw a rectangle and fill it with the same gradient. Adjust the angle, then set it to "Blend Mode" to lighten and reduce the opacity to 40%. Duplicate the left strap and pull it to the front as before. Now, select the rectangle as well as a copy of the belt, and go to Object> Clipping Mask, > Make.
15. Add shadows
Step 1
Select the two shapes behind the inner strap and copy and paste them into the back (Ctrl + B). Give them a black fill, then go into the effect > blur > Gaussian blur and apply a 4px radius.
Step 2
We don't want to see blur in some areas, so we'll fix this with a mask. First, copy and paste on the front of the sole shape (Ctrl + F) and delete all existing looks. Select the two shapes with the blurring applied, as well as a copy of the sole (which should be in front of them), and go to Object> Clipping Mask, > Make.
Step 3
Copy and paste the left strap (Ctrl + B), fill it in black, and move it to the right. Use the Pen Tool (P) to draw the other two shapes we need, one behind the left inner strap and the other behind the toe bar.
Step 4
Create another copy of the sole (no strokes, no filling) and then group the second and third black shapes (Ctrl + G). Select the copy of the group and the sole, and then press Intersect in the Pathfinder panel. You'll get a compound path, but go to Object > Compound Path, and then select Publish. You should now have three shapes that you can use to create shadows for the inner belt, the left belt, and the toe bar.
Step 5
Fill the three shapes with the linear gradient shown and adjust the angle according to the position of each shape. Set them to "Blend Mode Multiplication" (white becomes transparent) and reduce the opacity to 35%.
16. Create slipper soles
Step 1
Copy and paste the sole shape (insole) to the back (Ctrl + B) and fill it with the indicated color. Move this shape slightly down and to the right as shown in the image. This will be the outsole.
Step 2
Copy and paste on the back of the insole again (Ctrl + B). Select a 0.5pt white stroke, remove the existing fill color, and set Opacity to 75%. Move this shape slightly to the bottom right until it's in the middle of the sole. Next, copy and paste on the front (Ctrl + F), set the outsole to "none" and the strokes to "none". Select a copy of the white path and outsole, and then go to Object > Clipping Mask > Make.
17. Combination icons
Step 1
The flip flops are now ready and you can create a pair of it. The first group (Ctrl + G) makes up all the shapes of the right flip-flops, then go to Object> Transform> Reflection. Check "Vertical" and then tap "Copy" and you will get the left flip flops. Lay out the beach flip-flops above the base you created to compose the icon.
Step 2
Choose the right outsole and go to Effects> Stylize > Shadows. Apply the settings that appear, and then click OK. Use the left outsole to do the same for another flip-flop
Step 3
At this point, the beach icon is ready. You can create additional sizes if you want, but first make sure to expand the effect of each brush and applied.
18. Experiment with different designs and combinations
Step 1
You can use a copy of your flip flops to create various types of beach flip flops. First change the color of the insole and outsole For this insole design, I used a lot of colored circles, and then used a copy of the sole for masking. Also, use the indicated shade of green to recolor the strap and toe bar. If you need more information, you can use the reference illustration file.
Step 2
Once you've done the right flip-flop operation, do the reflection as before. This time, I moved the outsole of the flip-flop on the left to the right to change the look. Finally, apply the Shadow effect.
Step 3
Here's another example. The colors I use are listed below, but, of course, you are free to use any color you want. When designing, I used a footprint consisting of rectangles and ovals.
Step 4
Now you can use any beach slippers to make up a new icon:
That's it!