How to make 2D trees | Game UI/Art for Game Designers [Tutorial]

Welcome to the sixth tutorial of the UI/Game Art for Beginners series. In this tutorial, we will be learning how to make 2D trees in Adobe Illustrator.

BACKGROUND

1. Create a new document that is 1920 pixels wide and 1080 pixels high
2. Use the Rectangle Tool (M) and draw out a rectangle that is 1920 pixels wide and 1080 pixels high
3. Remove the border
4. Fill the rectangle with a pale gray (#f7f7f7)
5. Open the Layers Panel and rename Layer 1 as “background” and lock the layer

TREE 1

6. Create a new layer named “tree 1” above the background layer
7. Select Ellipse Tool (L) and click once on the Artboard
8. Make an ellipse that is 300 pixels wide and 300 pixels high
9. Fill the ellipse with a green color (#85aa00)
10. Make a copy of the ellipse (CTRL + C) and paste it in front (CTRL + F)
11. Use the Rectangle Tool (M) and place a rectangle over the left-half of the ellipse
12. Select both the rectangle and the ellipse
13. Open the Pathfinder Tool and select “Minus Front” (second icon under Shape Modes)
14. Change the right-side of the ellipse color to a darker green (#6b8400)
15. Select all the ellipses and group them together (Object > Group)
16. Select the Rectangle Tool (M) and click on the Artboard
17. Make a rectangle 50 pixels wide and 500 pixels high
18. Fill the rectangle with a brown color (#a87000)
19. Make a copy of the rectangle (CTRL + C) and paste it in front (CTRL + F)
20. Use the Rectangle Tool (M) and make a rectangle and place it over the left-side of the rectangle
21. Select both rectangles
22. Open the Pathfinder Tool and select “Minus Front” (second icon under Shape Modes)
23. Change the right-side of the ellipse color to a darker brown (#7a4e00)
24. Select all the rectangles and group them together (Object > Group)
25. Align the with the ellipses
26. Place them behind the ellipses (Right-Click > Arrange > Send Backward)
27. Lock the tree 1 layer

TREE 2

28. Create a new layer named “tree 2” above the tree 1 layer
29. Select Ellipse Tool (L) and click once on the Artboard
30. Make an ellipse that is 300 pixels wide and 300 pixels high
31. Fill the ellipse with a green color (#85aa00)
32. Select the Anchor Point Tool (SHIFT + C) and click on the top anchor point
33. Use the Direct Selection Tool (A) and select the top anchor
34. Use the SHIFT key and up-arrow to move the anchor point up 100 pixels
35. Use the Direct Select Tool (V) and make a copy of the ellipse (CTRL + C) and paste it in front (CTRL + F)
36. Use the Rectangle Tool (M) and place a rectangle over the left-half of the ellipse
37. Select both the rectangle and the ellipse
38. Open the Pathfinder Tool and select “Minus Front” (second icon under Shape Modes)
39. Change the right-side of the ellipse color to a darker green (#6b8400)
40. Select all the ellipses and group them together (Object > Group)
41. Use the Rectangle Tool (M) and make a rectangle 50 pixels wide and 250 pixels high
42. Fill the rectangle with a brown color (#a87000)
43. Make a copy of the rectangle (CTRL + C) and paste it in front (CTRL + F)
44. Make a rectangle and place it over the left-side of the rectangle
45. Select both rectangles
46. Open the Pathfinder Tool and select “Minus Front” (second icon under Shape Modes)
47. Change the right-side of the ellipse color to a darker brown (#7a4e00)
48. Select all the rectangles and group them together (Object > Group)
49. Align the with the ellipses
50. Place them behind the ellipses (Right-Click > Arrange > Send Backward)
51. Lock the tree 2 layer

TREE 3

52. Create a new layer named “tree 3” above the tree 2 layer
53. Select Ellipse Tool (L) and click once on the Artboard
54. Make an ellipse that is 500 pixels wide and 500 pixels high
55. Fill the ellipse with a green color (#85aa00)
56. Select the Rounded Rectangle Tool and click on the Artboard

Width: 72 pixels

Height: 540 pixels

Corner Radius: 180 pixels

57. Align the rounded rectangle to the horizontal and vertical center of the ellipse
58. Select the Rotate Tool (R) and holding down the ALT key click on the center of the rounded ellipse
59. Change the Angle to 10^o and select Copy
60. Duplicate the rounded rectangle (CTRL + D) until the entire ellipse is covered
61. Select all the sections of the tree
62. Open the Pathfinder tool and choose Unite (first icon under Shape Modes)
63. Make a copy of the ellipse (CTRL + C) and paste it in front (CTRL + F)
64. Use the Rectangle Tool (M) and place a rectangle over the left-half of the ellipse
65. Select both the rectangle and the ellipse
66. Open the Pathfinder Tool and select “Minus Front” (second icon under Shape Modes)
67. Change the right-side of the ellipse color to a darker green (#6b8400)
68. Select all the ellipses and group them together (Object > Group)
69. Use the Rectangle Tool (M) and make a rectangle 75 pixels wide and 250 pixels high
70. Fill the rectangle with a brown color (#a87000)
71. Make a copy of the rectangle (CTRL + C) and paste it in front (CTRL + F)
72. Make a rectangle and place it over the left-side of the rectangle
73. Select both rectangles
74. Open the Pathfinder Tool and select “Minus Front” (second icon under Shape Modes)
75. Change the right-side of the ellipse color to a darker brown (#7a4e00)
76. Select all the rectangles and group them together (Object > Group)
77. Align the with the ellipses
78. Place them behind the ellipses (Right-Click > Arrange > Send Backward)
79. Lock the tree 3 layer

TREE 4

80. Create a new layer named “tree 4” above the tree 3 layer
81. Select Star and click once on the Artboard

Radius 1: 300 pixels

Radius 2: 150 pixels

Points: 3

82. Fill the triangle with a green color (#85aa00)
83. Make a copy of the triangle (CTRL + C) and paste it in front (CTRL + F)
84. Use the SHIFT and up-arrow key move the copied triangle up (place it about 75% of the way up the original triangle)
85. Resize the triangle to 360 pixels wide and 311.769 pixels high
86. Make a copy of the triangle (CTRL + C) and paste it in front (CTRL + F)
87. Use the SHIFT and up-arrow key move the copied triangle up (place it about 75% of the way up the middle triangle)
88. Resize the triangle to 250 pixels wide and 216.506 pixels high
89. Select all three triangles
90. Open the Pathfinder tool and choose Unite (first icon under Shape Modes
91. Make a copy of the triangles (CTRL + C) and paste it in front (CTRL + F)
92. Use the Rectangle Tool (M) and place a rectangle over the left-half of the triangle
93. Select both the rectangle and the triangle
94. Open the Pathfinder Tool and select “Minus Front” (second icon under Shape Modes)
95. Change the right-side of the ellipse color to a darker green (#6b8400)
96. Select all the triangles and group them together (Object > Group)
97. Use the Rectangle Tool (M) and make a rectangle 75 pixels wide and 150 pixels high
98. Fill the rectangle with a brown color (#a87000)
99. Make a copy of the rectangle (CTRL + C) and paste it in front (CTRL + F)
100. Make a rectangle and place it over the left-side of the rectangle
101. Select both rectangles
102. Open the Pathfinder Tool and select “Minus Front” (second icon under Shape Modes)
103. Change the right-side of the ellipse color to a darker brown (#7a4e00)
104. Select all the rectangles and group them together (Object > Group)
     105. Align the with the ellipses