PERANCANGAN ANIMASI SEDERHANA MENGGUANAKAN PROCESSING BERBASIS GRAFIK

Pada tutorial ini menggambarkan akan kondisi jalan raya dan keadaan cuaca.

pembuatan animasi pada tahap Berikutnya anda dapat mengakses link berikut ini :

https://Endrikomandalaputra.blogspot.com

Berikut langkah membuat animasi menggunakan Processing 3.4 dan untuk langkah selanjutnya ketik atau copy-kan script dibawah ini.

1. float x, y, z;
2. float size = 80;
4.   void setup()
5.   {
6.    size(900,500);
7.      frameRate(100);
8.   }
11.   void draw()
12.   {
13.      background(25,25,112);
14.   int d;
15.   d=second();
17. noStroke();
18. //matahari
19. fill(500,400,0);
20. ellipse(75,70,100,100);
21. //jalan
22. fill(#0A0A0A);
23. rect(0,420,900,900);
24. fill(#FAFAFA);
25. rect(10,450,20,5);
26. rect(60,450,20,5);
27. rect(110,450,20,5);
28. rect(160,450,20,5);
29. rect(210,450,20,5);
30. rect(260,450,20,5);
31. rect(310,450,20,5);
32. rect(360,450,20,5);
33. rect(410,450,20,5);
34. rect(460,450,20,5);
35. rect(510,450,20,5);
36. rect(560,450,20,5);
37. rect(610,450,20,5);
38. rect(660,450,20,5);
39. rect(710,450,20,5);
40. rect(760,450,20,5);
41. rect(810,450,20,5);
42. rect(860,450,20,5);
43. //gunung
44. fill(0,100,0);
45. arc(350,450,800,550,(180*PI)/180,(0*PI)/180);
46. arc(750,450,750,450,(180*PI)/180,(0*PI)/180);
47. //gedung
48. noStroke();
50. fill(#9395AF);
52. rect(135,200,200,220);
53. rect(95,160,80,240);
54. rect(0,200,120,200);
55. rect(670,205,90,210);
56. rect(750,210,100,230);
57. rect(800,160,100,250);
59. //Jendela
60. fill(#FFFFFF);
61. rect(19,250,20,40);
62. rect(59,250,20,40);
64. rect(105,200,20,40);
65. rect(145,200,20,40);
67. rect(105,300,20,40);
68. rect(145,300,20,40);
70. rect(240,250,20,40);
71. rect(280,250,20,40);
73. rect(240,350,20,40);
74. rect(280,350,20,40);
76. rect(680,350,20,40);
77. rect(730,350,20,40);
79. rect(680,250,20,40);
80. rect(730,250,20,40);
82. rect(790,250,20,40);
83. rect(820,250,20,40);
85. rect(790,350,20,40);
86. rect(820,350,20,40);
88. rect(870,250,20,40);
89. rect(870,350,20,40);
90.   //Jalan
91. fill(#0A0A0A);
92. rect(0,400,900,900);
93. fill(#FAFAFA);
94. rect(10,450,20,5);
95. rect(60,450,20,5);
96. rect(110,450,20,5);
97. rect(160,450,20,5);
98. rect(210,450,20,5);
99. rect(260,450,20,5);
100. rect(310,450,20,5);
101. rect(360,450,20,5);
102. rect(410,450,20,5);
103. rect(460,450,20,5);
104. rect(510,450,20,5);
105. rect(560,450,20,5);
106. rect(610,450,20,5);
107. rect(660,450,20,5);
108. rect(710,450,20,5);
109. rect(760,450,20,5);
110. rect(810,450,20,5);
111. rect(860,450,20,5);
112. //efek salju
113. fill(145);
114. arc(340,225,440,100,(180*PI)/180,(0*PI)/180);
115. arc(770,260,400,85,(180*PI)/180,(0*PI)/180);
116. ellipse(200,245,200,100);
117. ellipse(375,245,200,130);
118. ellipse(500,250,200,100);
119. ellipse(680,270,200,100);
120. ellipse(800,270,150,110);
121. ellipse(900,270,150,70);
122. //Rumah
123. fill(255,0,255);
124. triangle(120,350,90,375,150,375);
125. fill(20,100,200);
126. rect(90,375,60,30);
127. fill(0,100,0);
128. arc(120,405,30,50,(180*PI)/180,(0*PI)/180);
130. //
131. fill(0);
132. triangle(80,375,50,400,110,400);
133. fill(255);
134. rect(50,400,60,30);
135. fill(100);
136. arc(80,430,30,50,(180*PI)/180,(0*PI)/180);
137. //
138. fill(200,100,0);
139. triangle(160,375,130,400,190,400);
140. fill(200,0,0);
141. rect(130,400,60,30);
142. fill(0,200,200);
143. arc(160,430,30,50,(180*PI)/180,(0*PI)/180);
144. //
145. fill(100,100,100);
146. triangle(200,325,170,350,230,350);
147. fill(255,255,0);
148. rect(170,350,60,30);
149. fill(255,70,70);
150. arc(200,380,30,50,(180*PI)/180,(0*PI)/180);
152. fill(100,100,100);
153. triangle(200,325,170,350,230,350);
154. fill(255,255,0);
155. rect(170,350,60,30);
156. fill(255,70,70);
157. arc(200,380,30,50,(180*PI)/180,(0*PI)/180);

untuk program selanjutnya kunjungi Link Blog Diatas dan di copy dibawah setelah program ini, sekian terima kasih..