PROCESSING

I. PENGENALAN PROCESSING
1.1 Tentang Processing
Processing adalah salah satu dari bahasa pemrograman dan lingkungan
pengembangan open sorce. Processing suatu projek terbuka yang dikerjanakn oleh Ben
Fry dan Casey Reas. Berkembang dari ide-ide yang dieksplorasi di Aesthetics and
Computation Group (ACG). Sejak tahun 2001, software processing sudah mulai
dipromosikan untuk bidang seni visual.

1.2 Pengenalan Processing

Konsep dari software processing adalah menggunakan prinsip-prinsip bentuk visual,
gerak dan intraksi.

1.3 Tujuan Processing

Tujuan dari software processing adalah untuk pembelajaran dasar-dasar dari
pemrograman komputer dalam bentuk visual.

1.4 Penggunaan Processing

Pada saat ini, processing sudah digunakan oleh puluhan ribu siswa, seniman,
desainer, peneliti dan penggemar untuk belajar, prototype dan produksi.

1
MODUL PROCESSING
II. INSTALASI PROCESSING
2.1 Versi - Versi Processing
Saat ini terdapat beberapa versi software processing, yaitu :
a. Versi 1.5.1 dirilis pada 15 Mei 2011.
b. Versi 2.2.1 dirilis pada 19 Mei 2014.
c. Versi 3.0a4 dirilis pada 12 September 2014.
d. Versi 3.0a5 dirilis pada 16 November 2014.

2.2 Sistem Operasi

Software processing dapat dijalankan oleh beberapa sistem operasi, diantaranya:
Windows 64-bit, Windows 32-bir, Linux 64-bit, Linux 32-bit, dan Mac OS X.

2.3 Download Processing

Software Processing dapat didownload dengan gratis di website resmi processing
namun kita ditawarkan berdonasi untuk Processing Foundation (www.processing.org)

2.4 Instalasi Processing

2
MODUL PROCESSING
 Setelah di download lakukan langkah-langkah berikut:
1. Setelah didownload.
2. Extrak file winrar-nya.
3. Masuk ke file processing yang sudah diextrak.
4. pilih dan klik processing.exe

3
MODUL PROCESSING
III. MENGENAL LINGKUNGAN PROCESSING
3.1 Sketsa dan Prototype
Sketsa adalah cara awal seseorang menuangkan buah pikiran, yaitu dengan tujuan
untuk memvisualisasikan pemikiran. Contoh : Pembuatan storyboard pada animasi.

3.2 Fleksibilitas
Processing konsisten menggunakan banyak tool yang dapat digunakan bersama.
Lebih dari 100 library yang disediakan, seperti suara, komputer vision, dan lain-lain.
Dengan begitu, banyak informasi yang dapat mengalir kedalam ataupun keluar processing.

4
MODUL PROCESSING
 3.3 Family Tree
Seperti bahasa manusia, bahasa pemrograman juga memiliki bahasa terkait.
Processing menggunakan bahasa java, bahasa sintaks yang digunakan hampir mirip, tetapi
ada penambahan fitur custom untuk grafik dan interaksi.
Oleh karena itu, pembelajaran processing adalah langkah awal untuk pemrograman
pada bahasa lain dan dengan menggunakan perangkat lunak yang berbeda.

3.4 Mengenal Menu Processing

1. Display Processing: Berfungsi untuk menampilkan output.
PDE (Processing Development Environment): Tempat dimana anda dapat
membuat sketch.

5
MODUL PROCESSING
 2. Menu File
a. New: Membuat file baru
b. Open: Membuka file
c. Sketchbook: Berisi file sketch yang anda buat
d. Recent: Daftar file sketch yg telah disimpan
e. Examples: Berisi contoh-contoh
f. Close: Menutup jendela kerja
g. Save: Menyimpan sketch
h. Save As…: Menyimpan sketch sebagai …
i. Export Application: Mengexport menjadi
sebuah aplikasi
j. Page Setup: Menyeting spesifikasi halaman
k. Print: Mencetak kesebuah kertas
l. Preferences
m. Quit

3. Menu Edit

6
MODUL PROCESSING
 a. Undo : Mengbalikan kekondisi sebelum
b. Redo : Kebalikan dari menu undo
c. Cut : Untuk memotong dari yang telah anda pilih
d. Copy : Untuk menduplikat dari yang telah anda pilih
e. Copy as HTML : Untuk menduplikat dari yang telah anda pilih dengan
hasil akhir dalam bentuk format HTML
f. Paste : Menampilkan hasil dari fungsi cut/ copy
g. Select All : Memilih semua
h. Auto Format : Membuat kode yang anda pilih menjadi dalam bentuk
standar penulisan kode
i. Comment/Uncomment : Untuk memberikan atau menghilangkan komentar
j. Increase Indent : Text yang telah anda tandai, akan digeser kekanan
sebanyak 1 tabulasi
k. Decrease Indent : Text yang telah anda tandai, akan digeser kekiri
sebanyak 1 tabulasi
l. Find : Mencari text dengan menggunakan keyword
m. Find Next : Mencari text selanjutnya dengan menggunakan
keyword yang telah tersimpan pada find
n. Find Previous : Mencari text sebelumnya dengan menggunakan
keyword yang telah tersimpan pada find
o. Use Selection for Find : Memilih keyword dengan cara memblok, lalu
disimpan pada find

7
MODUL PROCESSING
 4. Menu Sketch
a. Run : Untuk mengeksekusi sketch
b. Present : Membuat tampilan fullscrean pada ketika running
c. Stop : Menghentikan sketch yang sedang running
d. Import Library … : Memasukan library tambahan berdasarkan kategori
e. Show Sketch Folder : Membuka direktori skatch
f. Add File … : Membuka file navigasi yang mengijinkan anda
meload gambar, huruf, media, dll

5. Menu Tools
a. Create Font : Berfungsi membuat karakter huruf
b. Color Selector : Memilih dan juga mengetahui value dari warna
HSB dan RGB yang telah terpilih
c. Archive Sketch : Membuat file dalam bentuk Zip dari sketch
d. Movie Maker : Membuat Quick time movie dari sequence image
e. Add Tool : Membuka tool manager, yang mengijinkan anda
menambahkan tool yang dapat membantu anda

8
MODUL PROCESSING
 6. Menu Help
a. Environmen
b. Reference
c. Find in Reference
d. Online
e. Getting Started
f. Troubleshooting
g. Frequently Asked Question
h. Visit Processing.org
MODUL PROCESSING
: Memberikan informasi pada lingkungan
pemrograman processing, anda akan diarahkan
pada jendela web browser
: Menyediakan referensi mengenai bahasa
processing, yang mana telah tersimpan pada
program processing
: Anda dapat mencari referensi, dengan
memasukan keyword yang anda cari
: Menu ini akan aktif ketika terkoneksi dengan
internet, ketika mengakses bantuan
: Memberikan petunjuk kepada anda, ketika
anda pertama kali menggunakan processing
: Membantu anda ketika anda melakukan
kesalahan, menu ini akan membantu anda
memberikan solusi
: Anda akan diarahkan pada jendela tanya
jawab
: Anda akan dibawa ke website resmi
processing
9
IV. PENGEMBANGAN PROCESSING
4.1 Pengenalan
Processing sekarang sudah banyak perkembangannya dari berbagai bidang,
diantaranya bidang Game, Primitives 3D, Graphical User Interface (GUI) untuk
mikrokontroller, animasi, deteksi wajah dengan kamera, dan masih banyak yang lain.

Games

Primitives 3D

10
MODUL PROCESSING
 GUI Microcontroller

Animasi

11
MODUL PROCESSING
PARADIGMA DAN STRUKTUR PROCESSING
4.2 Paradigma Processing
Processing mengadopsi paradigma berorientasi objek karena menggunakan konsep
class dan object.

4.3 Penjelasan Struktur Processing

a. Inisialisasi: Bagian dimana kita mendeklarasikan variabel dan import
perpustakaan (libraries).
b. Setup: Suatu bagian untuk menyiapkan atau menyajikan keperluan perogram.
c. Draw: Bagian menggambar atau mendesain.

12
MODUL PROCESSING
V. OBJEK ORIENTED
5.1 Mengenal Konsep Objek di Processing
Menggambar pada layar komputer adalah seperti menggambar pada sebuah kertas
grafik. Pixel adalah grid dari element pencahayaan pada layar computer.
Koordinat-X : Nilai yang mewakili sumbu X (Horizontal)
Koordinat-Y : Nilai yang mewakili sumbu Y (Vertikal)
5.2 Perbandingan Pixel
Pixel merupakan suatu satuan standar ukuran yang digunakan pada layar.
Perbandingan berikut ini adalah untuk melihat perbedaan dari setiap nilai pixel yang
digunakan. Diharapkan anda bisa mengambil kesimpulan dari perbandingan berikut ini :

5.3 Function
Function adalah dasar untuk membangun suatu blok dari program processing.
Behavior dari function didefinisikan sebagai parameter, seperti : Size, Point, Line,
Rectangle, Quad, Rect, Ellipse, Arc.
Penggunaan function akan dijelaskan, anda harus lebih fokus lagi pada slide-slide
berikutnya.

5.4 Menggambar Titik

size() function memiliki dua parameter: width dan height pada layar. point() function
memiliki dua parameter untuk mendefinisikan posisi: koordinat-X dan koordinat-Y.
• Jalankan perintah:
size (480, 120);

13
MODUL PROCESSING
 point (240, 60);

Output:

Output

5.5 Behavior Function Menggambar Bentuk Dasar

5.6 Menggambar Garis

Untuk menggambar garis memerlukan dua buah koordinat, gunakan line () function.
Bu : line (x1, y1, x2, y2);
• Contoh program, size (480, 120);
line (20, 50, 420, 110);

Output:

14
MODUL PROCESSING
 5.7 Menggambar Bentuk Dasar
Ikuti pola ini :
Untuk membuat sebuah segi tiga, membutuhkan 6 parameter
Untuk membuat sebuah quadrilateral, membutuhkan 8 parameter
Contoh : size (480, 120);
quad (158, 55, 199, 14, 392, 66, 351, 107);
triangle (347, 54, 392, 9, 392, 66);
triangle (158, 55, 290, 91, 290, 112);
Output:

5.8 Menggambar Bujursangkar

Untuk menggambar bujursangkar memerlukan 4 buah paramater, gunakan rect ()
function.
Bu : rect (x1, y1, width, height);
Contoh program: size (480, 120);
rect (180, 60, 220, 40);
Output:

15
MODUL PROCESSING
 5.9 Menggambar Ellipse dan sebagian Ellipse
Untuk menggambar ellipse memerlukan 4 buah paramater, gunakan ellipse ()
function.
Bu : ellipse (x1, y1, width, height);
Contoh program: size (480, 120);
ellipse(278, -110, 400, 400);
ellipse(120, 100, 110, 110);
ellipse(412, 60, 18, 18);
Output:

Untuk menggambar sebagian dari ellipse memerlukan 6 buah paramater, gunakan

arc () function.
Bu : arc (x1, y1, width, height, start, stop);
Contoh program, size(480, 120);
arc(90, 60, 80, 80, 0, HALF_PI);
arc(190, 60, 80, 80, 0, PI+HALF_PI);
arc(290, 60, 80, 80, PI, TWO_PI+HALF_PI);
arc(390,60, 80, 80, QUARTER_PI, PI+QUARTER_PI);
Output:

16
MODUL PROCESSING
 5.10 Lingkaran dan Pengukuran Derajat

5.11 Menggambar sebagian dari Ellipse dengan Menggunakan Derajat

Untuk menggambar sebagian dari ellipse memerlukan 6 buah paramater, gunakan
arc () function. Gunakan radians () function, pada parameter start dan stop
Bu : arc (x1, y1, width, height, start, stop);
Contoh program, size(480, 120);
arc(90, 60, 80, 80, 0, radians (90));
arc(190, 60, 80, 80, 0, radians (270));
arc(290, 60, 80, 80, radians (180), radians(450));
arc(390, 60, 80, 80, radians (45), radians (225));
Output:

17
MODUL PROCESSING
 5.12 Menggambar dengan Urutan
Ketika program dieksekusi (run), komputer mulai membaca dari atas hingga
pembacaan line program berikutnya.
Perhatikan contoh berikut ini :

size(480, 120);
ellipse(140, 0, 190, 190);
rect(160, 30, 260, 20);

size(480, 120);
rect(160, 30, 260, 20);
ellipse(140, 0, 190, 190);

5.13 Shape Properties

a. Draw Smooth Lines
smooth () function, memberikan mehalusan pada tepi garis. Prinsipnya yaitu
dengan mencampurkan/ menyatukan tepi garis dengan nilai pixel terdekatnya. Jika
smooth () function diaktifkan, maka nosmooth () function secara otomatis tidak aktif.
Contoh : size (480, 120);
smooth ();
ellipse (140, 60, 90, 90);
noSmooth ();
ellipse (240, 60, 90, 90);
Output:

18
MODUL PROCESSING
 b. Set Stroke Weight
Defaultnya strokeweight adalah single pixel, fungsinya memberikan ketebalan
pada garis.
Contoh : size(480, 120);
smooth();
ellipse(75, 60, 90, 90);
strokeWeight(8);
ellipse(175, 60, 90, 90);
ellipse(279, 60, 90, 90);
strokeWeight(20);
ellipse(389, 60, 90, 90);
Output:

c. Set Stroke Atributes

 Strokejoin () function
 Strokecap () function
Contoh : size (480, 120);
smooth ();
strokeWeight (12);
strokeJoin (ROUND);
rect (40, 25, 70, 70);
strokeJoin (BEVEL);
rect (140, 25, 70, 70);
strokeCap (SQUARE);
line (270, 25, 340, 95);
strokeCap (ROUND);
line (350, 25, 420, 95);

19
MODUL PROCESSING
 Contoh lain:
size (800, 600);
background (255, 255, 255);
for (int i=0; i<100; i++)
{
fill (random(0, 255), random(0, 255), random(0, 255));
int p1x = (int) random (0,800);
int p1y = (int) random (0,600);

int p2x = (int) random (0,800);

int p2y = (int) random (0,600);

int p3x = (int) random (0,800);

int p3y = (int) random (0,600);
triangle (p1x, p1y, p2x, p2y, p3x, p3y);
}

20
MODUL PROCESSING
VI. KONSTANTA
6.1 HALF_PI
HALF_PI adalah konstanta matematika dengan nilai 1.57079632679489661923.
HALF_PI adalah setengah rasio keliling lingkaran dengan diameternya.

6.2 PI
PI adalah konstanta metematika dengan nilai 3.14159265358979323846. PI adalah
rasio keliling lingkaran dengan diameternya.

6.3 QUARTER_PI
QUARTER_PI adalah konstanta matematika dengan nilai 0.7853982.
QUARTER_PI adalah seperempat rasio keliling lingkaran dengan diameternya.

6.4 TAU
TAU sam seperti TWO_PI adalah konstanta matematika dengan nilai
6.28318530717958647693. TAU adalah dua kali rasio keliling lingkaran dengan
diameternya.

6.5 TWO_PI
TWO_PI adalah konstanta matematika dengan nilai 6.28318530717958647693.
TWO_PI adalah dua kali rasio keliling lingkaran dengan diameternya.

Contoh :
float x = width/2; float y = height/2;
float d = width * 0.8;
arc(x, y, d, d, 0, QUARTER_PI);
arc(x, y, d-20, d-20, 0, HALF_PI);
arc(x, y, d-40, d-40, 0, PI);
arc(x, y, d-60, d-60, 0, TAU);

21
MODUL PROCESSING
VII. VARIABLES
7.1 Tentang Variable
Suatu variable menyimpan nilai didalam memori, bisa digunakan kapan saja dan
mudah untuk diupdate.
Alasan utama menggunakan variable adalah untuk menghindari pengulangan nilai
pada suatu program, untuk digunakan berkali-kali.

7.2 Menggunakan Lagi Nilai yang Sama

Ketika anda menggunakan ellipse () function, nilai untuk koordinat-Y dan diameter
ellipse kita masukan kedalam suatu variable, nilai yang sama dapat digunakan berkali-kali
pada ellipse yang lainnya.
Contoh : size (480, 120);
smooth ();
int y = 60;
int d = 80;
ellipse (75, y, d, d);
ellipse (175, y, d, d);
ellipse (275, y, d, d);
Nilai variable dapat dengan mudah anda ganti, dengan begitu anda dapat lebih cepat
menyelesaikan pekerjaan anda.

7.3 Membuat Variable

Ketika anda membuat variable, anda harus menetapkan: nama variable, type data,
dan nilai.
Range nilai yang depat disimpan, telah didefinisikan pada type data.
Type data : integer, floating point, character, words, images, font, dll.
Variable harus dideklarasikan terlebih dahulu, yang mana akan ditempatkan pada
ruang memori komputer.
Anda perlu juga untuk mendeklarasikan type data.

Contoh Deklarasi variable :

int x;
x = 12 atau int x = 12

22
MODUL PROCESSING
 7.4 Basic Arithmetic
Perhatikan Contoh berikut :
size(480, 120);
int x = 25;
int h = 20;
int y = 25;
rect (x, y, 300, h);
x = x + 100;
rect (x, y + h, 300, h);
x = x - 250;

Simbol seperti +, -, dan * (disebut dengan operator). Ketika ditempatkan dengan

nilai seperti 5 + 9, ini adalah expresion.
Operator Matematika: + Addition
- Substractor
* Multiplication
/ Division
= Assignment

int x = 4 + 4 * 5; // Memberikan nilai 24 pada x

int x = 4 + (4 * 5); // Memberikan nilai 24 pada x
int x = (4 + 4) * 5; // Memberikan nilai 40 pada x
x += 10; // Ini artinya sama seperti x = x + 10
y -= 15; // Ini artinya sama seperti y = y - 10
x++; // Ini artinya sama seperti x = x + 1
Y-- ; // Ini artinya sama seperti y = y - 1

23
MODUL PROCESSING
VIII. PERULANGAN
8.1 Tentang Perulangan
Pernyataan perulangan adalah pernyataan yang akan diulang-ulang hingga
persyaratan perulangan terpenuhi. Didalam processing ada 2 buah perulangan yang dapat
digunakan, yaitu For dan While.
8.2 FOR
Perulangan For adalah perulangan yang diketahui banyaknya dan dimulainya dari
mana perulangan yang kita akan lakukan dalam program.

8.3 SYNTAX FOR

Berikut ini syntak dasar For:
for (i=a; i<b; i=i+c)
{ d}
a : mulai perulangan.
b : banyak perulangan.
c : pengeksekusi perulangan.
d : pernyataan yang akan diulang.

for (tipe_data variabel : array)

{pernyataan}
Tipe_data : tipe data variabel yang akan diulang.
Variabel : variabel data yang akan diulang.
Array : variabel array
Pernyataan : pernyataan yang akan diulang.

Contoh 1:
for (int i = 0; i < 40; i = i+1)
{
line(30, i, 80, i);
}

Penjelasan 1:
int i = 0
Variabel i sebagai integer dengan nilai awalan 0.
i < 40

24
MODUL PROCESSING
 Nilai perulangan variabel i kurang dari 40.
i = i+1
Nilai variabel i akan di tambahkan 1 setiap perulangan.

line(a, b, c, d);
a : koordiant X pertama.
b : koordinat Y pertama.
c : koordinat X kedua.
d : koordinat Y kedua.

Hasil Contoh 1:

Contoh 2:
for (int i = 0; i < 80; i = i+5)
{
line(30, i, 80, i);
}

Hasil Contoh 2:

Penjelasan contoh 2:
int i = 0

25
MODUL PROCESSING
 Variabel i sebagai integer dengan nilai awalan 0.
i < 80
Nilai perulangan variabel i kurang dari 80.
i = i+5
Nilai variabel i akan di tambahkan 5 setiap perulangan.

line(a, b, c, d);
a : koordinat X pertama.
b : koordinat Y pertama.
c : koordinat X kedua.
d : koordinat Y kedua.

Contoh 3:
for (int i = 30; i < 80; i = i+5)
{
for (int j = 0; j < 80; j = j+5)
{
point(i, j);
}
}

Hasil Contoh 3:

Penjelasan Contoh 3:
Didalam contoh 3, terdapat For didalam For. Dimana For pertama akan berulang jika
For yang ke dua sudah terpenuhi semua persyaratannya.
Point(a,b);
a : koordinat X

26
MODUL PROCESSING
 b : koordinat Y

Contoh 4:
int[] nums = { 5, 4, 3, 2, 1 };
for (int i : nums)
{
println(i);
}

Penjelasan Contoh 4:
Nums : variabel array sebagai tipe data integer dengan nilai 5,4,3,2,1.

Int i : variabel dari for array sebagai tipe data integer.

Println(i) : nilai variabel i dicetak.

8.4 WHILE
Perulangan while adalah perulangan yang dilakukan jika kita tidak mengetahui
jumlah perulangan yang akan dilakukan namun kita sudah mengetahui syarat dan
ketentuan dari perulangan yang akan kita lakukan.

8.5 SYNTAX dasar FOR

while (ketentuan)
{
pernyataan;
}

Ketentuan : banyaknya perulangan.

Pernyataan : pernyataan yang akan diulang.

Contoh 5:
int i = 0;
while (i < 80)
{
line(30, i, 80, i);
i = i + 5;
}

Hasil Contoh 5:

27
MODUL PROCESSING
 Penjelasan Contoh 5:
int i
variabel i sebagai integer dengan nilai awal 0.
While(i<80)
perulangin nilai pada variabel i hingga kurang dari 80.
line(a, b, c, d);
a : koordinat X pertama.
b : koordinat Y pertama.
c : koordinat X kedua.
d : koordinat Y kedua.

8.6 EMBEDDEDITERATION
a. Buka menu file.
b. Pilih examples.
c. Pilih basics.
d. Pilih control.
e. Pilih embeddediteration.

8.7 LOGICAL OPERATOR

a. Buka menu file.
b. Pilih examples.
c. Pilih basics.
d. Pilih control.
e. Pilih LogicalOperator

28
MODUL PROCESSING
IX. OPERATOR ARITMATIKA
9.1 Tentang Operator Aritmatika
Operator aritmatika adalah operator penjumlahan, pengurangan, pembagian dan
pembagian. Atau operator untuk melakukan perhitungan.

9.2 %(MODULO)
Operator (%) adalah operator sisa pembagi dari dau atribut atau nilai. Contoh:
int a = 5 % 4;
5 dibagi 4 adalah 1 dan sisa 1, maka hasilnya a=1.
int b = 125 % 100;
125 dibagi 100 adalah 1 dan sisa 25, maka hasilnya b=25.
float c = 285.5 % 140.0;
285.5 dibagi 140.0 adalah 2 dan sisanya 5.5, maka hasilnya c=5.5.
float d = 30.0 % 33.0;
30.0 dibagi 33.0 adalah 0 dan sisanya 30, maka hasilnya d=30.

9.3 *(MULTIPLY)
Operator (*) adalah operator perkalian dari dua atau lebih atribut atau nilai. Contoh:
int e = 50 * 5;
50 dikalikan dengan 5 maka hasilnya e=250.
int f = e * 5;
Nilai e dikalikan dengan 5 maka hasilnya f=1250.

9.4 *= (MULTIPLY ASSIGN)

Operator (*=) adalah operator menggabungkan perkalian. Contoh:
int a = 5;
int b = 2;
a *= b;
Nilai a (5) dikalikan dengan nilai b (2) dan hasilnya nilai a=10.
Atau
a=a*b;

9.5 + (ADDITION)

29
MODUL PROCESSING
 Operator (+) adalah operator penambahan dari dua atau lebih atribut atau nilai.
Contoh:
int a=5+10;
Nilai 5 ditambahkan 10 makah hasilnya a=15;
Int b=a+5;
Nilai a (15) ditambahkan 5 maka hasilnya b=20.

9.6 ++ (INCREMENT)
Operator (++) adalah operator penambahan 1. Contoh:
int a=3;
int b=a++;
nilai a adalah 3 maka nilai b adalah nilai a+1 atau 3+1 hasilnya b=4.

9.7 += (ADD ASSIGN)

Operator (+=) adalah operator penggabungan penambahan. Contoh :
Int a=4;
Int b=6;
a+=b;
Nilai a(4) ditambahkan nilai b(6) maka hasilnya a=10.

9.8 - (MINUS)
Operator (-) adalah operator pengurangan dari dua atau lebih atribut atau nilai dan
untuk nilai negatif. Contoh:
Int a=3-2;
3 dikurangi 2 maka hasilnya nilai a=1.
int b=-2;
B bernilai -2.

9.9 - - (DECREMENT)
Operator (--) adalah operator pengurangan 1. Contoh:
Int a=9;
Int b=a--;
Nilai a adalah 9 maka nilai b adalah 9-1=8;

30
MODUL PROCESSING
 9.10 - = (SUBSTRACT ASSIGN)
Operator (-=) adalah operator penggabungan pengurangan. Contoh:
Int a=4;
Int b=3;
a-=b;
Nilai a(4) dan nillai b(3) maka hasilnya nilai a=1;

31
MODUL PROCESSING
 9.11 / (DIVIDE)
Operator (/) adalah operator pembagia dari dua buah atribut atau nilai. Contoh:
Int a= 4/2;
4 dibagi 2 hasilnya nilai a=2;

9.12 /= (DIVIDE ASSIGN)

Operator (/=) adalah operator penggabungan pembagian. Contoh:
Int a=6;
Int b=3;
a/=b;
Nilai a(6) dibagi nilai b(3) maka nilai a=2.

32
MODUL PROCESSING
X. CONDITIONAL
10.1 Tentang ?: (CONDITIONAL)
Jika nilai tes bernilai benar(true) maka ekspresi1 dijalankan sedangkan jika tess
bernilai salah (false) maka expresi2 dijalankan.
Code:
test ? ekspresi1 : ekspresi2
Test : ekspresi yang mengevaluasi benar atau salah.
Ekspresi1 : ekspresi yang akan dijalankan.
Ekspresi2 : ekspresi yang akan dijalankan.

Contoh Code:
int s = 0;
for (int i = 5; i < 100; i += 5)
{ s = (i < 50) ? 0 : 255;
stroke(s);
line(30, i, 80, i); }

Penjelasan:
Jika nilai i kurang dari 50 maka nilai s=0 dan jika nilai i lebih besar dari 50
maka nilai s=255

10.2 BREAK
Akhir eksekusi dari struktur switch, for dan while.
Contoh :
char letter = 'B';
switch(letter) {
case 'A':
println("Alpha");
break;
case 'B':
println("Bravo");
break;
default:
println("Zulu");

33
MODUL PROCESSING
 break; }

10.3 CASE
Menunjukan label yang berbeda untuk dievaluasi dengan parameter.
Code:
case label : pernyataan
Label : label dari setiap case dengan tipe data char,byte atau integer.
Pernyataan : pernyataan dari case yang dipilih.

Contoh Code Case:

char letter = 'B';
switch(letter) {
case 'A':
println("Alpha");
break;
case 'B':
println("Bravo");
break;
default:
println("Zulu");
break; }
10.4 CONTINUE
Ketika menjalankan didalam operator for atau while, dia akan melompat sisa blok
berikutnya.
Contoh Code Continue:
for (int i = 0; i < 100; i += 10) {
if (i == 70) {
continue;
}
line(i, 0, i, height);
}

10.5 DEFAULT
Mendefinisikan pilihan yang tidak ada label khusus dengan parameter switch.

34
MODUL PROCESSING
 Code :
Default : pernyataan
Pernyataan : pernyataan yang dijalankan.

Contoh Code Default:

char letter = 'B';
switch(letter) {
case 'A':
println("Alpha");
break;
case 'B':
println("Bravo");
break;
default:
println("Zulu");
break; }

10.6 ELSE
Memperpanjang struktur if yang memungkinkan untuk memilih antara dua atau
lebih blok kode.
Code Else:
if (ekspresi) {
pernyataan }
else if (ekpresi) {
pernyataan }
else { pernyataan }
Ekspresi : syarat.
Pernyataan :pernyataan yang akan dijalankan jika sesuai syarat.

Contoh :
for (int i = 5; i < 95; i += 5) {
if (i < 35) {
line(30, i, 80, i); }

35
MODUL PROCESSING
 else {
line(20, i, 90, i); } }

10.7 IF
Fungsi if adalah fungsi untuk penyeleksian kondisi.
Code:
Code :
If(tes){pernyataan}
Tes : syarat.
Pernyataan : pernyataan yang akan dijalankan jika sesuai syarat.

Contoh:
for (int i = 5; i < height; i += 5) {
stroke(255);
if (i < 35) {
stroke(0);}
line(30, i, 80, i); }

10.8 SWITCH
Kerjanya sama seperti if else tapi switch lebih baik jika kita harus memilih antara
tiga atau lebih banyak alternatif.
Code : Contoh:
Switch(ekpresi) int num = 1;
{ case label: switch(num) {
pernyataan case 0:
case label: println("Zero");
pernyataan break;
default: case 1:
pernyataan} println("One");
break; }

36
MODUL PROCESSING
 10.9 CONTOH CONDITIONAL
Conditional 1: Conditional 2:
Buka menu file Buka menu file
Klik examples Klik examples
Pilih Basics Pilih Basics
Pilih Control Pilih Control
Pilih conditional1 Pilih conditional2

37
MODUL PROCESSING
XI. OPERATOR LOGIKA
11.1 Tentang Operator Logika
Operator Logika adalah operator yang digunakan untuk membandingkan dua atau
lebih kondisi logika benar (true) dan logika salah (false).

11.2 ! (LOGICAL NOT)

Membalikan nilai boolean dari ekpresi yang dihasilkan
sebelumnya.
Contoh:
boolean a = false;
if (!a)
{ rect(30, 20, 50, 50); }
a = true;
if (a)
{ line(20, 10, 90, 80);
line(20, 80, 90, 10); }

Penjelasan:
if(!a)
Jika bukan a atau jika a bernilai salah.

11.3 && (LOGICAL AND)

Membandingkan dua ekpresi atau lebih. Jikas salah satunya bernilai salah maka hasil
perbandinganya akan bernilai salah, sedangkan jika semua bernilai benar maka hasil
perbandingannya bernilai benar.
Syntax Dasar:
(ekpresi1)&&(ekspresi2)

Contoh:
for (int i = 5; i <= 95; i += 5)
{
if ((i > 35) && (i < 60)) { stroke(0); }
else

38
MODUL PROCESSING
 { stroke(255);}
line(30, i, 80, i); }

Penjelasan:
if((i>35)&&(i<60))
Jika nilai i lebih besar 23 dan nilai i kurang dari 60.
stroke(255)
Garis tepi dengan warna hitam.

11.4 | | (LOGICAL OR)

Membandingkan dua atau lebih ekspresi. Jika salah satu ekpresi bernilai benar maka
hasil perbandinganya akan bernilai benar, sedangkan jika semua ekspresi bernilai salah
maka hasil perbandingannya akan bernilai salah.
Contoh:
for (int i = 5 ; i <= 95; i += 5)
{
if ((i < 35) || (i > 60))
{ line(30, i, 80, i); }
}

Penjelasan:
if((i<35)||(i>60))
Jika nilai i kurang dari 35 atau nilai i lebih besar dari 60.
line(a,b,c,d)
a : Koordinat X pertama.
b : Koordinat Y pertama.
c : Koordinat X kedua.
d : Koordinat Y kedua.

39
MODUL PROCESSING
XII. OBJECTS ORIENTED
12.1 CLASS dan OBJECT
Sebelum membuat obyek, anda harus mendefinisikan class. Class merupakan bagian
dari suatu obyek. Class itu seperti sebuah arsitektur suatu obyek. Seperti ketika
membangun rumah, arsitektur dapat menggambarkan seperti apa jadinya rumah tersebut.
Rumah yang dibangun oleh arsitektur tersebut adalah obyeknya.
Contoh: Membuat Obyek Bola
Sketch 1 : Program utama
Sketch 2 : Global Variable
Constructor
Function
Effect : Memantul dan Gravitasi

Sketch 1: Program Utama

// DECLARE BolaKu2 = new Bola(400, 50);
Bola BolaKu; BolaKu3 = new Bola(50, 150);
Bola BolaKu2; }
Bola BolaKu3; void draw(){
void setup(){ background(0);
size(600,600); // CALL FUNCTIONALITY
smooth(); BolaKu.run();
// INITIALIZE BolaKu2.run();
BolaKu = new Bola(200, 200); BolaKu3.run();

40
MODUL PROCESSING
 Sketch 2 : Class Bola
class Bola{ if( x > width){
// GLOBAL VARIABLES kecepatanX = kecepatanX * -1;
float x = 0; }
float y = 0; if( x < 0){
float kecepatanX = 4; kecepatanX = kecepatanX * -1;
float kecepatanY = 0.5; }
// CONSTRUCTOR if( y > height){
Bola(float _x, float _y){ kecepatanY = kecepatanY * -1;
x = _x; }
y = _y; if( y < 0){
} kecepatanY = kecepatanY * -1;
// FUNCTION }
void run(){ }
tampilan(); void bergerak(){
bergerak(); x += kecepatanX;
memantul(); y += kecepatanY;
gravtasi(); }
} void tampilan(){
void gravitasi(){ ellipse(x,y,20,20);
kecepatanY += 0.2; }
} }
void memantul(){

41
MODUL PROCESSING
 42
MODUL PROCESSING
 43
MODUL PROCESSING
 44
MODUL PROCESSING
 45
MODUL PROCESSING
 46
MODUL PROCESSING
 47
MODUL PROCESSING
 48
MODUL PROCESSING