Mekanisme Pengolahan Data Pada Produk Multimedia Interaktif

A. Mekanisme Pengolahan Data

Pengolahan data terdiri dari tiga langkah utama, yaitu input, proses (pengolahan), dan output. Pengolahan data pada media interaktif yang dibuat dengan menggunakan Adobe Flash, dapat dilakukan dengan menggunakan input text, dynamic text, dan lain sebagainya.

 

1. Mengenal Pengolahan Data

Pengolahan data merupakan manipulasi data agar menjadi bentuk yang lebih informatif. Pengolahan data ini tidak hanya berupa perhitungan numerik tetapi juga operasi - operasi seperti klarifikasi data dan perpindahan data dari satu tempat ke tempat lain. Saat ini operasi - operasi tersebut dilakukan oleh beberapa mesin atau komputer, meskipun beberapa diantaranya dapat juga dilakukan secara manual.

 

a. Fungsi Dasar Pengolahan Data

Terdapat beberapa fungsi dasar pengolahan data, di antaranya yaitu sebagai berikut.

1) Pengolahan data  untuk mengambil program dan juga data berupa masukan atau input data.

2) Pengolahan data untuk menyimpan program data dan menyediakan suatu pemrosesan.

3) Pengolahan data untuk menjalankan proses aritmatika dan juga logika pada suatu data yang tersimpan.

4) Pengolahan data untuk menyimpan hasil sampai hasil akhir suatu pengolahan.

5) Pengolahan data untuk menampilkan dan juga mencetak data yang sudah tersimpan.

 

b. Siklus Pengolahan Data

    Pengolahan data terdiri dari tiga tahapan utama, yaitu input, proses, dan output.

Perhatikan bagan berikut !

 

Pada tahap input, data awal atau data input disiapkan dalam beberapa bentuk yang sesuai untuk keperluan pengolahan. Pada tahap proses, data input akan diubah dan biasanya dikombinasikan dengan informasi yang lain untuk menghasilkan data dalam bentuk yang lebih dapat digunakan. Dan pada tahap output, hasil - hasil dari pengolahan sebelumnya dikumpulkan.

 

2. Mekanisme Pengolahan Data pada Media Interaktif

Jika produk media interaktif berupa media yang akan menampilkan data form, maka mekanisme pengolahan datanya yaitu pengguna akan diminta untuk menginputkan data. Setelah data berhasil terinput, Adobe Flash akan melakukan pengolahan data dengan menggunakan ActionScript pada saat data tersebut akan ditampilkan. Output yang dihasilkan pada media interaktif ini yaitu berupa data sesuai yang telah diinputkan sebelumnya.

Sementara apabila produk media interaktif berupa game atau media interaktif evaluasi / kuis, mekanisme pengolahan datanya yaitu pengguna akan diminta untuk memasukkan inputan berupa jawaban yang diminta oleh produk media interaktif.

 

3. Mengenal Pengolahan Data dengan Text pada Adobe Flash

Text digunakan untuk memasukkan dan menampilkan text dalam Adobe Flash. Terdapat 3 tipe teks yang dapat digunakan, yaitu :

a. Static Text

Digunakan untuk menampilkan suatu teks yang sifatnya tidak dapat diubah secara manual atau dengan script setelah movie di publish. Untuk mengatur jenis, bentuk, ukuran, dan warna text dapat dengan menggunakan properties.

 

b. Dynamic Text

Memiliki sifat yang berubah - ubah sesuai dengan perintah yang diberikan pada ActionScript. Dynamic text biasanya digunakan untuk menampilkan suatu variabel. Pengolahan data sudah mulai terjadi pada proses ini. Contohnya digunakan pada aplikasi kalkulator pada bagian perhitungan. Untuk membuat dynamic text pada Adobe Flash, perhatikan langkah - langkah berikut :

 

1) Buka Adobe Flash pada PC kemudian pilih ActionScript 3.0

 

2) Pilih text tool kemudian buka panel properties. Pilihlah dynamic text pada option text type dan atur bentuk, ukuran, dan warna huruf pada properties.

3) Buatlah text area dengan cara klik dan drag pada stage.

4) Masukkan instance name dynamic text pada properties dengan nama "tampil_text".

5) Jika sudah, masukkan ActionScript berikut untuk menampilkan text.

tampil_teks . text="Hello , flash";

6) Ujilah dengan melakukan test movie.

 

c. Input Text

Merupakan text yang digunakan untuk meminta suatu masukan atau input dari user. Text ini dapat digunakan sebagai sarana untuk memasukkan isi variabel dalam ActionScript. Untuk membuat input text pada Adobe Flash, perhatikan langkah - langkah berikut :

1) Buka Adobe Flash kemudian pilih ActionScript 3.0

2) Pilih text tool kemudian buka panel properties. Pilihlah input text pada option text type, kemudian atur bentuk, ukuran, dan warna pada panel properties tersebut.

3) Buatlah text area dengan cara klik dan drag pada stage.

4) Masukkan instance name input text pada properties dengan nama "teks_masukan" dan aktifkan tombol show border around text.

5) Buat text area dengan menggunakan dynamic text. Text area ini nantinya digunakan untuk menampilkan teks yang tadi telah diinputkan. Masukkan instance name dynamoc text dengan nama "teks_tampilkan".

6) Buat layer baru untuk meletakkan tombol. Buat tombol navigasi "OK" dan letakkan di bawah text area dynamic text.

7) Berikan ActionScript berikut pada layer 2 atau yang berisi tombol untuk menampilkan teks yang telah diinputkan.

 

stop ( ) ;

var myText : String ;

function  captureText ( 0 : void {

        myText = teks_masukan . text ;

 

}

btn_ok . addEventListener (MouseEvent. CLICK, tampilkan) ;

function tampilkan (myNextEvent : MouseEvent) : void {

            captureText ( ) ;

            tekx_tampilkan . text = "Selamat Datang, "+myText +" : ) " ;

}

8) Ujilah dengan melakukan tes movie. masikkan namamu ke dalam input text dan tekan OK.

 

B. Melakukan Pengolahan Data pada Multimedia Interaktif

Bentuk pengolahan data pada multimedia interaktif di antaranya yaitu pembuatan form dan pembuatan skoring pada game.

1. Membuat Form dengan Adobe Flash

Adobe Flash dapat digunakan dalam bentuk form, misalnya form yang digunakan untuk menginputkan nilai yang kemudian akan menampilkan keterangan tuntas / tidak tuntas pada mata pelajaran tersebut. Langkah - langkah untuk membuat aplikasi tersebut adalah sebagai berikut :

a. Bukalah Adobe Flash kemudian pilih ActionScript 3.0

b. Buat user interface sistem akademik siswa yang berisi form untuk mengisi nama, kelas, dan nilai, serta tombol navigasi yang digunakan untuk mengecek ketuntasan nilai.

c. Form yang digunakan untuk mengisi nama, kelas, dan nilai menggunakan input text dengan instance name : input_nama, input_kelas, input_nilai. Untuk input text yang digunakan untuk memasukkan nilai, atur Emded kemudian pilih Numerals.

d. Buat user interface pada frame selanjutnya yang digunakan untuk menyampaikan nama, kelas, nilai, dan keterangan ketuntasan nilai. Form yang digunakan yaitu dynamic text dengan instance name : tampil_nama, tampil_kelas, tampil_nilai, dan tampil_ket. Berikan pula tombol navigasi yang digunakan untuk kembali ke halaman pertama.

e. Berikan ActionScript berikut pada frame 1 !

 

stop ( ) ;

var myText : string ;

var myText1 : String ;

 

var myText2 : String ;

var Nilai : Number ;

/ / function digunakan untuk menyimpan inputan yang telah dimasukkan function captureText ( ) : void  {

            myText = input_nama . text ;

            myText1 = input_kelas . text ;

            Nilai = Number (input_nilai . text ) ;

}

/ / function berikut digunakan untuk menentukan ketuntasan function keterangan ( ) : void  {

             if (Nilai < 75="" )="">

                  myText2= "Maaf nilai kamu belum tuntas" ;

                  }

             if (Nilai >= 75 ) {

                  myText2= "Nilai kamu sudah tuntas" ;

                  }

}

btn_cek.addEventListener (MouseEvent . CLICK , cekKetuntasan ) ;

function cekKetuntasan ( e : MouseEvent ) {

             captureText ( ) ;

             keterangan ( ) ;

             nextFrame ( ) ;

}

 

f. Kemudian berikan ActionScript berikut pada frame 2 !

 

stop ( ) ;

tampil_nama . text = myText ;

tampil_kelas . text = muText1 ;

tampil_nilai . text=String (Nilai) ;

tampil_ket . text= myText2 ;

btn_kembali . addEventListener ( MouseEvent . CLICK, home ) ;

function home ( e : MouseEvent ) {

        gotoAndStop (1) ;

}

 

g. Uji sistem tersebut dengan melakukan test movie.

 

2. Membuat Kuis Interaktif dengan Adobe Flash

Langkah - langkah pembuatan kuis pilihan ganda :

a. Buka Adobe Flash kemudian pilih ActionScript 3.0.

b. Buatlah user interface dan letakkan pada layer background.

c. Buatlah layer baru yang digunakkan untuk meletakkan soal dan jawaban kuis yang dibuat.

d. Isilah teks berupa soal pada frame 1.

e. Buatlah tombol jawaban A sampai E. Tombol dapat dibuat dengan menggunakan Rectangle Tools yang kemmudian di-convert menjadi symbol button.

f. Berikan masing - masing tombol dengan instance name sebagai berikut.

 

Tombol A = btn_a1

Tombol B = btn_b1

Tombol C = btn_c1

Tombol D = btn_d1

Tombol E = btn_e1

 

g. Buatlah teks pilihan jawaban.

h. Ulangi langkah d, f, dan g pada frame berikutnya. Untuk tombol jawaban, kamu dapat menggunakan tombol jawaban yang sudah dibuat sebelumnya. Kamu hanya cukup mengganti nama instance namenya.

i. Berikan ActionScript berikut pada frame 1 !

 

stop ( ) ;

var Nilai : Number=0 ;

btn_a1 . addEventListener ( MouseEvent . CLICK, a1 ) ;

function a1 ( e : MouseEvent ) {

        nextFrame ( ) ;

        }

btn_b1 . addEventListener ( MouseEvent . CLICK, b1 ) ;

function b1 (e : MouseEvent ) {

         Nilai += 25 ;

         nextFrame ( ) ;

         }

btn_c1 . addEventListener ( MouseEvent . CLICK, c1 ) ;

function c1 ( e : MouseEvent ) {

         nextFrame ( ) ;

         }

btn_d1 . addEventListener ( MouseEvent . CLICK, d1 ) ;

function d1 ( e  : MouseEvent ) {

         nextFrame ( ) ;

         }

btn_e1 . addEventListener ( MouseEvent . CLICK, e1 ) ;

function e1 ( e : MouseEvent ) {

         nextFrame ( ) ;

         }

 

Veriabel nilai digunakan untuk menyimpan nilai yang diperoleh. Setiap jawaban benar, nilai akan bertambah.

 

j. Lakukan hal yang sama pada frame 2 sampai dengan frame 4.

 

k. Pada frame 5, untuk menampilkan skor gunakan dynamic text. Berikan instance name tampil_score. Tambahkan tombol untuk mengulangi kuis.

Berikan Actionscript berikut :

 

 stop ( ) ;  

tampil_score . text=String (Nilai) ;

btn_ulang . addEventListener ( MouseEvent . CLICK, ulang ) ;

function ulang ( e : MouseEvent ) {

        gotoAndStop (1) ;

}

 

l. Lakukan pengujian !

 Berikut adalah contoh multimedia interaktif menggunakan Powtoon. Kalian bisa mencobanya dengan memasukkan alamat www.powtoon.com pada browser. Selamat mencoba.