ANALISA PERGERAKAN DAN PERUBAHAN WARNAPADA ANIMASI LINGKARAN 2D

Titin Wahdania Tunnisa1, Astri Yuniarti2, Suhendhik3, Mia Anggraini4,Rahmatul Husna5, Wina Layanti6 , Diah Putri Sari7

Jurusan Sistem KomputerFakultas Ilmu Komputer Universitas Sriwijaya

Email :tiendania@yahoo.com, ayikchun@yahoo.com, suhendhik@live.com , fik_rainy@yahoo.com ,

rahmatulhusna91@yahoo.com , Whina_Ly@yahoo.com , diah_putri.sari@yahoo.com,

Abstrak

Grafika komputer telah menunjukkan kemajuan yang pesat dalam pengembangannya di berbagai bidang seperti ilmu pengetahuan, teknik, kedokteran, bisnis, industri, pemerintahan, seni, hiburan, pendidikan, periklanan, dan lain sebagainya. Salah satu bagian dari grafika komputer adalah pemodelan objek (object modelling). Dalam pemodelan objek dua dimensi (2D), didapati berbagai objek dapat dimodelkan menurut kondisi tertentu, objek yang dimodelkan itu perlu dimodifikasi. Dalam penerapannya, grafika computer mendukung terbentuknya suatu tampilan ataupun animasi. Untuk itu, dalam peng-implementasiannya menarik minat penulis menerapkan suatu animasi pada lingkaran 2D terhadap sumbu x dan sumbu y. Pada penerapannya, suatu animasi lingkaran yang dapat bergerak, diikuti juga oleh perubahan warna saat pemantulan pada sumbu y dan dapat terjadi proses scalling.

Keyword: grafika, animasi, 2D, lingkaran

1. PENDAHULUAN

Grafika komputer telah menunjukkan kemajuan yang pesat dalam pengembangan berbagai aplikasi untuk menghasilkan gambar. Walaupun pada awalnya aplikasi dalam sains dan engineering memerlukan peralatan yang mahal, perkembangan teknologi komputer memberikan kemudahan penggunaan komputer sebagai alat bantu aplikasi grafik komputer interaktif. Pada saat ini grafika komputer digunakan secara rutin dibidang ilmu pengetahuan, pendidikan, dll.

Grafika komputer pada dasarnya adalah suatu bidang komputer yang mempelajari cara-cara untuk meningkatkan dan memudahkan komunikasi antara manusia dengan mesin (komputer) dengan mesin membangkitkan, menyimpan, dan memanipulasi gambar model suatu objek menggunakan komputer [1].

Dalam penerapannya grafika komputer mendukung terbentuknya suatu tampilan ataupun animasi. Untuk itu, dalam peng-implementasiannya diterapkanlah suatu animasi pada lingkaran.

Perumusan masalah pada analisa animasi lingkaran ini, yaitu bagaimana cara agar dapat membuat suatu animasi lingkaran yang dapat bergerak dan berubah warna.

Dan pembatasan masalah pada analisa ini, yaitu dirumuskan pada pergerakan dari suatu lingkaran yang bergerak dari kanan ke kiri dan dari kiri ke kanan, serta pergerakan lingkaran dari atas ke bawah dan dari bawah ke atas. Kemudian, dalam analisanya terhadap perubahan warna yang dihasilkan pada lingkaran tersebut.

2. TINJAUAN PUSTAKA

Grafik komputer adalah salah satu mesin pengolahan informasi yang paling efektif dan dapat digunakan sebagai jalan untuk mengkomunikasikan informasi yang diproses dalam wujud objek grafik seperti gambaran, tabel, grafik, dan diagram sebagai ganti dari teks. Dengan begitu kita dapat mengatakan bahwa computer grafik bisa menyatakan data dengan format gambar (A.P.Godse, 2009:01).

Dalam suatu pengertian umun, Grafik komputer adalah proses dalam memproduksikan suatu gambar atau gambaran yang menggunakan Komputer (Jeffrey J. McConnell, 2006:01).

Grafika computer adalah suatu bidang ilmu yang mempelajari bagaimana “membangun” grafik (gambar) baik 2D maupun 3D yang kelihatan nyata menggunakan komputer. Salah satu bidang grafika computer yang sangat terkenal adalah Desain Grafis.

Untuk implementasi grafika komputer ini diterapkan pada suatu animasi lingkaran. Walaupun lingkaran berbentuk 3Dimensi, tapi itu dibatasi untuk bergerak di bidang xy jadi ini sebenarnya hanya simulasi fisik 2D.

AnimasiAnimasi berasal dari pengolahan gambar tangan pada kertas gambar yang kemudian di-"putar" sehingga muncul efek gambar bergerak. Dalam grafika komputer animasi mem-pelajari cara menggambarkan dan memanipulasi gerakan.

Grafik komputer 2DGrafik komputer 2D adalah

pembuatan objek gambar yang masih berbasis gambar dengan perspektif 2 titik sebagai contoh adalah:gambar teks,bangun 2D seperti segitiga, lingkaran dsb. Grafik komputer 2D kebanyakan digunakan pada aplikasi yang digunakan hanya untuk

mencetak dan menggambar seperti tipografi, gambar, kartun,iklan, dll.

Struktur data obyek grafik 2D, dalam hal ini digunakan bentuk struktur (type data record) dan array. Menggambar obyek grafik 2D dengan struktur data yang sudah ditentukan.

Sedangkan, transformasi merupakan suatu operasi modifikasi bentuk objek tanpa merusak bentuk dasar dari objek. Salah satu contoh transformasi adala transformasi dari window ke viewport. Pada layar dengan koordinat yang terbatas, dan biasanya dibatasi oleh sebuah kotak yang disebut windows, sedangkan layarnya tersebut disebut View port.

Transformasi 2D terdiri dari : Translasi

Translasi merupakan suatu proses yang menyebabkan perpindahan objek dari satu titik ke titik lain.

RotasiRotasi adalah teknik memutar

objek searah dengan arah perputaran jarum jam(dinyatakan dengan sudut negatif) atau berlawanan arah dengan arah jarum jam(dinyatakan sebagai sudut positif).

SkalaPenskalaan yaitu proses untuk

memperbesar atau memperkecil suatu gambar.

Warna Warna sebenarnya merupakan

persepsi kita terhadap pantulan cahaya dari benda-benda di depan mata. Tidak ada ketentuan jumlah warna dasar tetapi dalam implementasi dengan komputer hanya dibutuhkan tiga warna dasar. Ada berbagai model untuk menyatakan warna dasar serta rentang warna yang dihasilkan, salah satu diantaranya adalah RGB.

Model warna RGB dapat digambarkan sebagai sebuah kotak yang mempunyai tiga sumbu yaitu : R(red), G(green), B(blue), dimana nilai masing-masing sumbu berkisar dari 0 sampai 1.

DelphiDelphi adalah salah satu bahasa pemrograman berbasis visual yang digunakan untuk membuat program aplikasi pada komputer. Bahasa pemrograman yang digunakan oleh Delphi sebenarnya turunan dari bahasa pemrograman pascal, yang dahulu pada Delphi dikenal sebagai objek pascal..3. PEMBAHASAN

Grafik komputer 2 dimensi pada analisa pergerakan dan perubahan warna pada lingkaran ini adalah bentuk dari benda yang berbentuk lingkaran. Grafik 2 Dimensi merupakan teknik penggambaran yang berpatokan pada titik koordinat sumbu x (datar) dan sumbu y (tegak). Agar dapat tampil dengan sempurna, gambar yang akan ditampilkan dengan teknik ini harus memiliki nilai koordinat x dan y minimum 0 dan maksimum sebesar resolusi yang digunakan.

Komponen pembentuk AnimasiUntuk menggambar lingkaran

dengan pixel menghasilkan 8 warna, 4 warna, 2 warna atau 1 warna.

Lingkaran mempunyai 8 simetris putar, artinya lingkaran dapat dibagi menjadi 8 bagian yang simetris sama atau satu bagian dapat diputar sehingga dapat membentuk sebuah lingkaran penuh.

Untuk melengkapi program lingkaran dibentuk prosedur FormCreate dan prosedur Sumbu.Procedure TForm1.FormCreate (Sender :TObject);Procedure TForm1.FormPaint(Sender :TObject);

Menggambar lingkaran dapat digunakan 2 metode, yaitu: metode polinom dan metode trigonometri

Metode Polinom

Lingkaran dengan pusat (0,0) dan Radius r dengan persamaan :x² + y ² = r ²bentuk eksplisit untuk menentukan nilai y:

y = √(r ² - x ²)diagram simetrisnya :

Metode TrigonometriLingkaran dengan pusat (0,0) dan Radius r, dengan persamaan : x = r cos α dan y = r sin αPembagian lingkaran dalam bentuk simetris sama dengan lingkaran polinom.Batas scan mulai dari sudut = 0 sampai 45 derajad.

Lingkaran dengan pusat (a,b) dan Radius r, dengan persamaan : x = a + r cos α dan y = b + r sin αPersamaan diperoleh dengan menggeser titik pusat (0,0) ke titik (a,b) diikuti dengan pergeseran titik yang lainnya.

Kemudian Transformasi Geometri Dasar meliputi sebagai berikut:a. Translasi

Tv -> Perpindahan obyek dengan vektor arah v = a i + b jDengan: a = besarnya perpindahan ke xb = besarnya perpindahan ke y y

Translasi dilakukan dengan penambahan translasi pada suatu titik koordinat dengan translasi vector yaitu (trx,try), dimana trx adalah translation

vector menurut sumbu x sedangkan try adalah translasi vector terhadap sumbu yb. Rotasi

Rotasi (putaran) adalah suatu operasi yang menyebabkan objek bergerak berputar pada titik pusat atau pada sumbu putar yang dipilih berdasarkan sudut putaran tertentu. Untuk melakukan rotasi diperlukan sudut rotasi dan pivot point (xp,yp) dimana objek akan dirotasi.

c. SkalaSkala akan diperoleh gambar yang

lebih besar dan semakin menjauh dari titik(0,0). Sebaliknya dengan faktor skala yang mempunyai nilai absolut lebih kecil dari 1, akan diperoleh gambar yang lebih kecil dan mendekat ke titik (0,0).Algoritma Pembentukan Lingkaran

Pada umumnya, lingkaran digunakan sebagai komponen dari suatu gambar. Prosedur untuk menampilkan lingkaran dan elips dibuat dengan persamaan dasar dari lingkaranx2+y2=r2

Lingkaran adalah kumpulan dari titik-titik yang memiliki jarak dari titik pusat yang sama untuk semua titik. Lingkaran dibuat dengan menggambarkan seperempat lingkaran, karena bagian lain dapat dibuat sebagai bagian yang simetris.

Penambahan x dapat dilakukan dari 0 ke r sebesar unit step, yaitu menambahkan ± y untuk setiap step.

Simetris delapan titikProses pembuatan lingkaran dapat

dilakukan dengan menentukan satu titik awal. Bila titik awal pada lingkaran (x,y), maka terdapat tiga posisi lain, sehingga dapat diperoleh delapan titik. Dengan demikian, hanya diperlukan untuk menghitung segmen 45 dalam menentukan lingkaran selengkapnya. Delapan titik simetris, yaitu :

Kuadran I (x,y),(y,x) Kuadran II (-x,y),(-y,x) Kuadran III (-x,-y),(-y-x) Kuadran IV (x,-y),(y,-x)

Algoritma lingkaran midpoint disebut juga algoritma lingkaran Bressenham. Algoritma yang di-gunakan membentuk semua titik berdasarkan titik pusat dengan penambahan semau jalur disekeliling lingkaran. Dalam hal ini hanya diperhatikan bagian 45 dari suatu lingkaran, yaitu oktan kedua dari x = 0 ke x = R/ 2, dan menggunakan prosedur circle point untuk menampilkan titik dari seluruh lingkaran.

Fungsi Dasar Pembentuk Objek

Void Keteranganimplementation{$R *.DFM}

Bangun geometri dibuat dalam suatu procedure tak standar yang ditulis di bawah garis directive {$R * .DFM}

procedure TForm1.Timer1Timer(Sender: TObject);beginif Kanan then begin Lingkaran.Left := Lingkaran.Left + 1; if Lingkaran.Left + Lingkaran.Width >= Panel1.ClientWidth then begin Kanan := False; Lingkaran.Brush.Color:=clblue; end endelse Begin Lingkaran.Left := Lingkaran.Left - 1; if Lingkaran.Left <= 0 then

Prosedur timer menggambarkan waktu yang ditentukan per satuan detiknya. Dengan logika:

1. Jika lingkaran berada di kanan, maka lingkaran akan bergerak (translasi) dari kanan ke kiri dan berubah (transformasi) warna biru.

2. Jika lingkaran berada di kiri, maka lingkaran akan bergerak (translasi) dari kiri ke kanan dan berubah (transformasi) warna hijau.

3. Jika lingkaran berada di bawah, maka lingkaran akan bergerak (translasi) dari bawah ke atas

4. Jika lingkaran berada di atas, maka lingkaran akan bergerak (translasi) dari atas ke bawah

begin Kanan := True; Lingkaran.Brush.Color:=clgreen; end end;if Bawah then begin Lingkaran.Top := Lingkaran.Top + 1; if Lingkaran.Top + Lingkaran.Width >= Panel1.Clientheight then Bawah := False; endelse Begin Lingkaran.Top := Lingkaran.Top - 1; if Lingkaran.Top <= 0 then Bawah := True; end;end;

procedure TForm1.Sb_UkurChange(Sender: TObject);begin Lingkaran.Width:= Sb_Ukur.Position; Lingkaran.Height:=Sb_Ukur.Position;end;

Prosedur perubahan ukuran lingkaran

procedure TForm1.BerhentiClick(Sender: TObject);begin Timer1.Enabled:=FALSE;end;

Prosedur lingkaran dan timer berhenti ketika pilihan berhenti pada form klik, sesuai dengan dimana lingkaran tersebut berada.

procedure TForm1.MulaiClick(Sender: TObject);begin Timer1.Enabled:=TRUE;end;

Prosedur lingkaran dan timer dimulai ketika pilihan Mulai pada form diklik.

procedure TForm1.SelesaiClick(Sender: TObject);begin Close;end;

Prosedur selesai menjalankan program atau keluar ketika pilihan Selesai pada form diklik.

procedure TForm1.Sb_CepatChange(Sender: TObject);begin Timer1.Interval:= 101-Sb_Cepat.Position;end;

Prosedur perubahan kecepatan dengan pengaturan waktu (timer) yang dipercepat

procedure TForm1.FormActivate(Sender: TObject);begin Randomize; Lingkaran.Left := Random(Panel1.ClientWidth-Lingkaran.width); Lingkaran.Top := Random(Panel1.ClientHeight-Lingkaran.Height); Kanan := Boolean(Random(2)); Bawah := Boolean(Random(2));end;

end.

Prosedur menunjukkan lingkaran tersebut sedang aktif.

4. HASIL DAN ANALISA 1. Tampilan awal program

2. Lingkaran mulai berjalan

3. Pada saat lingkaran menyentuh tepi kanan maka lingkaran akan berubah warna menjadi biru, lalu lingkaran bergerak ke arah kiri

4. Pada saat lingkaran menyentuh tepi kiri maka lingkaran akan berubah warna menjadi hijau lalu bergerak ke arah kanan

5. Ukuran lingkaran dapat diatur pada option form Ukuran, disini terdapat proses scalling

6. Kecepatan lingkaran dapat diatur pada option form Kecepatan.

Selain itu pada tampilan output, ada pilihan menu berhenti untuk memberhentikan pergerakan lingkaran dan pilihan selesai untuk keluar atau menutup applikasi.

5. KESIMPULAN

Dari hasil penerapan grafika computer diatas dapat disimpulkan :

a. Grafik 2 dimensi merupakan teknik penggambaran yang bertumpu pada titik koordinat sumbu x (datar) dan sumbu y (tegak) dengan nilai koordinat x dan y minimum 0 dan maksimum sebesar resolusi yang ditentukan

b. Menggambar lingkaran dapat digunakan 2 metode, yaitu : metode polinom dan metode trigonometri

c. Persamaan Metode Polinom adalah x² + y ² = r ² dan y = √(r ² - x ²)

d. Persamaan Metode Trigonometri adalah x = r cos α dan y = r sin α

e. Prosedur untuk menampilkan lingkaran dan elips dibuat dengan persamaan dasar dari lingkaran adalah x2+y2=r2

f. Pada pembuatan seperempat Lingkaran. Penambahan x dapat dilakukan dari 0 ke r sebesar unit step, yaitu menambahkan ± y untuk setiap step.

g. Algoritma lingkaran Bressenham adalah algoritma yang digunakan untuk membentuk semua titik berdasarkan titik pusat dengan penambahan jalur disekeliling lingkaran

h. Prosedur circle point digunakan untuk menampilkan titik dari seluruh lingkaran

Daftar Pustaka

[1] Bender, W. Gruhl, D. Morimoto, N. Lu, A. (1996). Techniques for Image Converting. IBM System Journal, 35.

[2] Basuki ,Achmad & Nana Ramadijanti. Pengantar Grafika Komputer. Laboratorium Computer Vision – (PENS-ITS).

[3] Kalbag, Asha & Muhammad Razin, Abdullah.2002.Computer Graphics and Animation. Oxford University Press.