BAB II TINJAUAN PUSTAKA

BAB II TINJAUAN PUSTAKA

Untuk membuat sebuah aplikasi multimedia, khususnya multimedia informasi untuk Universitas UPN “Veteran” Jawa Timur, penulis terlebih dahulu mempelajari sejarah singkat UPN “Veteran” Jawa Timur dan pemrograman Adobe Flash CS 5 dan juga dasar-dasar pengembangan program multimedia serta hal-hal mendasar yang terkait didalamnya, seperti teks, audio, grafis, animasi dan hal-hal yang bersifat teknis, misalnya perencanaan multimedia dan tahap-tahap penyusunan hingga siap untuk digunakan. Untuk mengetahui mengenai sejarah singkat UPN “Veteran” Jawa Timur dan teori-teori dasar yang menjadi landasan teori bagi penulis dalam penulisan ilmiah ini, akan dijelaskan dibawah ini.

2.1 Sejarah Singkat UPN “Veteran” Jawa Timur Universitas Pembangunan Nasional “Veteran” Jawa Timur merupakan salah satu lembaga pendidikan tinggi swasta di Indonesia yang didirikan oleh para pejuang kemerdekaan RI pada tanggal 5 Juli 1959, dengan nama Akademi Administrasi Perusahaan “Veteran” (AAPV) Surabaya. Mulai tanggal 1 April 1966 oleh kementrian Transmigrasi, Urusan Veteran dan Demobilisasi disatukan dalam Perguruan Tinggi Pembangunan Nasional (PTPN) “Veteran” Cabang Jawa Timur”. Pada tanggal 17 Mei 1968 Perguruan Tinggi Nasional (PTPN) “Veteran” Cabang Jawa Timur melakukan pemekaran

8

Hak Cipta © milik UPN "Veteran" Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.

9

menjadi 3 (tiga) Fakultas, yaitu Ekonomi, Pertanian dan Teknik Kimia. Berdasarkan Surat Keputusan Kementrian Transmigrasi, Urusan Veteran dan Demobilisasi No.062/KPTS/MENTRANVED/68 status PTPN “Veteran” Cabang Jawa Timur menjadi Perguruan Tinggi Kedinasan dibawah Departemen Pertahanan Keamanan RI berlangsung pada tahun 1976, yang selanjutnya pada tanggal 30 Juni 1978 terjadi perubahan nama menjadi Universitas Pembangunan Nasional “Veteran” Cabang Jawa Timur. Berdasarkan Surat Keputusan Menteri Pertahanan dan Keamanan Nomor : KEP/01/II/1993 tanggal 27 Februari 1993 tentang Penataan UPN “Veteran”. UPN “Veteran” Cabang Jawa Timur, yang semula di bawah UPN “Veteran” Yogyakarta, menjadi mandiri dan dipimpin oleh seorang Rektor sehingga namanya berubah menjadi UPN “Veteran” Jawa Timur. Berdasarkan keputusan Bersama Mendikbud dan Menhankam Nomor : Kep/0307/U/1994 – 10/XI/1994 tanggal 29 November 1994 tentang Peningkatan Pengabdian Universitas Pembangunan Nasional melalui Pelaksanaan Keterkaitan dan Kesepadanan telah dialihkan statusnya dari perguruan tinggi kedinasan menjadi perguruan tinggi swasta. UPN “Veteran” Jawa Timur sejak tahun 1993 memiliki 5 Fakultas dengan 16 Jurusan/ Program Studi (Progdi), yang telah terakreditasi BAN-PT. Sesuai dengan Instruksi Menteri Pertahanan dan Keamanan Nomor : Inst/01/II/1996 tanggal 6 Februari 1996 tentang Pelaksanaan Pelimpahan Wewenang dan Tanggung jawab Pembinaan Universitas Pembangunan Nasional “Veteran”, yang telah diserahkan pembinaannya kepada Yayasan Kejuangan Panglima Besar Sudirman (YKPBS) yag berkedudukan di bawah Departemen


10

Pertahanan Jl. Wachid Hasyim No. 7 Jakarta, yang juga membina SMU Unggulan Taruna Nusantara di Magelang. Berdasarkan SK Dirjen Dikti Nomor : 390/DIKTI/KEP/1999 telah dibuka Program Magister Manajemen Agribisnis (MMA), dan disusul kemudian dengan program Magister Manajemen Ekonomi (MM) dan Magister Akutansi (Mak) dengan ijin penyelenggaraan No. 2307/JD/T/2001 tanggal 4 Juli 2001. Mulai TA 2003/2004 menambah lagi satu program studi baru, yaitu Teknik Informatika di bawah Fakultas Teknologi Industri, dengan ijin Operasional No. 2140/D/T/2005 tanggal 11 Juli 2005 serta program studi Ilmu Hukum dengan ijin operasional Nomor : 183/D/T/2007 tanggal 30 Januari 2007. Referensi : Buku Pedoman Tri Dharma Perguruan Tinggi Tahun Akademik 2007/2008

2.2 Pengertian dan Tujuan Registrasi Registrasi adalah proses pendaftaran atau pencatatan untuk memperlancar dan mempermudah dalam proses pendataan data-data mahasiswa, sehingga dapat teroganisir, teratur dengan cepat dan tepat dengan beberapa persyaratan yang telah ditentukan oleh Universitas. Di Universitas UPN “Veteran” Jawa Timur, Registrasi merupakan salah satu proses administrasi akademik yang terdiri dari: a. Registrasi Administrasi Registrasi administrasi adalah layanan terhadap mahasiswa untuk memperoleh status terdaftar pada satu jenis program studi/jurusan tertentu


11

di UPN “Veteran” Jawa Timur. b. Registrasi Akademik Registrasi akademik adalah layanan terhadap mahasiswa untuk memperoleh hak dan ijin mengikuti perkuliahan pada suatu program studi/ jurusan tertentu di lingkungan UPN “Veteran” Jawa Timur. Kedua proses tersebut (a dan b), harus dilakukan baik oleh mahasiswa baru maupun mahasiswa lama dalam rangka memperoleh keabsahan dirinya sebagai mahasiswa untuk mengikuti kegiatan intra dan ekstra kurikuler serta kegiatan-kegiatan lainnya yang diselenggarakan di kampus UPN “Veteran” Jawa Timur. Registrasi bagi mahasiswa lama disebut registrasi ulang atau herregistrasi. Dan dilaporkan setiap awal semester selama belum dinyatakan lulus. Tujuan registrasi mahasiswa adalah untuk : a. Menghimpun data mahasiswa sehingga diperoleh gambaran yang valid tentang jumlah mahasiswa yang terdaftar dan berhak mengikuti program pendidikan di UPN “Veteran” Jawa Timur. b. Memberikan status terdaftar kepada mahasiswa, sehingga berhak menggunakan semua fasilitas yang ada di UPN “Veteran” Jawa Timur. c. Memantau penerimaan uang pembayaran SPP, UP (uang pangkal), registrasi. Referensi : Buku Pedoman Tri Dharma Perguruan Tinggi Tahun Akademik 2007/2008


12

2.3 Interaksi Manusia dan Komputer Dalam dunia programming, sering terdengar istilah “User Friendly” atau istilah WYSIWYG (“What you see is what you get”). Istilah ini digunakan untuk menunjuk kepada kemampuan yang dimiliki oleh perangkat lunak atau program aplikasi yang mudah dioperasikan dan mempunyai sejumlah kemampuan lain sehingga pengguna merasa betah dalam mengoperasikan program tersebut. Bahkan, bagi seorang pemula sekalipun tidak akan merasakan adanya kesulitan dalam mengoperasikan aplikasi tersebut. Prinsip kerja suatu komputer adalah input, proses, dan output. Tetapi, sebagian besar user tidak tahu atau bahkan tidak ingin tahu mengenai proses. User hanya ingin mengetahui input yang mereka masukkan dan output yang dikeluarkan sesuai dengan harapan. Kepuasan user merupakan hal yang paling penting dalam mengukur keberhasilan suatu program/aplikasi. Oleh karena itu, Interaksi Manusia dan Komputer adalah bagian yang harus diperhatikan. Interaksi Manusia dan Komputer mencakup beberapa bagian, di antaranya pemilihan warna, ragam dialog, tampilan, dan pemilihan peranti. Pemilihan warna, Penggunaan warna dalam tampilan informasi pada layar tampilan merupakan satu isu yang sangat menarik untuk diamati. Penggunaan warna yang sesuai dengan kegunaan aplikasi akan mempertinggi efektivitas tampilan grafis. Tetapi, jika digunakan dengan tidak mengindahkan aspek kesesuaian user, maka user justru akan menerima informasi yang salah. Ragam dialog, Ragam dialog yang akan dibahas disini adalah ragam dialog interaktif. Ragam dialog interaktif dikelompokkan menjadi beberapa kategori.


13

Pengelompokan ini tidak menutup kemungkinan adanya saling tumpang tindih antara kategori satu dengan kategori lain. Secara umum, ragam dialog interaktif dapat dikelompokkan menjadi 9 kategori, yaitu: a. Dialog berbasis perintah tunggal (command line dialogue) b. Dialog berbasis bahasa pemrograman (programming language dialogue) c. Antarmuka berbasis bahasa alami (natural language interface) d. Sistem menu e. Dialog berbasis pengisian borong (form filling dialogue) f. Antarmuka berbasis ikon g. Sistem penjendelaan (windowing system) h. Manipulasi langsung i. Antarmuka berbasis interaksi grafis Tampilan, merupakan salah satu kriteria penting dari sebuah antarmuka. Seorang pengguna, apalagi pengguna baru, biasanya tertarik untuk mencoba suatu program aplikasi karena terlebih dahulu tertarik pada tampilan dihadapan matanya. Oleh karena itu, suatu aplikasi harus disajikan dengan tampilan yang menarik. Pemilihan piranti interaktif, selain tampilan, pemilihan piranti interaktif juga perlu diperhatikan karena secanggih dan selengkap apapun program aplikasi yang dibuat, tidak akan berguna sama sekali apabila program tersebut tidak dapat dioperasikan pada komputer. Oleh karena itu, piranti interaktif, seperti contohnya keyboard atau mouse sangat diperlukan.


14

Referensi: Subakti, Irfan,

2006, http://www.scribd.com/doc/49645094/Interaksi-Manusia-

dan-Komputer, diakses 8 Oktober 2011,

2.3.1

8 Aturan Emas Desain User Interface

Shneiderman mengemukakan 8 (delapan) aturan yang dapat digunakan sebagai petunjuk dasar yang baik untuk merancang suatu user interface. Delapan aturan ini disebut dengan Eight Golden Rules of Interface Design, yaitu: a. Konsistensi Konsistensi dilakukan pada urutan tindakan, perintah, dan istilah yang digunakan pada prompt, menu, serta layar bantuan. b. Memungkinkan pengguna untuk menggunakan shortcut Ada kebutuhan dari pengguna yang sudah ahli untuk meningkatkan kecepatan interaksi, sehingga diperlukan singkatan, tombol fungsi, perintah tersembunyi, dan fasilitas makro. c. Memberikan umpan balik yang informatif Untuk setiap tindakan operator, sebaiknya disertakan suatu sistem umpan balik. Untuk tindakan yang sering dilakukan dan tidak terlalu penting, dapat diberikan umpan balik yang sederhana. Tetapi ketika tindakan merupakan hal yang penting, maka umpan balik sebaiknya lebih substansial. Misalnya muncul suatu suara ketika salah menekan tombol pada waktu input data atau muncul pesan kesalahannya.


15

d. Merancang dialog untuk menghasilkan suatu penutupan Urutan tindakan sebaiknya diorganisir dalam suatu kelompok dengan bagian awal, tengah, dan akhir. Umpan balik yang informatif akan memberikan indikasi bahwa cara yang dilakukan sudah benar dan dapat mempersiapkan kelompok tindakan berikutnya. e. Memberikan penanganan kesalahan yang sederhana Sedapat mungkin sistem dirancang sehingga pengguna tidak dapat melakukan kesalahan fatal. Jika kesalahan terjadi, sistem dapat mendeteksi kesalahan dengan cepat dan memberikan mekanisme yang sedehana dan mudah dipahami untuk penanganan kesalahan. f. Mudah kembali ke tindakan sebelumnya Hal ini dapat mengurangi kekuatiran pengguna karena pengguna mengetahui kesalahan yang dilakukan dapat dibatalkan, sehingga pengguna tidak takut untuk mengekplorasi pilihan-pilihan lain yang belum biasa digunakan. g. Mendukung tempat pengendali internal (internal locus of control) Pengguna ingin menjadi pengontrol sistem dan sistem akan merespon tindakan yang dilakukan pengguna daripada pengguna merasa bahwa sistem mengontrol pengguna. Sebaiknya sistem dirancang sedemikan rupa sehingga pengguna menjadi inisiator daripada responden. h. Mengurangi beban ingatan jangka pendek Keterbatasan ingatan manusia membutuhkan tampilan yang sederhana atau banyak tampilan halaman yang sebaiknya disatukan, serta diberikan cukup waktu pelatihan untuk kode, mnemonic, dan urutan tindakan.


16

Referensi: Wikipedia,

2011.

http://id.wikipedia.org/wiki/Interaksi_manusia-komputer,

diakses 8 Oktober 2011.

2.4 Pengertian Media Media berasal dari bahasa Latin dan merupakan bentuk jamak dari kata medium yang secara harfiah berarti perantara atau pengantar. Jadi dapat dipahami bahwa media adalah perantara atau pengantar dari pengirim ke penerima pesan. Selanjutnya akan diuraikan pengertian media menurut istilah. Para ahli di dalam memberikan batasan media berbeda-beda pendapat, tetapi arah dan tujuannya sama, yang tidak lepas dari kata medium. Menurut Santoso S. Hamidjojo dalam Amir Achsin (1980), media adalah semua bentuk perantara yang dipakai orang menyebar ide, sehingga ide atau gagasan itu sampai pada penerima. Sedangkan Assosiasi Teknologi dan Komunikasi (Association of Education and Communication Technology/ AECT) di Amerika memberi batasan yaitu: Media sebagai segala bentuk dan saluran yang digunakan orang untuk menyalurkan pesan/ informasi. Gagne (1970) menyatakan bahwa media adalah berbagai jenis komponen dalam lingkungan siswa yang dapat merangsang untuk belajar. Sementara Bringgs (1970) berpendapat bahwa media adalah segala alat fisik yang dapat menyajikan pesan serta merangsang siswa untuk belajar buku, film, kaset adalah contoh-contohnya. Selanjutnya Mc. Luhan dalam Arif S. Sadiman (1984) berpendapat bahwa media adalah sarana yang juga disebut


17

channel, karena pada hakekatnya media memperluas atau memperpanjang kemampuan manusia untuk merasakan, mendengarkan, dan melihat dalam batasbatas jarak, ruang, dan waktu yang hampir tak terbatas lagi. Dalam kaitannya dengan komunikasi interaksi dalam bentuk organisasi Dr. Oemar Hamalik (1994) berpendapat bahwa media komunikasi adalah suatu media atau alat bantu yang digunakan oleh suatu organisasi untuk mencapai efisiensi dan efektivitas kerja dengan hasil yang maksimal. Multimedia merupakan intergrasi dari teks, gambar, suara, animasi dan video yang disajikan secara interaktif. Multimedia merupakan salah satu cara untuk merepresentasikan informasi secara singkat dan terarah sehingga dapat dimengerti. Salah satu alasan mengapa multimedia menjadi sangat populer, karena multimedia menyajikan informasi dalam format tampilan yang menarik, dan direpresentasikan dalam satu media yang sudah mencakup beberapa eleman komunikasi yang mudah untuk dimengti. Referensi: Media Grafika, 2011, http://media-grafika.com/pengertian-media-pembelajaran, diakses 8 Oktober 2011

2.5 Pengertian Multimedia Suatu multimedia dikatakan interaktif apabila jenis multimedia tersebut melibatkan pengguna atau pemakai secara langsung, meskipun dalam hal ini penggunaan mouse, keyboard atau alat input lainnya.


18

Beberapa definisi menurut beberapa ahli: 1.

Kombinasi dari komputer dan video (Rosch, 1996).

2.

Kombinasi dari tiga elemen: suara, gambar, dan teks (McComick, 1996).

3.

Kombinasi dari paling sedikit dua media input atau output. Media ini dapat berupa audio (suara, musik), animasi, video, teks, grafik dan gambar (Turban dan kawan-kawan, 2002).

4.

Alat yang dapat menciptakan presentasi yang dinamis dan interaktif yang mengkombinasikan teks, grafik, animasi, audio dan video (Robin dan Linda, 2001).

5.

Multimedia dalam konteks komputer menurut Hofstetter 2001 adalah:

pemanfaatan

komputer

untuk

membuat

dan

menggabungkan teks, grafik, audio, video, dengan menggunakan tool yang memungkinkan pemakai berinteraksi, berkreasi, dan berkomunikasi. 6.

Rosa Rahmatika, Drs. Enjang Ali Nurdin, M.Kom, Drs. Parsaoran Siahaan, M.Pd (2010) : Multimedia ialah merupakan perpaduan antara berbagai media (format file) yang berupa teks, gambar (vector atau bitmap), grafik, sound, animasi, video, interaksi, dll yang telah dikemas menjadi file digital (komputerisasi), digunakan untuk menyampaikan pesan kepada publik aspek interaktif pada multimedia dapat berupa navigasi, simulasi, permainan dan latihan soal.


19

7.

Sedangkan menurut wikipedia.org : Multimedia is the use of several different media to convey information (text, audio, graphics, animation, video, and interactivity). Multimedia also refers to computer data storage devices, especially those used to store multimedia tent. Referensi : Shvoong,

2011,

http://id.shvoong.com/social-

sciences/education/2145958-multimedia-interaktif/,

diakses

8

Oktober 2011.

2.6 Pengertian Animasi dan Konsep Pembuatan Animasi Animasi merupakan suatu teknik menampilkan gambar berurut sedemikian rupa sehingga penonton merasakan adanya ilusi gerakan (motion) pada gambar yang ditampilkan. Secara umum ilusi gerakan merupakan perubahan yang dideteksi secara visual oleh mata penonton sehingga tidak harus perubahan yang terjadi merupakan perubahan posisi sebagai makna dari istilah 'gerakan'. Perubahan seperti perubahan warna pun dapat dikatakan sebuah animasi. 2.6.1

12 Prinsip Dasar Animasi

Untuk memahami 12 prinsip dasar animasi dapat dilihat dari sebuah gerak dan memahaminya secara berurutan. Kedua belas prinsip tersebut adalah: 1. Pose dan gerakan antara (Pose-To-Pose and Inbetween) Sebagai misal seseorang mengambil adegan orang berjalan dengan menggunakan kamera. Bentangkan film yang sudah jadi dan akan terlihat


20

rangkaian gambar yang berkesinambungan yang apabila diputar dengan kecepatan 24 frame per detik (film) atau 25 frame per detik (PAL) akan menghasilkan gambar bergerak. Terkadang sulit untuk langsung meng-copy semua gerakan pada tiap frame. Untuk mempermudah seorang animator akan membagi sekuens gerakan dalam 2 bagian, yaitu pose dan gerakan antara. Pose adalah gerakan paling ekstrim dari tiap gerakan yang ada dan inbetween adalah gerakan antara suatu pose ke pose lainnya. Pada animasi 2D key animator akan menggambar key pose. Lalu inbetween melanjutkan dengan membuat gerakan antara satu pose ke pose yang lainnya. 2. Pengaturan waktu (Timing) Dengan mengatur durasi gerakan, suatu karakter bisa terlihat berbeda dengan karakter yang lain. Walaupun posenya sama, tetapi dengan durasi gerak yang berbeda, maka ekspresi gerakan yang dihasilkan juga berbeda. Misalnya gerak lambat (jarak antar key pose cukup jauh), bergerak biasa, atau gerak cepat (jarak antar key pose lebih dekat). 3. Gerakan sekunder (Secondary Action) Gerakan sekunder adalah gerakan yang terjadi akibat gerakan yang lain dan merupakan satu kesatuan sistem yang tidak terpisahkan dari gerakan utama. Misalnya pada saat melangkah, tangan akan mengimbangi langkah kaki, pinggang akan ikut berputar dan badan akan ikut condong bergerak ke kiri dan ke kanan. Gerakan tersebut adalah akibat dari gerakan utama


21

yaitu langkah kaki yang terjadi akibat reaksi alamiah tubuh untuk tetap seimbang. Untuk menciptakan gerakan sekunder menambah gerak alami, gerakan sekunder tidak boleh melebihi gerakan utama. 4. Akselerasi (Ease In and Out) Setiap benda diam cenderung tetap diam dan setiap benda bergerak akan tetap bergerak kecuali mengalami percepatan atau akselerasi (hukum kelembaman Newton). Dari suatu pose yang diam ke sebuah gerakan akan terjadi percepatan dan dari gerakan sebuah pose akan terjadi perlambatan. 5. Antisipasi (Anticipation) Pada dasarnya semua gerakan akan terjadi dalam 3 bagian, bagian awal yang disebut antisipasi, gerakan itu sendiri dan gerakan akhir yang disebut gerakan penutup (follow through). Misalnya pada saat meloncat akan menekuk kedua kaki, membungkukkan badan dan menarik kedua tangan ke bawah, barulah kita meloncat. Gerakan pendahuluan inilah yang disebut antisipasi. Pada film animasi 2D sering kita melihat tokoh kartun yang menghilang dari layar dengan meninggalkan segumpal asap tebal. Sebelum lari tokoh tersebut memasang pose persiapan, kaki ditarik menjauh arah lari dan tangan merentang bersiap-siap melesat

lari dan

kemudian

tokoh

itupun

dan meninggalkan asap tebal.

6. Gerakan lanjutan dan perbedaan waktu gerak (Follow Through and Overlapping Action) Setiap benda yang bergerak akan cenderung tetap bergerak, bahkan setelah mendapat gaya yang menghentikannya (hukum kelembaman Newton).


22

Misalnya saat berlari dan tiba-tiba berhenti. Badan akan sedikit terlempar ke depan, sebelum akhirnya kembali ke titik seimbang. Perhatikan setiap gerakan yang dilakukan, maka akan menemukan dan merasakan "gerakan berlebih" pada setiap akhir gerakan yang dilakukan. Gerakan tersebut yang disebut sebagai gerak penutup (follow trough). Tidak semua gerakan terjadi atau berhenti pada saat yang bersamaan. Selalu ada selang waktu antara gerakan utama dengan gerakan sekunder. Seringkali gerakan-gerakan tersebut terasa bertintihan. Prinsip inilah yang dikenal sebagai overlapping action. Biasanya gerakan sekunder akan mengalami perbedaan waktu gerak (overlapping action). Jika seekor binatang bergerak, ekornya akan ikut bergerak, tetapi gerakan ekor tidak berhenti bersamaan dengan gerakan binatang tersebut, melainkan berhenti beberapa saat lebih panjang. 7. Gerakan melengkung (Arc) Pada saat menggelengkan kepala, gerakan yang dihasilkan adalah gerakan yang sedikit melengkung ke arah atas atau bawah yang membentuk lingkaran. Gerakan inilah yang disebut gerakan melengkung (arc) yang merupakan prinsip yang diterapkan pada animasi. 8. Dramatisasi gerakan (Exaggeration) Dramatisasi gerakan adalah tindakan mempertegas apa yang sedang dilakukan. Sering dilihat seorang aktor theater mendramatisasi atau melebihlebihkan aksi agar terlihat jelas oleh penonton. Saat marah sang aktor akan berkacak pinggang dan menuding-nuding lawannya.


23

Demikian pula saat tertawa, akan berkacak pinggang, menarik bagian atas tubuhnya ke belakang, mengangkat kepalanya ke atas, membuka mulut selebar-lebarnya dan akhirnya mengeluarkan suara tawa sedemikian kerasnya. 9. Elastisitas (Squash and Stretch) Hal penting yang harus dilakukan adalah setiap benda yang mengalami pelenturan tetap akan mempertahankan volumenya. Jika sebuah karet berubah volumenya, realitas yang ada akan hilang. 10. Penempatan di bidang gambar (Staging) Selain animasi yang bagus, cara menempatkan karakter dihadapan kamera juga mutlak diperlukan. Dengan menempatkan kamera atau karakter secara tepat, konsep yang diinginkan dapat terbaca dengan mudah oleh penonton. Prinsip yang paling penting adalah prinsip sinematography dan prinsip silluet yang terdapat pada bidang perfilman. Melihat silluet karakter (hanya pada bagian foreground vs background) juga memberikan ketegasan pose sebuah karakter. Jika silluet karakter terlihat ambigu atau tidak jelas, maka akan sulit bagi penonton untuk mencerna aksi yang dilakukan karakter. 11. Daya tarik karakter (Appeal) Setiap karakter dalam animasi haruslah mempunyai daya tarik yang unik, yang membedakannya dengan karakter yang lain. Bisa saja suatu karakter terlihat unik dari sisi desain, atau dari caranya menunjukkan ekspresi pribadinya.


24

12. Penjiwaan Karakter Kemampuan akting adalah hal yang harus dimiliki oleh setiap karakter animator. Akting memungkinkan animator menterjemahkan tingkah laku dan daya tarik karakter secara tepat, sehingga penonton merasakan apa yang dimaui oleh seorang animator, bahkan walaupun tanpa dialog sekalipun. Referensi : Warta Warga, 2007, http://wartawarga.gunadarma.ac.id/2009/11/pengertiananimasi-konsep-pembuatan-animasi/, diakses 8 Oktober 2011.

2.7 Adobe Flash CS 5 Software yang digunakan dalam pengembangan aplikasi ini salah satunya adalah Adobe flash CS5. Adobe Flash (Macromedia Flash) adalah platform multimedia yang digunakan untuk membuat animasi yang bisa dipadukan dengan video, grafik, dan sound. Flash sering digunakan untuk iklan, game dan broadcast. Baru-baru ini, software ini telah diposisikan sebagai alat untuk "Rich Internet Applications" ("RIA"). 2.7.1

Sejarah Singkat Adobe Flash CS5 Flash ditemukan seseorang bernama Jonathan Gay. Jon yang gemar

menulis game dan membuat animasi di computer serta menciptakan game Mac Airborne! tahun 1985, ketika masih duduk di bangku sekolah. Tahun 1993 mendirikan Future Wave Software dengan produk pertama SmartSketch. Inilah cikal bakal Macromedia Flash. Tahun 1995 SmartSketch berganti nama menjadi CelAnimator. Menjelang akhir 1995, FutureWave sempat mengalami masalah


25

finansial dan mencari pembeli. Tiga calon yang ketika itu didekatinya adalah John Warnock dari Apple, lalu juga Adobe dan Fractal Designs. Juli 1996 CelAnimator berubah nama kembali menjadi Future Splash Animator. Produk ini menimbulkan minat dikalangan industri. Tak kurang dari Microsoft yang menggunakan dan amat menyukainya. Disney juga sama. Ketika itu MSN ingin dibuat mengikuti model televisi, dan animasi-animasi full screen dibuat dengan Future Splash. Desember 1996, Macromedia yang sedang membujuk Disney agar memakai Shockwave—plugin browser untuk produk animatornya bernama Director— mendekati Jon. Akhirnya terjadilah deal dan Future Splash Animator berubah nama menjadi Flash 1.0. Ada desas-desus bahwa jika Macromedia membeli Future Wave, maka Microsoft akan mencaplok Macromedia. Ternyata dugaan tersebut tidak benar, karena Microsoft kemudian mengubah haluan dan menjadikan MSN lebih berbasis teks ketimbang televisi. Selanjutnya Flash 2 dirilis pertengahan 1997 dan mendapatkan pujian di mana-mana. Flash 3 dan Generator menyusul April 1998. Karena tekanan Adobe yang mempromosikan format SVG— Macromedia mengumumkan membuka format file *.swf bagi publik. Flash 4 dan 5 menyusul 1999 dan Juli 2000. Sementara itu semakin banyak software lain yang mendukung memainkan dan menghasilkan .swf,

antara lain QuickTime

dan CorelDRAW. Versi 5

menambahkan integrasi dengan XML, Generator, dan ActionScript. Penetrasi browser terus meningkat hingga kini mencapai 96%. Player Flash telah tersedia untuk berbagai platform: Windows, Mac, Unix, BeOS, hingga OS/2 dan PocketPC. Jonathan Gay kini bekerja sebagai developer untuk Macromedia. Adobe


Flash

26

(dahulu

bernama

Macromedia

Flash

dikarenakan Macromedia yang

merupakan produsen pembuat flash profesional kini telah merjer dengan adobe corp, perubahan terjadi pada macromedia flash series 9 menjadi Adobe Flah CS3 pada April 16, 2007 ) merupakan tool yang dikembangkan untuk membuat berbagai aplikasi berbasis internet. Pada awalnya, Flash yang dilengkapi bahasa pemrograman ActionScript digunakan oleh developer web untuk mendesain web menjadi lebih interaktif dengan berbagai macam animasi. Namun, kemudian Flash banyak digunakan untuk membuat aplikasi multimedia interaktif. Seperti iklan banner, intro film, CD interactive, hingga pembuatan dan animasi. Sebelum tahun 2005, Flash dirilis oleh Macromedia. Flash 1.0 diluncurkan pada tahun 1996 setelah Macromedia membeli program animasi vektor bernama FutureSplash. Versi terakhir yang diluncurkan di pasaran dengan menggunakan nama ‘Macromedia’ adalah adalah Macromedia Flash 8. Pada tanggal 3 Desember 2005 Adobe System mengakuisisi Macromedia dan seluruh produknya, sehingga nama Macromedia Flash berubah menjadi Adobe Flash. Referensi: Fauzi, Ridwan, 2011, http://www.ridwanfauzi.com/2011/sejarah-flash/, diakses 8 oktober 2011 2.7.2

Perkembangan Adobe Flash CS5

Berikut adalah sejarah perkembangan Flash: 1.

Jonathan Gay, Charlie Jackson, dan Michelle Welsh mengembangkan

SmartSketch pada tahun 1993. Aplikasi tersebut dibangun untuk menggambar dengan mode vektor.


27

2.

FutureSplash Animator sebagai versi awal Flash diperkenalkan pada bulan

April tahun1996 dengan kemampuan menggambar ditambah dengan timeline, sehingga dapat menghasilkan animasi. 3.

Macromedia Flash 1 diperkenalkan pada bulan November 1996.

Macromedia adalah re-branded dari FutureSplash Animator. 4.

Macromedia Flash 2 diperkenalkan pada bulan Jun 1997, dengan Flash

Player 2, sudah terdapat object library. 5.

Macromedia Flash 3 diperkenalkan pada bulan Mei 1998.dengan Flash

Player 3, fitur baru meliputi Movie Clip, integrasi dengan plug-in JavaScript, mengandungi objek tranferens dan Flash player yang berdiri sendiri. 6.

Macromedia Flash 4 diperkenalkan pada bulan Jun 1999, dengan Flash

Player 4, fitur baru meliputi variabel internal, kotak untuk input tulisan, pengembangan Action Script, dan streaming MP3. 7.

Macromedia Flash 5 diperkenalkan pada bulan Ogos 2000, dengan Flash

Player 5, dan telah memiliki Action Script 1.0. 8.

Macromedia Flash MX diperkenalkan pada tahun 2002, dengan Flash

Player 6. 9.

Macromedia Flash MX 2004 diperkenalkan pada bulan September 2003, dengan Flash Player 7, dan telah mendukung Action Script 2.0.

10.

Macromedia Flash 8 diperkenalkan pada bulan September 2005. Terdiri

dari : - Macromedia Flash Basic 8, yang memiliki fitur yang terbatas untuk menggambar, animasi, dan interaktiviti.


28

- Macromedia Flash 8 Professional dengan tambahan fitur yang fokus untuk tampilan yang lebih ekspresif, kualiti, video, dan multimedia. 11.

Adobe Flash CS3 diperkenalkan pada bulan April 2007. Ini versi pertama

Flash dibawah nama Adobe, Flash CS3 telah mendukung ActionScript3.0. 12.

Adobe Flash CS4 diperkenalkan pada bulan Oktober 2008. Memiliki fitur

baru Inverse Kinematik (bones), manipulasi objek 3D, animasi objek, engine teks yang lebih maju, dan pengembangan lebih jauh pada ActionScript 3.0. 13.

Adobe Flash Professional CS5 diperkenalkan pada bulan April 2010. Flash

CS5 Professional mencakup dukungan untuk penerbitan aplikasi iPhone. Namun, pada tanggal 8 April 2010 Apple mengubah ketentuan Lisensi Developer untuk secara efektif melarang penggunaan compiler Flash-ke-iPhone dan pada 20 April 2010, Adobe mengumumkan bahwa mereka akan membuat tidak ada tambahan investasi dalam penargetan iPhone dan iPad di Flash CS5. Fitur lain dari Flash CS5 adalah

new text engine (TLF), perbaikan lebih lanjut untuk invers

kinematika, dan Kode Cuplikan panel (Code Snippets panel). Referensi : Kursusprivat.com,

2011,

http://kursusprivat.com/2011/08/mengenal-flash/,

diakses 8 Oktober 2011.

2.7.3

Manfaat Menggunakan Adobe Flash CS5 Adobe Flash CS5 dirancang untuk membuat animasi pada halaman web

atau presentasi yang sederhana. Manfaat kita menggunakan Adobe Flash CS5 adalah sebagai berikut:


29

-

Dari segi pemrograman: Fitur pemrograman yang tidak terlalu

rumit, memungkinkan seorang programer pemula sekalipun dapat membuat situs web yang sederhana. -

Kapasitas

file

yang

dihasilkan

begitu

kecil,

sehingga

memungkinkan pembuatan animasi dan presentasi menjadi lebih ringkas. -

Pembuatan executeable file, dimana apabila file dijalankan tidak

diperlukan lagi keterlibatan penuh program pembangunnya yang dalam hal ini Adobe Flash CS5. ( Arief Sofyan, 2003 )

Gambar 2.1 Tampilan Adobe Flash CS 5

2.7.4

Elemen pada Adobe Flash CS5 Ada beberapa istilah – istilah umum dalam Adobe Flash CS5 berikut ini

beberapa istilah yang antinya sering dijumpai dalam program kerja Adobe Flash CS 5:


30

1.

Properties Istilah Properties dalam Program Flash adalah bagian yang digunakan untuk

memberikan perintah tambahan dari objek yang sedang dipilih. Tampilan dari Properties tidak sama, tergantung dari objek yang dipilih. 2.

Animasi Animasi adalah sebuah gerakan objek maupun teks yang diatur sedemikian

rupa agar terlihat menarik.

Animasi sangat menonjol pada program aplikasi

Adobe Flash CS5, karena pada program aplikasi ini animasi merupakan keunggulan dan sangat dibanggakan oleh para pemakai program aplikasi ini, khususnya para desainer web. Animasi merupakan kumpulan gambar yang ditampilkan secara bergantian, sehingga akan terlihat bergerak. Penggerakan dari animasi akan lebih mudah dicerna oleh pengguna jika dibandingkan dengan gambar diam. Animasi dibuat khusus untuk mendukung konsep ilustrasi yang mengharuskan

adegan

gambar

yang

bergerak.

Proses

animasi

adalah

menampilkan gambar demi gambar dalam satuan waktu. a. Cell Technique Cell technique digunakan dengan memanfaatkan serangkaian potongan gambar yang akan digunakan dalam animasi. Figur animasi digambar terpisah pada layer yang berbeda untuk tiap perubahan gambar yang bergerak. Karakter objek dibuat terpisah sehingga gerak dan karakter objek sangat terbatas. Biasanya karakter dipisah menjadi bagian-bagian seperti kepala, leher, badan, dua tangan dan dua kaki. Untuk menggerakkan dan


31

menghidupkan karakter, pemisahan dapat dilakukan sesuai dengan alur cerita, bisa kurang bisa lebih, sesuai yang dibutuhkan. b. Bone Tool Bone tool merupakan tool dalam Adobe CS5 yang memungkinkan membuat gerakan animasi tween selain menggunakan motion tween, shape tween, maupun classic tween. Sesuai namanya, dengan memakai konsep rangka, tool ini memungkinkan membuat animasi yang terdiri dari banyak objek yang menyambung satu per-satu menjadi satu objek dengan parameter perpindahan posisi dan rotasi pada setiap susunan bone tersebut. Sebuah gerakan animasi yang dulu dilakukan dengan classic tween yang terdiri banyak layer, maupun dengan teknik frame by frame, dapat dilakukan dengan bone tool dalam satu layer yang menghubungkan semua bagian-bagian tubuh objek karakter dengan menggunakan ekstreme position yang dalam bone disebut sebagai ‘pose’. 3.

Frame Frame merupakan suatu bagian dari layer yang digunakan untuk mengatur

pembuat animasi agar objek dapat bergerak seiring dengan waktu eksekusinya. 4.

Scene Scene jika di program Powerpoint sering disebut dengan slide, yaitu

layar yang digunakan untuk menyusun objek-objek baik tulisan maupun gambar. 5.

Time Line Time Line dapat diterjemahkan menjadi garis waktu, yaitu bagian dalam

program Adobe Flash yang berfungsi untuk menampung layer.


32

6.

Masking Masking adalah suatu perintah yang digunakan untuk menghilangkan isi dari

suatu layer dengan melapisinya dengan layer lain sehingga isi layer tersebut akan tampak saat movie dijalankan. 7.

Layer Layer adalah tempat yang digunakan untuk menampung suatu gerakan objek

sehingga masing-masing objek mempunyai tempat-tempat tersendiri agar lebih mudah untuk dimodifikasi tanpa mengganggu objek lainnya. 8.

Movie Animasi yang dibuat dalam Flash secara umum disebut dengan movie.

Dalam membuat animasi, maka seseorang akan mengatur jalan cerita dari animasi tersebut, membuat beberapa objek dan merangkainya menjadi suatu bagian yang bermakna tertentu. Suatu movie terkadang terdiri dari beberapa animasi yang biasa disebut movie clip. Clip-clip movie tersebut dapat dirangkai kembali menjadi movie baru. Suatu animasi/movie clip akan dijalankan dalam suatu scene yang dapat dianalogikan sebagai satu episode. 9.

Objek Animasi adalah suatu objek yang dapat bergerak. Oleh karena itu, Adobe

Flash menyediakan tool, seperti tool untuk menggambar garis, lingkaran, ataupun persegi empat yang dapat dikombinasikan sedemikian rupa oleh user agar dapat menghasilkan objek yang menarik.


33

10. Teks Aplikasi yang digunakan program aplikasi Adobe Flash CS5 merupakan bentuk siap pakai dan menampilkan informasi kepada pengguna dan sebagaian besar dalam bentuk teks. Teks tersusun dari beberapa simbol, abjad besar dan kecil, serta angka. Dalam komputer, simbol dapat merupakan susunan yang terpisah ataupun merupakan satu kesadaran dari abjad dan angka tersebut. Misalnya suatu kesatuan susunan simbol biasanya dinamakan huruf simbol. Suatu kesatuan susunan abjad, angka biasanya akan disertai oleh beberapa kumpulan simbol yang terbatas diberi nama sesuai bentuk hurufnya. Pada toolbox tersedia fasilitas untuk menulis teks. Pesan/teks dapat dibuat dalam bentuk animasi agar terlihat lebih menarik. Teks dalam Adobe Flash terdiri dari tiga tipe, yaitu static text, dynamic text, dan input text. 11. Sound Animasi yang dibuat dapat ditambah dengan sound agar tampak lebih menarik. Penambahan sound pada suatu movie akan memperbesar ukuran file. Format sound yang dapat digunakan dalam Adobe Flash diantaranya adalah WAV dan MP3. Sound dapat diimport dari luar, tetapi Macromedia Flash juga menyediakan beberapa jenis sound. 12. Simbol Sebuah objek dapat dijadikan simbol agar dapat digunakan dengan efektif. Simbol yang disediakan dalam Adobe Flash adalah movie clip, button, dan graphic. Masing-masing simbol mempunyai fungsi yang berbeda-beda. User


34

dapat memilih sesuai dengan kebutuhan masing-masing. 13. Library Library atau pustaka di dalam Adobe Flash berfungsi untuk menyimpan gambar, suara, tombol, movie clip, maupun teks yang digunakan dalam dokumen Flash yang sedang aktif. Isi dari library dapat di-import dari tempat lain dengan cara memilih File > Import to library. 14. Action Script ActionScript adalah bahasa pemograman yang digunakan didalam program flash yang berfungsi untuk memberikan perintah di dalam animasi flash. Dengan memahami prinsip penggunaan ActionSript yang biasa digunakan maka akan sudah dapat memanfaatkannya untuk berbagai keperluan. Untuk membuka panel ActionScript atau ingin memasukan Script caranya dengan mengklik Window > Action atau juga bisa dengan menekan tombol F9 pada keyword.

Gambar 2.2 Tampilan ActionScript Frame

Jumlah ActionScript yang terdapat pada flash sangatlah banyak, tapi tidak wajib untuk menghafalnya tetapi minimal telah mengetahui atau memahami


35

fungsi ActionScript tersebut. Selanjutnya akan membahas jenis - jenis ActionScript tersebut. Jenis ActionScript dalam flash dibagi menjadi 3 berdasarkan letak Script : 1. ActionScript pada frame ActionScript pada frame adalah Actionscript yang diletakan pada frame, atau juga sering disebut FrameScript. FrameScript ini hanya bisa dilakukan pada keyframe atau blankkeyframe untuk melihat frame yang telah diberikan script

Gambar 2.3 Tampilan FrameScript

tanda berupahurup 'a' kecil yang menandakan keberadaan sebuah Script. 2. ActionScript pada MovieClip ActionScript yang diletakan pada MovieClip sering disebut MovieScript yang harus diingat adalah untuk membuat MovieScript tentunya harus ada MovieClip tempat meletakan ActionScript tersebut. MovieClip memiliki bahasa (syntax) sebagai berikut. onClipEvent (event) { perintah }


36

Arti syntax movieScript diatas adalah : a) Kata 'onClipEvent' menunjukan bahwa perintah ini ditujukan untuk

MovieClip tempat diletakannya Script. b) kata 'event' menunjukan event yang terjadi pada movieClip tersebut,

sebenarnya Event di MovieClip ada 9 diantaranya :load, enterFrame, unload, Mouse up, Mouse Down,Key down, Key up, dan data. Namun diantara semua itu yang sering digunakan yaitu load dan enter Frame. c) Kata 'perintah' menunjukan perintah yang dapat diberikan pada MovieClip

tersebut. 3. ActionScript pada Button Hal yang perlu diingat yaitu ActionScript pada button tentunya harus ada Button tempat meletakan ActionScript tersebut. Secara umum syntax yang digunakan dalam penulisan ActionScript pada Button hampir sama dengan penulisan MovieScript. Perhatikan syntax berikut ini : On (event){ perintah } Arti syntax movieScript diatas adalah : a) Kata 'on' menunjukan bahwa perintah ini ditujukan untuk MovieClip

tempat diletakannya script dan ini merupakan syarat utama untuk script yang digunakan pada Button. Kata 'event' menunjukan event yang terjadi pada Button tersebut ada 7 event yang terdapat pada button yaitu press, release, rollOver, rollOut, dragOver,


37

dragOut, dan keypress. Meski demikian hanya dua event yang sering digunakan yaitu press dan release. Referensi: Perpustakaan Universitas Pendidikan Indonesia, Media Pembelajaran Interakif Berbasis Program Flash

2.8 Perancangan Tampilan Sebelum menyatukan semua komponen-komponen yang digunakan dalam multimedia diharuskan mendefinisikan obyek-obyek dan merancang tampilan layar agar semua yang berada dalam suatu tampilan tidak menimbulkan kerancuan informasi. Setiap tampilan harus dapat memberikan informasi yang bulat dan utuh sehingga dapat tercapai tujuan pembuatan multimedia. Menyatukan semua elemen-elemen yang digunakan dalam multimedia diharuskan mendefinisikan obyek-obyek dan merancang tampilan layar agar semua yang berada dalam suatu tampilan tidak menimbulkan kerancuan informasi. Setiap tampilan harus dapat memberikan informasi yang bulat dan utuh, sehingga dapat tercapai tujuan pembuatan aplikasi.

2.8.1

Struktur Navigasi Struktur navigasi digunakan sebagai penuntun alur sebuah aplikasi

multimedia atau dapat pula dianalogikan sebagai diagram alur dalam perancangan bahasa pemrograman. Struktur navigasi berfungsi untuk menggambarkan dengan


38

jelas hubungan dan rantai kerja seluruh elemen yang akan digunakan dalam aplikasi. Dengan penggambaran struktur navigasi, pembuatan sebuah aplikasi dapat sistematis dan mudah. Jenis struktur navigasi dikelompokkan menjadi 4 struktur yang berbeda yaitu linier, hirarki, non linier dan campuran yang mempunyai perbedaan dalam bentuk rangkaiannya: a. Linear Linear merupakan struktur yang hanya mempunyai satu rangkaian cerita yang berurut. Struktur ini menampilkan satu demi satu tampilan layar secara berurut menurut urutannya dan tidak diperbolehkan adanya percabangan. Tampilan yang dapat ditampilkan adalah satu halaman sebelumnya atau satu halaman sesudahnya.

Gambar 2.4 Navigasi Linear

b. Hirarki Struktur hirarki merupakan suatu struktur yang mengandalkan percabangan untuk menampilkan data berdasarkan kriteria tertentu. Tampilan pada menu pertama akan disebut sebagai Master Page, halaman utama ke satu. Halaman utama ini akan mempunyai halaman percabangan yang dikatakan Slave Page, halaman pendukung. Jika salah satu halaman pendukung diaktifkan, maka tampilan tersebut akan


39

bernama Master Page, halaman

utama

kedua. Pada struktur

penjejakan ini tidak diperkenankan adanya tampilan secara linear.

Gambar 2.5 Navigasi Hirarki c. Non-Linear Pada penjejakan

struktur

non-linear

bercabang.

diperkenankan

Percabangan

ini

berbeda

membuat dengan

percabangan pada struktur hirarki. Pada percabangan non-linear walaupun

terdapat

percabangan

tetapi

tiap-tiap

tampilan

mempunyai kedudukan yang sama tidak ada pada master page dan slave page.

Gambar 2.6 Navigasi Non-Linear


40

d. Campuran (Composite) Struktur penjejakan campuran merupakan gabungan dari ketiga struktur sebelumnya. Struktur penjejakan ini banyak digunakan dalam pembuatan website sebab dapat memberikan keinteraksian yang lebih tinggi.

Gambar 2.7 Navigasi Campuran Referensi : Gunadarma,

2011,

http://papers.gunadarma.ac.id/index.php/mi/article/

view/1192/1149, diakses 8 Oktober 2011

2.9 Desain Antarmuka Antarmuka adalah bagian dari program yang berhubungan langsung dengan pemakai, yaitu segala sesuatu yang muncul pada layar monitor. Desain antarmuka bertujuan agar program yang akan dibuat terlihat bentuk awalnya, sehingga akan memudahkan dalam menentukan letak dari masing-masing objek dan elemen yang dimasukkan dalam proses penggabungan elemen. Storyboard digunakan untuk membuat disain antarmuka. Storyboard merupakan sketsa disain yang lebih mendetail dari setiap gambar, teks animasi dan komponen lainnya. Contoh dari storyboard yang sangat detail adalah storyboard yang menggambarkan semua yang tampak pada layar monitor, yaitu


41

meliputi teks, gambar belakang, gambar depan, letak dan bentuk tombol serta posisi animasi video. Pada storyboard, selain digambarkan rekaan dari tampilan akhir yang diinginkan, juga dituliskan penjelasan dan spesifikasi dari setiap layar. Dalam pembuatan storyboard, rancangannya tetap mengikuti rancangan peta navigasi. Dengan demikian setiap tahapan disain menjadi lebih terarah. Referensi: Wikipedia, 2011, http://id.wikipedia.org/wiki/Papan_cerita/, diakses 8 Oktober 2011.

2.10 UML (Unified Modelling Language) Unified Modelling Language (UML) adalah sebuah "bahasa" yang telah menjadi

standar

dalam

industri

untuk

visualisasi,

merancang

dan

mendokumentasikan sistem piranti lunak. UML menawarkan sebuah standar untuk merancang model sebuah sistem. Dengan menggunakan UML dapat membuat model untuk semua jenis aplikasi piranti lunak, dimana aplikasi tersebut dapat berjalan pada piranti keras, sistem operasi dan jaringan apapun, serta ditulis dalam bahasa pemrograman apapun. Seperti

bahasa-bahasa

lainnya,

UML

mendefinisikan

notasi

dan

syntax/semantik. Notasi UML merupakan sekumpulan bentuk khusus untuk menggambarkan berbagai diagram piranti lunak. Setiap bentuk memiliki makna tertentu, dan UML syntax mendefinisikan bagaimana bentuk-bentuk tersebut dapat dikombinasikan. Notasi UML terutama diturunkan dari 3 notasi yang telah


42

ada sebelumnya: Grady Booch OOD (Object-Oriented Design), Jim Rumbaugh OMT (Object Modeling Technique), dan Ivar Jacobson OOSE. 2.10.1 Use Case Diagram Use case diagram menggambarkan fungsionalitas yang diharapkan dari sebuah sistem. Yang ditekankan adalah “apa” yang diperbuat sistem, dan bukan “bagaimana”. Sebuah use case merepresentasikan sebuah interaksi antara aktor dengan sistem. Use case merupakan sebuah pekerjaan tertentu, misalnya login ke sistem, meng-create sebuah daftar belanja, dan sebagainya. Seorang/sebuah aktor adalah sebuah entitas manusia atau mesin yang berinteraksi dengan sistem untuk melakukan pekerjaan-pekerjaan tertentu. Use case diagram dapat sangat membantu bila kita sedang menyusun requirement sebuah sistem, mengkomunikasikan rancangan dengan klien, dan merancang test case untuk semua feature yang ada pada sistem. Sebuah use case dapat meng-include fungsionalitas use case lain sebagai bagian dari proses dalam dirinya. Secara umum diasumsikan bahwa use case yang di-include akan dipanggil setiap kali use case yang meng-include dieksekusi secara normal. Sebuah use case dapat di-include oleh lebih dari satu use case lain, sehingga duplikasi fungsionalitas dapat dihindari dengan cara menarik keluar fungsionalitas yang common. Sebuah use case juga dapat meng-extenduse case lain dengan behaviour-nya sendiri. Sementara hubungan generalisasi antar use case menunjukkan bahwa use case yang satu merupakan spesialisasi dari yang lain.


43

Gambar 2.8 Contoh Use Case Diagram 2.10.2 Sequence Diagram Sequence diagram menggambarkan interaksi antar objek di dalam dan di sekitar sistem (termasuk pengguna, display, dan sebagainya) berupa message yang digambarkan terhadap waktu. Sequence diagram terdiri atar dimensi vertikal (waktu) dan dimensi horizontal (objek-objek yang terkait). Sequence diagram biasa digunakan untuk menggambarkan skenario atau rangkaian langkah-langkah yang dilakukan sebagai respons dari sebuah event untuk menghasilkan output tertentu. Diawali dari apa yang men-trigger aktivitas tersebut, proses dan perubahan apa saja yang terjadi secara internal dan output apa yang dihasilkan. Masing-masing objek, termasuk aktor, memiliki lifeline vertikal. Message digambarkan sebagai garis berpanah dari satu objek ke objek lainnya. Pada fase desain berikutnya, message akan dipetakan menjadi operasi/metode dari class. Activation bar menunjukkan lamanya eksekusi sebuah proses, biasanya diawali dengan diterimanya sebuah message. Untuk objek-objek yang memiliki sifat khusus, standar UML mendefinisikan icon khusus untuk objek boundary, controller dan persistent entity. Contoh sequence diagram :


44

Gambar 2.9 Contoh Sequence Diagram

Referensi: Sri Dharwiyanti, Pengantar Unified Modeling Language (UML), 2003


BAB III ANALISIS DAN PERANCANGAN SISTEM

Proses pembuatan aplikasi ini dengan program aplikasi adobe Flash CS 5 ini dibagi dalam beberapa tahapan. Tahapan-tahapan tersebut dikerjakan secara berurutan dan berkesinambungan agar hasilnya dapat lebih baik. Dalam pembahasan masalah ini yang akan dibahas adalah mengenai analisa dan perancangan sistem dari mulai menentukan kebutuhan sistem, analisis sistem, desain sistem sampai teknik pengumpulan data.

3.1 Analisis Kebutuhan Sistem Pada sistem aplikasi ini dibutuhkan adanya analisa kebutuhan sehingga aplikasi yang dibuat sesuai dengan tujuan. Dalam hal ini ada dua kebutuhan yang perlu didefinisikan yaitu kebutuhan fungsionalitas sistem dan kebutuhan nonfungsionalitas dari sistem tersebut. Berikut ini adalah pendefinisian analisa kebutuhan yang menjadi pokok utama dalam perancangan aplikasi sistem informasi akademik ini. 3.1.1

Kebutuhan Fungsionalitas Kebutuhan Fungsionalitas ini adalah apa yang bisa dilakukan oleh sistem

kepada user / service apa saja yang tersedia pada sistem, (Software Engineering : Shari Lawrence pfleeger, Joanne M. Atlee) disini adalah lebih ke fitur sistem yang ada pada aplikasi sistem informasi ini dan bisa dieksekusi langsung atau dirasakan oleh user, berikut adalah fitur – fitur tersebut:

45


46

a. Melihat informasi singkat tentang tujuan aplikasi. Fungsionalitas ini bertujuan untuk memberikan informasi singkat tentang tujuan dari aplikasi ini. Informasi ini berada di halaman awal “Home” dari aplikasi. Perancangan skenario awalnya ialah ketika user menjalankan aplikasi ini maka sistem akan menampilkan tampilan utama dari sistem ini. b. Melihat informasi tentang berbagai macam informasi yang disediakan. Fungsionalitas ini adalah inti daripada aplikasi sistem informasi akademik yang dibuat. Perancangan skenario awalnya ialah ketika user sudah berada pada halaman “Home” sistem akan menampilkan tombol “Menu” yang bisa dipilih oleh user. Di dalam tombol tersebut akan menampilkan berbagai pilihan informasi akademik tentang registrasi. c. Melihat informasi tentang Profil Universitas. Fungsionalitas ini bertujuan untuk memberikan informasi singkat tentang Profil Universitas “Veteran” Jatim. d. Melihat informasi tentang Kontak Universitas. Fungsionalitas ini bertujuan untuk memberikan informasi singkat tentang Kontak Universitas “Veteran” Jatim apabila ada pengguna yang ingin bertanya melalui email ke Universitas mengenai informasi yang ada di dalam aplikasi sistem informasi akademik tersebut. 3.1.2

Kebutuhan Non-Fungsionalitas Kebutuhan Non – fungsionalitas ini mendeskripsikan beberapa kualitas

software yang dimiliki oleh suatu software atau aplikasi. (Software Engineering : Shari Lawrence pfleeger, Joanne M. Atlee).


47

Berikut adalah kebutuhan non-fungsionalitas dari aplikasi ini : a. Usability Aplikasi yang dibuat akan memudahkan penggunanya untuk menggunakannya. Karena tampilan antarmuka pada aplikasi dibuat sesederhana mungkin, dengan warna tulisan dan tombol yang mudah dilihat dan peletakkan tombol yang mudah dilihat juga. Selain itu terdapat prakata pada saat aplikasi mulai dijalankan yang dapat membantu pengguna mengerti tujuan dari aplikasi yang dibuat. Sehingga pengguna tidak perlu bertanya bagaimana cara menggunakan aplikasi tersebut. b. Portability Aplikasi ini dibuat dengan menggunakan Adobe Flash, tetapi dengan format akhir .exe sehingga nantinya bisa digunakan diberbagai komputer dengan operasi sistem yang berbeda, meskipun tidak memiliki flash player.

3.2 Analisis Sistem Pada tahap analisis sistem aplikasi sistem informasi akademik, pemodelan dengan UML digunakan untuk mengidentifikasi serta menganalisa sistem dan kebutuhan sistem yang diperlukan agar dalam proses pembuatan program menjadi lebih baik, efisien dan terarah. Untuk menganalisa permasalahan dimodelkan dalam diagram Use Case, tujuannya untuk mengamati bagaimana perilaku sistem yang diinginkan dilihat dari sudut pandang pengguna (User).


48

3.2.1

Use Case Diagram ini dibuat untuk mengetahui apa saja yang bisa dilakukan user

terhadap sistem aplikasi sistem informasi akademik ini. Berikut adalah Use Case:

Gambar 3.1 Use Case Aplikasi

3.2.2

High Level Use Case Pada tahap ini akan dideskripsikan secara singkat tetntang proses utama

dari aplikasi media informasi akademik registrasi berbasis Flash di UPN “Veteran” Jatim yang dibuat. High Level Use Case ini digunakan untuk menjelaskan Nama Proses, Pelaku (aktor) yang terlibat dengan fungsionalitas tersebut, dan deskripsi dari proses tersebut. Berikut High Level Use Case dari setiap Fungsionalitas:


49

a. Melihat informasi tentang tujuan aplikasi Tabel 3.1 High Level Informasi Tujuan Aplikasi Nama proses

Melihat informasi tentang tujuan aplikasi

Aktor

End user (Mahasiswa)

Deskripsi

Dengan mengklik open pada aplikasi maka aplikasi akan menampilkan tampilan awal, dan user akan langung masuk pada halaman “Home” dan pada halaman “Home” terdapat infromasi tentang tujuan aplikasi.

b. Melihat informasi berbagai macam registrasi Tabel 3.2 High Level Informasi Registrasi Nama proses

Melihat informasi berbagai macam registrasi

Aktor


Deskripsi

Pada halaman awal “Home” terdapat pilihan menu (Home, Menu, Profile dan Contact). Dengan memilih tombol “Menu” pada halaman awal setelah aplikasi dijalankan maka user akan masuk pada halaman “Menu” yang didalamnya terdapat berbagai pilihan informasi tentang informasi registrasi yang disediakan, dan jika di klik maka user

akan

langsung

masuk

pada

informasi

registrasi sesuai dengan menu yang dipilih.


50

c. Melihat informasi tentang profil Universitas Tabel 3.3 High Level Profil Universitas Nama proses

Melihat informasi tentang profil Universitas

Aktor


Deskripsi

Pada halaman awal “Home” terdapat pilihan menu (Home, Menu, Profile dan Contact). Dengan memilih tombol “Profile” pada halaman awal maka user akan masuk pada halaman “Profile” yang didalamnya terdapat informasi tentang profil Universitas UPN “Veteran” Jatim.

d. Melihat informasi tentang kontak Universitas Tabel 3.4 High Level Kontak Universitas Nama proses

Melihat informasi tentang kontak Universitas

Aktor


Deskripsi

Pada halaman awal “Home” terdapat pilihan menu (Home, Menu, Profile dan Contact). Dengan memilih tombol “Contact” pada halaman awal maka user akan masuk pada halaman “Contact” yang didalamnya terdapat informasi tentang kontak Universitas

UPN

“Veteran”

Jatim

dimana

mahasiswa bisa mengirimkan email melalui alamat yang tersedia.


51

3.2.3

Expanded Use Case Expanded Use Case ini adalah untuk mendeskripsikan yang lebih rinci

tentang semua proses yang digunakan pada aplikasi sistem informasi akademik. Tahap ini berguna untuk mempermudah dalam perancangan sistem dan pada tahap pengujian sistem apakah sistem yang dibuat sesuai dengan Expanded Use Case atau tidak. Berikut adalah analisa Expanded Use Case dari setiap fungsionalitas :

a.

Melihat informasi tentang tujuan aplikasi Tabel 3.5 Expanded Use Case Informasi Tujuan Aplikasi Use case

Melihat informasi tentang tujuan aplikasi

Tujuan

Untuk menampilkan informasi tentang tujuan aplikasi

Primary actor

End User (mahasiswa)

Secondary actor Deskripsi langkah utama

Langkah Aksi 1. Use Case ini dimulai ketika user menjalankan aplikasi 2. Aplikasi menampilkan halaman awal “Home” yang terdapat informasi tentang tujuan aplikasi.


52

b. Melihat informasi berbagai macam registrasi Tabel 3.6 Expanded Use Case Informasi Registrasi Use case

Melihat informasi berbagai macam registrasi

Tujuan

Untuk menampilkan informasi berbagai macam registrasi yang disediakan

Primary actor


Secondary actor Deskripsi langkah utama

Langkah Aksi 1. Use Case ini dimulai ketika user menjalankan aplikasi 2. Aplikasi menampilkan halaman awal “Home”. Pada halaman tersebut terdapat pilihan “Home, Menu, Profile, Contact” 3. User mengklik tombol “Menu” 4. Sistem menampilkan beberapa pilihan informasi registrasi 5. User

mengklik

salah

satu

pilihan

informasi registrasi 6. Sistem menampilkan informasi registrasi yang telah dipilih.


53

c. Melihat informasi tentang profil Universitas Tabel 3.7 Expanded Use Case Profil Universitas Use case

Melihat informasi tentang profil Universitas

Tujuan

Untuk

menampilkan

informasi

tentang

profil

Universitas Primary actor


Secondary actor Deskripsi langkah Langkah Aksi utama

1. Use

Case

ini

dimulai

ketika

user

halaman

awal

menjalankan aplikasi 2. Aplikasi

menampilkan

“Home”. Pada halaman tersebut terdapat pilihan “Home, Menu, Profile, Contact” 3. User mengklik tombol “Profile” 4. Sistem menampilkan informasi Profil UPN

d. Melihat informasi tentang kontak Universitas Tabel 3.8 Expanded Use Case Kontak Universitas Use case

Melihat informasi tentang kontak Universitas

Tujuan

Untuk

menampilkan informasi

tentang

kontak

Universitas Primary actor


Secondary actor Deskripsi langkah Langkah Aksi utama

1. Use

Case

ini

dimulai

ketika

user

halaman

awal

menjalankan aplikasi 2. Aplikasi

menampilkan

“Home”. Pada halaman tersebut terdapat pilihan “Home, Menu, Profile, Contact” 3. User mengklik tombol “Contact” 4. Sistem

menampilkan

informasi

kontak UPN “Veteran” Jatim


tentang

54

3.3 Desain Sistem Desain sistem adalah berorientasi objek dan terdiri dari Sequence diagram dan desain antarmuka (interface). Sequence diagram menunjukkan secara lebih terpirinci bagaimana pengguna berinteraksi dengan sistem dan cara sistem menulis dan mengambil data tertentu. Diagram berbasis struktural akan menunjukkan bagaimana setiap antarmuka terhubung dan pengguna yang menggunakannya. Dalam tahap ini bertujuan untuk merancang solusi dari permasalahan yang telah dianalisa sebelumnya dan memberikan suatu model diagram yang lebih terperinci sebagai acuan dalam proses pembuatan sistem. 3.3.1

Diagram Sequence Pada diargram sequence ditunjukkan bahwa user sebagai aktor utama bagi

aplikasi sistem informasi yang dapat melihat informasi yang tersedia di dalam aplikasi sesuai dengan yang di pilih. Diagram sequence dibutuhkan dalam pembuatan sebuah aplikasi untuk memperjelas sebuah aktor yang melakukan perintah kepada sistem. Diagram sequence aplikasi sistem informasi dapat dilihat pada gambar:

Sistem : User 1. melihat informasi tentang tujuan aplikasi

2. melihat informasi berbagai macam registrasi

3. melihat informasi tentang kontak

4. melihat informasi tentang profil UPN

Gambar 3.2 Diagram Sequence Aplikasi


55

3.4 Peta Navigasi Peta navigasi adalah struktur yang penting dari pembuatan multimedia. Karena peta ini yang akan menjadi arah dan acuan dari aplikasi yang dibuat. Pada aplikasi akademik ini struktur navigasi yang digunakan adalah struktur navigasi hirarki.

Gambar 3.3 Peta Navigasi 3.5 Perencanaan Design Interface harus dilakukan pada proses pembuatan aplikasi multimedia, karena bertujuan agar aplikasi yang dibuat terlihat sederhana, menarik dan mudah dimengerti sesuai dengan ilmu Interaksi Manusia dan Komputer, sehingga pengguna tidak akan merasa bosan dan jenuh. Untuk melakukannya digunakanlah storyboard. Storyboard merupakan gambaran umum dari tampilan suatu aplikasi pada layar secara detail. Dalam storyboard digambarkan semua elemen yang akan


56

tampil pada layar seperti letak dan ukuran teks, animasi, desain gambar, posisi tombol dan gambar atau warna background. Storyboard disusun secara berurutan dari layar pembuka hingga penutup dengan mengikuti rancangan peta navigasi. Sehingga kesalahan dalam pembuatan program tidak terjadi. Berikut ini adalah rancangan storyboard dari aplikasi sistem informasi akademik kampus berbasis multimedia flash.

3.5.1

Storyboard Interface

Gambar 3.4 Storyboard Halaman Home

Pada storyboard ini menggambarkan tampilan halaman awal dari aplikasi yang ditampilkan. Didalamnya terdapat text, gambar, dan tombol. Tombol 1 untuk kembali ke halaman Home, tombol 2 untuk pindah ke halaman Menu, tombol 3 pindah ke halaman Contact, tombol 4 untuk pindah ke halaman Profile.


57

Gambar 3.5 Storyboard Halaman Menu

Pada storyboard ini menggambarkan tampilan halaman Menu dari aplikasi yang ditampilkan. Didalamnya terdapat text, gambar, dan tombol. Tombol 1 untuk kembali ke halaman Home, tombol 2 untuk pindah ke halaman Menu, tombol 3 pindah ke halaman Contact, tombol 4 untuk pindah ke halaman Profile. Tombol 5 sampai tombol 12 untuk masuk ke halaman Registrasi.

Gambar 3.6 Storyboard Halaman Contact

Pada storyboard ini menggambarkan tampilan halaman Contact dari aplikasi yang ditampilkan. Didalamnya terdapat text, gambar, dan tombol. Tombol 1 untuk kembali ke halaman Home, tombol 2 untuk pindah ke halaman Menu,


58

tombol 3 pindah ke halaman Contact, tombol 4 untuk pindah ke halaman Profile.

Gambar 3.7 Storyboard Halaman Profile

Pada storyboard ini menggambarkan tampilan halaman Profile dari aplikasi yang ditampilkan. Didalamnya terdapat text, gambar, dan tombol. Tombol 1 untuk kembali ke halaman Home, tombol 2 untuk pindah ke halaman Menu, tombol 3 pindah ke halaman Contact, tombol 4 untuk pindah ke halaman Profile.

3.5.2

Storyboard Animasi

Dalam membuat animasi yang bertemakan tentang Registrasi di kampus UPN “Veteran” Jatim ini harus dibuat perencanaan terlebih dahulu agar dalam mengerjakan Animasi tersebut lebih mudah terlaksana dan mencapai hasil yang maksimal dan sesuai prosedur registrasi. Dari ide atau perencanaan tersebut penulis akan menguraikan langkah-langkahnya. 1. Mencari Ide Sebelum penulis mengerjakan langkah-langkah dari pembuatan animasi tersebut, penulis berusaha untuk memperluas wawasan seperti halnya dengan banyak membaca buku tentang animasi dan pembuatan obyek-obyek dalam


59

bentuk animasi, disamping itu penulis juga melihat hasil karya dari animasi yang telah di-upload di Internet, yang dapat digunakan sebagai panduan dalam pembuatan animasi tersebut, serta menjadikan Penulis mempunyai banyak ide untuk membuat animasi tersebut. 2. Menyusun Storyboard Setelah penulis mendapatkan ide dalam pembuatan animasi ini Penulis menyusunnya ke dalam suatu kertas yang masih berbentuk storyboard yaitu gambaran tentang urutan jalannya cerita yang akan dibuat dalam program Adobe Flash CS 5. 3. Mencari dan Membuat Audio Setelah Penulis membuat storyboard dan membuat animasinya Penulis mencari audio atau suara yang sesuai untuk animasi yang sedang dibuat, karena audio atau suara merupakan unsur yang paling penting dalam pembuatan sebuah animasi dan agar terlihat lebih hidup dan menarik. 4. Storyboard Langkah pertama yang dibuat dalam pembuatan animasi yang bertemakan registrasi di kampus UPN “Veteran” Jatim adalah storyboard, berikut ini merupakan storyboard dari animasi tersebut adalah:

a. Animasi Registrasi Mahasiswa Baru b. Animasi Registrasi PKL c. Animasi Registrasi Tugas Akhir d. Animasi Registrasi KRS


60

e. Animasi Registrasi UTS/UAS f. Animasi Registrasi SPP/ SKS g. Animasi Registrasi Bahasa h. Animasi Registrasi Perpustakaan

3.6 Teknik Pengumpulan Data Beberapa teknik pengumpulan data dapat digunakan dalam pengidentifikasian kondisi eksisting antara lain : Studi Literatur, Wawancara dan Observasi. Teknik – teknik tersebut digunakan untuk saling melengkapi sehingga informasi yang diharapkan dan diperlukan dari data dapat ditangkap/dimengerti dengan baik. Berikut pembahasan lebih lanjut mengenai teknik – teknik pengumpulan data:

a. Studi Pustaka Dalam melakukan studi ini, Penulis membaca buku “Pedoman Tri Dharma Perguruan Tinggi Tahun Akademik 2007/2008” yang dicetak oleh Universitas Pembangunan Nasional “Veteran” Jawa Timur. Di dalam buku tersebut terdapat berbagai macam informasi yang dibutuhkan dalam perancangan aplikasi sistem informasi akademik ini.

b. Wawancara Setelah melakukan studi literatur, penulis melakukan wawancara pada pihak yang terkait dengan registrasi di Universitas UPN “Veteran” Jawa Timur. Wawancara tersebut dilakukan kepada Bapak Firza Prima Aditiawan,


61

S.Kom selaku PIA di Jurusan Informatika Fakultas Teknologi Industri. Wawancara yang dilakukan berkaitan dengan registrasi yang ada di Universitas UPN “Veteran” Jawa Timur.

c. Observasi Setelah wawancara dilakukan, Penulis melakukan observasi untuk melakukan pengamatan / survei langsung di Universitas UPN “Veteran” Jawa Timur. Tujuan observasi dilakukan agar mendapatkan data – data dan informasi yang lebih lengkap dan akurat.


BAB IV HASIL DAN PEMBAHASAN

Guna menyelesaikan permasalah dalam pembuatan aplikasi Media Informasi Registrasi Akademik di kampus UPN “Veteran” Jatim ini maka solusi pemecahan masalah adalah membuat aplikasi dengan menggunakan banyak media, baik suara, image / grafis dan animasi. Setelah melakukan tahap analisa dan

perancangan

maka

pada

Bab

ini

akan

dilakukan

pembahasan

pengimplementasian dari hasil aplikasi yang dibuat.

4.1 Spesifikasi Sistem Spesifikasi sistem minimum yang digunakan untuk dapat menggunakan aplikasi ini adalah:

a. Prasyarat Perangkat Keras (Hardware) -

Personal Computer dengan processor Intel Pentium 4 atau AMD Athlon 64

-

Memory sebesar 1 GB

-

Sound Card + speaker (untuk memainkan suara)

-

Monitor berresolusi 1024 x 768 dengan 16-bit video card

-

Mouse

-

DVD ROM untuk instalasi software Adobe Flash CS5

-

Harddisk dengan ruang kosong sebesar kurang lebih 3,5 GB

62


63

b. Prasyarat Perangkat Lunak (Software) -

Perangkat lunak Adobe Flash CS5

-

Microsoft Windows XP Service Pack 2

-

Browser Internet Explorer atau Mozilla Firefox

Sedangkan perangkat yang digunakan untuk semua proses dalam pembuatan apliaksi ini termasuk pembuatan laporan adalah menggunakan perangkat keras dan perangkat lunak. a. Perangkat keras yang digunakan Sebuah laptop ASUS A42J Series yang telah diberi tambahan aplikasiaplikasi pendukung. Spesifikasi daripada perangkat keras tersebut ialah: -

Processor Intel Core i5 M 450 (2.40 GHz, 4 CPUs)

-

Memory 2 GB

-

Monitor berresolusi 1366 x 768 dengan 16-bit video card

-

VGA Nvidia GeForce 450M

-

Harddisk 500GB

b. Perangkat lunak yang digunakan -

Microsoft Windows 7

-

Adobe Flash CS5

-

Adobe Photoshop CS5

-

Cool Edit Pro 2.0

-

Microsoft Visio


64

4.2 Tampilan Aplikasi Pada tahap pengenalan aplikasi ini akan dijelaskan tentang tampilan yang ada pada aplikasi media informasi ini. Tampilan aplikasi ini dibagi menjadi tiga bagian yaitu bagian atas (header), bagian tengah (isi) dan bawah (footer). Sehingga pengguna akan lebih mudah mengidentisikasi dari isi aplikasi tersebut. Berikut adalah tampilan aplikasi ini:

Gambar 4.1 Tampilan Aplikasi

Gambar 4.1 adalah tampilan aplikasi media informasi registrasi ini, jadi jika user menjalankan aplikasi ini pertama kali, user akan langsung ditampilkan tampilan awal tersebut. Pada tampilan awal terdapat empat tombol yaitu “Home”, “Menu”, Contact”, Profile” yang langsung terhubung dengan tampilan yang lain di aplikasi ini. Dalam pembuatan tampilan aplikasi menggunakan elemen-elemen berupa gambar, teks, suara dan animasi tanpa menggunakan elemen yang berupa video. Pembentukan elemen ini terdiri dari beberapa tahapan pembentukan, yaitu:


65

a. Header Aplikasi ini adalah aplikasi yang dibuat khusus untuk media informasi yang ada di kampus UPN “Veteran” Jatim. Karena kampus tersebut memang terkenal dengan sebutan kampus hijaunya dan almamater hijaunya, sehingga dalam pembuatan aplikasi ini akan dibuat header yang didesain dengan tema UPN “Veteran” Jatim yang dominan dengan warna hijau juga. Header tersebut akan menjadi tampilan pada bagian atas aplikasi pada setiap bagian menu.

Gambar 4.2 Tampilan Header

Gambar 4.2 adalah tampilan header yang terdapat beberapa teks, gambar logo dan tombol yang memiliki fungsi masing-masing. Terdapat background hijau yang menjadi latar belakang dari header tersebut. Berikut penjelasan dari masing teks dan tombol-tombol tersebut.

Gambar 4.3 Teks Universitas

Dalam Gambar 4.3 di atas adalah teks utama dalam header tersebut, terdapat tulisan Universitas Pembangunan Nasional “Veteran” Jatim yang


66

berfungsi sebagai identifikasi bahwa aplikasi ini khusus dibuat hanya untuk kampus UPN “Veteran” Jatim dan berisi tentang informasi yang berkaitan dengan kampus UPN “Veteran” Jatim. Sehingga pada saat pengguna melihat aplikasi ini maka pengguna akan tahu bahwa aplikasi ini adalah aplikasi UPN “Veteran” Jatim.

Gambar 4.4 Logo Universitas

Dalam Gambar 4.4 terdapat tiga logo dimana logo yang paling kiri dan paling besar berwarna kuning adalah logo dari UPN “Veteran” Jatim. Dan 2 logo yang ada di tengah dan paling kanan adalah logo dari organisasi pengelola standar internasional. Sehingga fungsi dari logo-logo tersebut adalah sebagai pencitraan sebuah Universitas Pembangunan Nasional “Veteran” Jatim yang telah memiliki sertifikasi resmi standar internasional. Sehingga saat melihat pertama kali maka pengguna akan mengetahui bahwa UPN “Veteran” Jatim adalah kampus yang telah tersertifikasi resmi oleh badan internasional.

Gambar 4.5 Teks Hak Cipta


67

Gambar 4.5 adalah teks yang terdapat di pojok kiri atas tampilan header aplikasi. Tulisan tersebut dibuat kecil karena hanya merupakan sebagai tanda hak cipta dari sebuah aplikasi. Sehingga saat melihat pertama kali maka pengguna tahu bahwa aplikasi ini adalah dibuat oleh Elnath Naim dengan menggunakan program Adobe Flash CS5 dan mungkin bisa memberikan inspirasi pengguna yang lain untuk membuat aplikasi yang lain menggunakan Adobe Flash CS5.

Gambar 4.6 Tombol pada Header

Gambar 4.6 adalah tombol utama dari aplikasi ini. Terdiri dari empat tombol yaitu “Home”, “Menu”, “Contact” dan “Profile”. Tombol tersebut memiliki fungsi masing untuk menampilkan informasi yang ada dalam aplikasi ini. Tombol tersebut dibuat dengan warna kuning agar terlihat jelas dan menyatu dengan warna latar yang berwarna hijau. Pemilihan warna kuning juga sebagai pencitraan dari kampus UPN “Veteran” Jawa Timur.

b. Isi Aplikasi bagian tengah dari aplikasi ini adalah bagian isi. Dimana pada bagian ini terdapat background berwarna hijau dengan garis pinggir putih. Warna hijau yang digunakan adalah warna hijau tua. Bentuk background tersebut juga berbentuk persegi panjang menyesuaikan bentuk aplikasi.


68

Gambar 4.7 Background Bagian Isi

Pada Gambar 4.7 ini informasi pada aplikasi akan ditampilkan sesuai dengan yang dipilih oleh pengguna. Warna dari background yang berwarna hijau tua adalah pencitraan dari UPN “Veteran” Jatim dan penyesuaian terhadap warna dominan dari aplikasi ini.

Gambar 4.8 Background Bagian Isi

Pada Gambar 4.8 di atas warna tulisan pada bagian isi akan diberi warna kuning. Ini dimaksudkan untuk menyelaraskan warna background dengan header dan footernya, sehingga tampilan aplikasi menjadi menarik untuk dilihat. Dan pemilihan font untuk halaman isi adalah Arial yang dimana


69

biasanya digunakan untuk ukuran standar dari lembaga resmi. Kata Universitas Pembangunan Nasional “Veteran” Jawa Timur di bagian kiri bawah juga sebagai penegasan bahwa aplikasi ini hanya untuk UPN “Veteran Jatim.

c. Footer Aplikasi ini adalah aplikasi yang dibuat khusus untuk media informasi yang ada di kampus UPN “Veteran” Jatim. Sehingga dalam pembuatan aplikasi ini akan dibuat footer yang didesain dengan tema UPN “Veteran” Jatim. Dalam footer tersebut terdapat animasi yang bergerak, ini dibuat agar tampilan footer menjadi lebih menarik. Footer tersebut akan menjadi tampilan pada bagian bawah aplikasi pada setiap bagian menu.

Gambar 4.9 Footer pada Adobe Flash CS 5

Gambar 4.9 adalah footer dari aplikasi. Di bagian footer tersebut terdapat dua bagian, pertama adalah lambang logo UPN “Veteran” Jatim dan animasi bergerak. Gambar logo tersebut memiliki fungsi agar pengguna tahu bahwa Universitas Pembangunan Nasional “Veteran” Jawa Timur dapat singkat menjadi UPN “Veteran” Jatim. Supaya pengguna tidak menyalah artikan singkatan dati Universitas Pembangunan Nasional “Veteran” Jawa Timur tersebut. Karena banyak Universitas yang memiliki singkatan yang sama. Selain itu juga supaya agar footer menjadi lebih menarik untuk dilihat.


70

Gambar 4.10 Pembuatan Animasi Footer pada Adobe Flash CS 5

Gambar 4.10 adalah proses pembuatan animasi pada bagian footer aplikasi. Pada proses pembuatan animasi ini menggunakan beberapa layer untuk membuat kotak putih yang disusun secara sejajar dengan warna putih. Dan pada frame tertentu kotak tersebut akan secara perlahan disamarkan warna putihnya dan digerakkan dengan menggunakan motion tween sehingga pergerakkan dari animasi tersebut bisa berjalan dengan halus.

d. Suara Dalam pembuatan aplikasi, suara dapat membuat aplikasi kita lebih hidup. Pada aplikasi ini suara digunakan untuk tombol-tombol, animasi, dan background. Apabila ditekan, maka tombol-tombol itu akan mengeluarkan suara, dan bila pindah halaman suara itu juga akan muncul. Musik dimainkan sebagai latar belakang dari jalannya program. Suara yang digunakan memakai format WAV (Wave Audio Format) dan MP3 (MPEG Audio Layer 3). Penulis mengambil suara dari MP3, lalu MP3 tersebut diedit sesuai dengan yang


71

dibutuhkan. Perangkat lunak yang digunakan untuk mengedit suara adalah Cool Edit Pro 2.0.

Gambar 4.11 Pengolahan Suara pada Cool Edit Pro 2.0

Gambar 4.11 adalah proses pengolahan yang akan digunakan dalam aplikasi ini. Karena pada sebelumnya musik yang digunakan adalah sebuah kesatuan yang utuh. Dan penulis hanya ingin mengambil bagian dari musik tersebut untuk dijadikan tema musik dari aplikasi tersebut. Sehingga untuk memotong dan mengolah musik tersebut sebelum diinputkan kedalam aplikasi harus dilakukan pengolahan menggunakan Cool Edit Pro 2.0

Gambar 4.12 Proses Input Musik pada Aplikasi Adobe Flash CS 5


72

Gambar 4.12 adalah proses input musik pada aplikasi ini. Dimana musik tersebut akan dimainkan ketika pengguna menjalankan aplikasi ini. Dan musik ini akan menjadi tema dari aplikasi ini saat pengguna menggunakan aplikasi hingga selesai. Untuk format suara yang diinputkan adalah .mp3.

Gambar 4.13 Proses Input Suara Tombol pada Aplikasi Adobe Flash CS 5

Gambar 4.13 adalah proses input suara pada bagian tombol di dalam aplikasi ini. Input suara pada aplikasi ini harus dilakukan dengan cara manual ke semua tombol di dalam aplikasi. Input suara diberikan ketika mouse berada di atas tombol (mouse over) dan ketika tombol tersebut diklik.

e. Tombol Tombol-tombol yang dibentuk dibuat dalam Adobe Flash 5.0 dengan memanfaatkan text tool pada toolbox-nya.Tombol-tombol dalam aplikasi dapat menjadi suatu animasi tombol bergerak jika mouse ditekan pada daerah tombol tersebut.


73

Gambar 4.14 Pembuatan Tombol pada Adobe Flash CS 5

Pada Gambar 4.14 jika mouse diarahkan ke atas tombol (mouse over), maka akan muncul garis oval kuning yang melingkari tombol tersebut, warna dari teks awal akan berubah menyesuaikan warna dari garis oval dan bila ditekan tombol tersebut akan bergerak dan warnanya juga akan berubah.

Gambar 4.15 Pembuatan Tombol Arah pada Adobe Flash CS 5

Gambar 4.15 adalah tombol arah yang digunakan pada aplikasi ini. Tombol tersebut dibuat dibuat seperti tanda arah kiri dan kanan, tidak dengan kata Next atau Previous. Ini dimaksudkan agar tampilan lebih efisien dan dinamis. Warna hijau dan putih pada tombol juga dengan maksudkan agar tampilan pada aplikasi terlihat selaras dan menarik. Jika mouse diarahkan pada atas tombol maka tombol tersebut akan bergerak sehingga lebih dinamis.


74

f. ActionScript pada Tombol Kontrol navigasi diperlukan untuk mengontrol

jalannya program.

Kontrol navigasi biasanya dilakukan dalam objek tombol walaupun semua objek dalam Adobe Flash CS 5 dapat dijadikan kontrol navigasi. Tombol tersebut dapat berfungsi untuk berpindah ke halaman sebelumnya atau selanjutnya yang akan dituju. Namun perlu diketahui dalam pembuatan aplikasi ini yang menggunakan ActionScript 3.0, peletakan script tidak bisa dilakukan suatu objek atau button yang dituju. Tidak seperti halnya pada ActionScript 2.0, peletakkan script masih bisa diinputkan ke dalam suatu objek atau button tertentu. Dalam ActionScript 3.0 penginputtan script harus dilakukan pada frame dimana objek atau button tersebut ditempatkan. Misalnya button HOME dimasukkan ke dalam frame 5, maka script harus diinputkan di frame 5 tersebut.

Untuk lebih jelasnya dapat beberapa contoh berikut : 1. Script untuk memanggil halaman“Home”.

Gambar 4.16 Membuat Script untuk Halaman “Home”

Pada Gambar 4.16 perintah addEventListener berlaku apabila pointer mouse melewati area Hit (salah satu empat objek tombol) dan berada


75

diantara saat ditekan dan saat diangkat pada mouse yang diklik. Sesudah klik dilakukan, maka akan memanggil frame yang diberi nama instance “HOME”, lalu scene dijalankan sampai frame selesai dijalankan sesuai dengan yang dibuat dan akan berhenti diakhir frame 1.

2. Script untuk memanggil halaman “Menu”.

Gambar 4.17 Membuat Script untuk Halaman “Menu”

Pada Gambar 4.17 perintah addEventListener berlaku apabila pointer mouse melewati area Hit (salah satu empat objek tombol) dan berada diantara saat ditekan dan saat diangkat pada mouse yang di klik. Sesudah klik dilakukan, maka akan memanggil frame yang diberi nama instance “HOME”, lalu scene dijalankan sampai frame selesai dijalankan sesuai dengan yang dibuat dan akan berhenti diakhir frame 4.

3. Script untuk memanggil frame selanjutnya.

Gambar 4.18 Membuat Script untuk ke Frame Selanjutnya


76

Pada Gambar 4.18 perintah addEventListener berlaku apabila pointer mouse melewati area Hit (salah satu empat objek tombol) dan berada diantara saat ditekan dan saat diangkat pada mouse yang diklik. Sesudah klik dilakukan, maka akan memanggil frame yang diberi nama instance “NEXTMABA”, lalu scene dijalankan menuju frame selanjutnya sampai tombol tersebut berada.

4. Script untuk Memanggil Frame sebelumnya.

Gambar 4.19 Membuat Script untuk ke Frame Sebelumnya

Pada Gambar 4.19 perintah addEventListener berlaku apabila pointer mouse melewati area Hit (salah satu empat objek tombol) dan berada diantara saat ditekan dan saat diangkat pada mouse yang diklik. Sesudah klik dilakukan, maka akan memanggil frame yang diberi nama instance “PREVMABA2”, lalu scene dijalankan menuju frame sebelumnya sampai tombol tersebut berada. g. Flowchart Pada aplikasi ini terdapat flowchart yang dibuat dengan menggunakan Adobe Flash CS5. Flowchart ini berfungsi sebagai sarana untuk mempermudah mahasiswa dalam memahami bagaimana cara melakukan


77

registrasi yang dipilih. Pembuatan flowchart juga melalui desain manual dengan memanfatkan tool yang ada pada Adobe Flash CS5 seperti Rectangle Tool untuk membuat persegi dan Line Tool untuk membuat garis panah yang terdapat pada flowchart.

Gambar 4.20 Pembuatan Flowchart pada Animasi

h. Gambar Gambar animasi maupun gambar yang digunakan dalam program aplikasi ini, dibuat dengan menggunakan Adobe Flash CS 5. Ukuran yang digunakan untuk latar belakang adalah 550 x 400 pixel.

Gambar 4.21 Pembuatan Background pada Animasi


78

Pada Gambar 4.21 adalah proses pembuatan background pada animasi yang terdapat di dalam program. Pada proses pembuatan tersebut penulis membuat desain background secara manual dengan memanfaatkan tool yang ada pada sebelah kanan aplikasi Adobe Flash CS 5, seperti Line tool untuk membuat garis, dan fill color untuk memberikan warna pada background.

Gambar 4.22 Pembuatan Aktor Animasi pada Adobe Flash

Pada Gambar 4.22 adalah proses pembuatan aktor animasi pada aplikasi ini. Pada proses pembuatan tersebut penulis membuat desain animasi secara manual dengan memanfaatkan tool yang ada pada sebelah kanan aplikasi Adobe Flash CS 5, seperti Line tool untuk membuat garis, selection tool untuk membuat garis lurus yang dipilih menjadi melenkung atau lancip, pencil tool untuk membuat garis dengan pola yang rumit, dan fill color untuk memberikan warna pada bagian gambar animasi.


79

i. Animasi Pembuatan gerak animasi dapat dilakukan dengan menggunakan tool yang terdapat pada Adobe Flash CS 5.

Gambar 4.23 Pengolahan Animasi pada Adobe Flash CS 5

Gambar 4.23 adalah proses pengolahan gerak animasi pada aplikasi. Dalam proses ini bagian tubuh aktor digerakkan dengan menggunakan Bone Tool yang hanya ada pada ActionScript 3.0. Sedangkan untuk merubah posisi aktor di dalam layar dengan menggunakan Classic Tween dan Frame.


BAB V UJI COBA DAN EVALUASI PROGRAM

Pada Bab V ini akan dilakukan tahap uji coba pada Aplikasi Media Informasi Registrasi Akademik ini. Tahap Uji coba aplikasi tersebut sangat diperlukan guna mengevaluasi program apakah seluruh fungsionalitas bisa dijalankan dan seluruh isinya sesuai dengan tujuan dan manfaat dari pada aplikasi yang dibuat. Uji coba dilakukan pada setiap fungsionalitas dengan cara mencoba satu persatu sesuai dengan langkah-langkah untuk menampilkan fungsionalitasfungsionalitas tersebut. 5.1 Skenario Uji Coba Skenario uji coba ini dibuat agar tahap testing bisa mencangkup semua fungsionlitas dari sistem ini sesuai dengan tujuan dan manfaat dari pada aplikasi ini. Uji coba ini dilakukan oleh satu seorang yang menjalankan skenario dibawah ini: a. Menjalankan Aplikasi Skenarionya adalah ketika user menjalankan aplikasi tersebut maka sistem akan menampilkan tampilan awal dan musik akan dijalankan oleh sistem. Dan ukuran tampilan di layar sesuai dengan dibuat. b. Melihat Informasi pada Aplikasi Setelah memasuki halaman utama dari aplikasi maka user mencoba untuk melihat isi dari informasi yang tersedia pada aplikasi. Informasi yang akan dites adalah:

80


81

1. Melihat informasi tentang tujuan aplikasi User akan mencoba melakukan tes pada tombol “Home”, apakah aplikasi akan manampilkan informasi pada halaman “Home”. Dan jika di lakukan tes berulang kali maka sistem tidak mengalami masalah dalam menampilkan informasi yang ada pada halaman “Home”. 2. Melihat informasi berbagai macam registrasi User akan mencoba melakukan tes pada tombol “Menu”, apakah aplikasi akan manampilkan informasi pada halaman “Menu”. Apakah pada halaman “Menu” terdapat berbagai macam informasi registrasi dan animasi yang memudahkan mahasiswa memahami proses registrasi yang dipilih. Dan jika di lakukan tes berulang kali pada tombol next dan previous maka sistem menampilkan frame yang berisi informasi selanjutnya atau sebelumnya serta tidak mengalami masalah dalam menampilkan informasi yang ada pada halaman “Menu”. 3. Melihat informasi tentang Kontak UPN “Veteran” Jatim User akan mencoba melakukan tes pada tombol “Contact”, apakah aplikasi akan manampilkan informasi pada halaman “Contact”. Dan jika di lakukan tes berulang kali maka sistem tidak mengalami masalah dalam menampilkan informasi yang ada pada halaman “Contact”. 4. Melihat Informasi tentang Profil UPN “Veteran” Jatim User akan mencoba melakukan tes pada tombol “Profile”, apakah aplikasi akan manampilkan informasi pada halaman “Profile”. Dan


82

jika di lakukan tes berulang kali maka sistem tidak mengalami masalah dalam menampilkan informasi yang ada pada halaman “Profile”.

5.2 Pelaksanaan Uji Coba Pelaksanaan uji coba ini berdasarkan skenario yang telah dijelaskan pada bagian sebelumnya. User melakukan semua tes sesuai dengan skenario dan ukuran keberhasilan tes tersebut adalah ketika semua fungsi yang terdapat pada aplikasi bisa dijalankan sesuai dengan tujuan dari fungsi tersebut. a. Testing menjalankan aplikasi Pertama yang dilakukan user adalah dengan memilih icon dari aplikasi media informasi registrasi akademik ini dan menjalankan aplikasi ini. Setelah itu maka sistem akan menampilkan tampilan awal dan musik akan dijalankan oleh sistem, tampilan awal aplikasi ini adalah:

Gambar 5.1 Tampilan Awal


83

b. Melihat Informasi Aplikasi 1. Melihat informasi tentang tujuan aplikasi Untuk

melihat informasi tentang tujuan aplikasi user dapat

memilih icon dari aplikasi media informasi registrasi akademik ini dan menjalankan aplikasi ini. Atau jika user telah menjalankan aplikasi ini dan berada pada halaman informasi lainnya user dapat memilih tombol “HOME” yang terletak pada bagian header dari aplikasi ini. Berikut tampilan melihat informasi tentang tujuan aplikasi:

Gambar 5.2 Tampilan Informasi Tujuan Aplikasi

2. Melihat informasi berbagai macam registrasi Untuk melihat informasi tentang berbagai macam aplikasi, user dapat memilih tombol “MENU” yang terletak pada bagian header dari aplikasi ini. Berikut tampilan halaman tersebut:


84

Gambar 5.3 Tampilan Informasi Pilihan Menu Registrasi

-

Registrasi Mahasiswa Baru Untuk melihat informasi tentang registrasi mahasiswa baru, user

dapat memilih tombol “Registrasi Mahasiswa Baru” yang terletak halaman “Menu”. Berikut tampilannya:

Gambar 5.4 Tampilan Informasi Registrasi Mahasiswa Baru


85

Setelah bagian prosedur maka kita akan melihat flowchart dari registrasi mahasiswa baru tersebut. Ini bertujuan supaya user lebih mudah memahami bagaimana cara melakukan registrasi tersebut.

Gambar 5.4 Tampilan Flowchart Registrasi Mahasiswa Baru

Pada

akhir

bagian

informasi

terdapat

animasi

yang

menggambarkan bagaimana registrasi mahasiswa baru tersebut dilakukan. Berikut potongan tampilan animasi tersebut:

Gambar 5.5 Animasi Berbicara Registrasi Mahasiswa Baru


86

Gambar 5.6 Animasi Berjalan Registrasi Mahasiswa Baru

-

Registrasi PKL Untuk melihat informasi tentang registrasi PKL, user dapat

memilih tombol “Registrasi PKL” yang terletak halaman “Menu”. Berikut tampilannya:

Gambar 5.7 Tampilan Informasi Registrasi PKL


87

Setelah bagian prosedur maka akan melihat flowchart dari registrasi PKL tersebut. Ini bertujuan supaya user lebih mudah memahami bagaimana cara melakukan registrasi tersebut.

Gambar 5.8 Tampilan Flowchart Registrasi PKL

Pada akhir bagian informasi terdapat animasi yang menggambarkan bagaimana registrasi PKL tersebut dilakukan. Berikut potongan tampilan animasi tersebut:

Gambar 5.9 Animasi Berbicara Registrasi PKL


88

Gambar 5.10 Animasi Gedung Registrasi PKL

3. Melihat informasi tentang kontak UPN “Veteran” Jatim Untuk melihat informasi tentang kontak UPN “Veteran” Jatim, user dapat memilih tombol “CONTACT” yang terletak pada bagian header dari aplikasi ini. Berikut tampilan melihat informasi tentang kontak UPN “Veteran” Jatim:

Gambar 5.11 Tampilan Informasi Kontak UPN “Veteran” Jatim


89

4. Melihat informasi tentang profil UPN “Veteran” Jatim Untuk melihat informasi tentang profil UPN “Veteran” Jatim, user dapat memilih tombol “PROFILE” yang terletak pada bagian header dari aplikasi ini. Berikut tampilannya:

Gambar 5.12 Tampilan Informasi Profil UPN “Veteran” Jatim

5.3 Evaluasi Setelah melalui tahapan-tahapan testing (uji coba) diatas, maka dapat disimpulkan bahwa aplikasi ini berjalan sesuai dengan tujuan utama sesuai dengan bab-bab sebelumnya sehingga aplikasi ini tergolong sukses untuk memenuhi kebutuhan pengguna yang dituju.


BAB VI PENUTUP

6.1 Kesimpulan Kesimpulan ini ditarik berdasarkan data-data serta analisa yang telah dilakukan. Berikut adalah kesimpulan berikut: a. Dalam pembuatan sistem aplikasi media informasi registrasi ini telah dilakukan pengamatan dan analisa dengan dasar Ilmu Interaksi Manusia dan Komputer. b. Dalam interface aplikasi media informasi registrasi akademik berbasis flash ini telah dirancang dengan dasar Ilmu Interaksi Manusia dan Komputer dan mengandung banyak media seperti sound, image, text dan animasi. Sehingga aplikasi ini lebih menarik dari informasi yang disajikan dari media-media cetak. c. Sistem aplikasi media informasi registrasi akademik berbasis flash ini berisi animasi tentang cara melakukan registrasi di UPN “Veteran” Jatim yang dibuat dengan Adobe Flash CS5. d. Aplikasi ini telah dilakukan evaluasi dan implemetasi berdasarkan ilmu Interaksi Manusia dan Komputer sehingga dapat digunakan oleh mahasiswa sebagai panduan sebelum melakukan registrasi yang ada di UPN “Veteran” Jatim.

90


91

6.2 Saran-saran Perbaikan-perbaikan atau

pemberian tambahan pada

aplikasi ini

dibutuhkan agar membuat aplikasi ini lebih berkembang: a. Memberikan tambahan informasi dan animasi tentang Registrasi akademik di UPN “Veteran” Jatim yang mungkin belum tercantum pada aplikasi ini. b. Mengintegrasikan aplikasi media informasi ini dengan informasi yang tersedia di website SIAMIK di UPN “Veteran” Jatim. c. Membuat tampilan interface yang lebih menarik yang sesuai dengan Ilmu Manusia dan Komputer.


DAFTAR PUSTAKA

Chandra, 2011. “7 Jam Belajar Interaktif Flash CS 5 untuk Orang Awam”, Palembang : Maxikom

Cogswell, Jeff, 2005. “Designing Highly Useable Software. Sybex”, London

Dharwiyanti, Sri, 2003. “Pengantar Unified Modeling Language (UML)”

Fauzi, Ridwan, 2011, http://www.ridwanfauzi.com/2011/sejarah-flash/, diakses 8 oktober 2011

Galitz, Wilbert, 2002. “The Essential Guide to User Interface Design”, USA : Wiley Computer

Gunadarma,

2011,

http://papers.gunadarma.ac.id/index.php/mi/article/

view/1192/1149, diakses 8 Oktober 2011

Hamalik, Oemar, 1994. “Media Pendidikan”

Madcoms, 2009. “Animasi Cantik dengan Adobe Flash”, Yogyakarta : Andi

Media Grafika, 2011, http://media-grafika.com/pengertian-media-pembelajaran, diakses 8 Oktober 2011

Saffer, Dan, 2006. “Designing for Interaction: Creating Smart Applications and Clever Devices”, USA : Peachpit Press

Shvoong,

2011,

http://id.shvoong.com/social-sciences/education/2145958-

multimedia-interaktif/, diakses 8 Oktober 2011

xii


xiii

Subakti, Irfan,

2006, http://www.scribd.com/doc/49645094/Interaksi-Manusia-

dan-Komputer, diakses 8 Oktober 2011

Tidwell, Jenifer, 2005. “Designing Interfaces”, USA : O'Reilly

UPN “Veteran” Jatim, 2007. “Buku Pedoman Tri Dharma Perguruan Tinggi Tahun Akademik”. Surabaya

UPN “Veteran” Jatim, 2010. “ Panduan Akademik Fakultas Teknologi Industri Teknik Informatika”. Surabaya

Wahana Komputer, 2010. “Adobe Flash CS 5 untuk membuat Animasi Kartun”, Yogyakarta : Andi

Warta

Warga,

2007,

http://wartawarga.gunadarma.ac.id/2009/11/pengertian-

animasi-konsep-pembuatan-animasi/, diakses 8 Oktober 2011

Wikipedia, 2011, http://id.wikipedia.org/wiki/Papan_cerita/, diakses 8 Oktober

Wikipedia,

2011,

http://id.wikipedia.org/wiki/Interaksi_manusia-komputer,

diakses 8 Oktober 2011


BAB II TINJAUAN PUSTAKA

Recommend Documents