BAB 2 LANDASAN TEORI 2.1 Teori Umum Teori umum merupakan teori-teori pokok yang akan dijadikan landasan untuk teori-teori lainnya dalam penulisan skripsi ini. 2.1.1 Multimedia Menurut Vaughan (2010, p1) multimedia adalah gabungan dari lima elemen utama yaitu suara, teks, gambar, animasi, dan video yang dapat kita lihat melalui komputer atau alat elektronik lainnya. Multimedia disebut interactive multimedia jika pengguna multimedia dapat mengontrol apa dan kapan sebuah elemen multimedia disampaikan. Interactive multimedia menjadi hypermedia jika dalam multimedia tersebut terdapat struktur dari elemen-elemen yang tehubung yang dapat dinavigasi oleh pengguna. Menurut Vaughan (2010, p11) ada lima elemen utama dalam multimedia, yaitu: 1. Teks Teks merupakan media paling dasar dalam banyak sistem multimedia. Teks bisa kita temukan dalam bentuk kata, kalimat, dan paragraf yang digunakan untuk menyampaikan pikiran, ide, dan fakta pada hampir semua aspek dalam hidup kita sehari-hari.
7
8 2. Gambar Gambar adalah cerminan visual dari beberapa informasi yang pada umumnya ditampilkan di layar komputer atau media cetak. Secara umum image dibagi menjadi dua jenis yaitu: bitmapped atau raster image dan vector graphics atau metafile image. Bitmapped image atau disebut juga raster image adalah sebuah matrix sederhana dari titik-titik kecil yang membentuk suatu gambar. Bitmapped image disimpan dalam bentuk array atau pixel. Pixel adalah elemen resolusi yang paling kecil dari layar komputer. Setiap pixel dapat berisi warna tertentu. Jumlah warna yang terdapat di dalam tiap pixel disebut color depth. Vector graphics disimpan dalam bentuk kumpulan grafik primitive (persegi, garis, elipse, titik, dan lain-lain) untuk menunjukan sebuah gambar. 3. Suara Suara adalah getaran yang cepat yang ditransmisikan sebagai variasi dalam tekanan udara. Suara merupakan elemen multimedia yang paling sensual
karena
suara
dapat
menyediakan
kenikmatan
dalam
mendengarkan musik, dapat menghasilkan efek suara yang menakjubkan, dan juga suara dapat digunakan sebagai pengatur mood. 4. Animasi Animasi adalah perubahan visual dari waktu ke waktu. Animasi dapat membuat gambar atau objek yang statis menjadi hidup. Animasi dibagi menjadi dua jenis yaitu: animasi 2D dan animasi 3D.
9 Animasi 2D adalah perubahan visual dari waktu ke waktu yang terjadi hanya pada sumbu x dan y dari layar saja. Sedangkan animasi 3D adalah perubahan visual dari waktu ke waktu yang terjadi pada sumbu x, y, dan z dari layar. 5. Video Video merupakan hal paling menarik dari multimedia dan menjadi suatu alat yang ampuh untuk membuat pengguna komputer menjadi lebih dekat pada dunia nyata. 2.1.2 Interaksi Manusia dan Komputer (IMK) Interaksi manusia komputer merupakan area penelitian dan praktek yang muncul di awal tahun 1980. IMK berkembang pesat selama tiga dekade, dan hal tersebut menarik berbagai pakar dari ilmu lain untuk menggabungkan konsep dan pendekatan yang beragam. Interaksi Manusia Komputer merupakan pembelajaran tentang hubungan atau interaksi antara manusia dan komputer. IMK adalah suatu ilmu yang berhubungan dengan perancangan, evaluasi, dan implementasi sistem komputer interaktif untuk digunakan manusia. IMK juga sering dianggap sebagai persimpangan dari ilmu komputer, ilmu perilaku, ilmu desain dan bidang lainnya. 2.1.2.1 Lima Faktor Manusia Terukur Suatu sistem dikatakan baik jika sistem tersebut mudah untuk digunakan (user friendly) dan memeperhatikan faktor-faktor yang datang dari manusia. Berikut ini adalah lima faktor manusia terukur menurut Shneiderman (2010, p32), yaitu:
10 1. Waktu belajar Lamanya user mempelajari tindakan yang diperlukan untuk melakukan suatu tugas. 2. Kecepatan kinerja Seberapa cepat suatu tugas dapat dilakukan dan diselesaikan oleh user. 3. Tingkat kesalahan Dalam melakukan suatu tugas, berapa banyak dan apa saja kesalahan yang dilakukan oleh user. 4. Daya ingat Seberapa baik seorang user mampu mengingat pengetahuan yang didapat setelah rentang waktu tertentu. 5. Kepuasan subjektif Seberapa besar tingkat kepuasan user terhadap semua aspek antarmuka yang ada. 2.1.2.2 Delapan Aturan Emas Dalam buku Designing the User Interface (Shneiderman, 2010, pp88-89), terdapat delapan aturan yang digunakan sebagai petunjuk dasar untuk merancang suatu user interface. Delapan aturan emas atau juga disebut Eight Golden Rules of Interface Design, yaitu: 1. Berusaha keras untuk konsisten Aturan yang sering dilanggar dalam multimedia. Konsistensi urutan tindakan diperlukan dalam situasi serupa dan digunakan dalam menu, dan layar bantuan; warna yang konsisten,
11 kapitalisasi, jenis huruf dan sebagainya yang harus diterapkan di seluruh bagian. 2. Memenuhi kebutuhan universal Kenali kebutuhan pengguna yang beragam dan lakukan desain yang fleksibel. Seorang pemula dan ahli yang memiliki perbedaan kemampuan dan kebutuhan. Perbedaan usia, ketidak mampuan khusus, dan keragaman setiap teknologi juga perlu diperhatikan. Memberikan
fitur untuk
pemula seperti penjelasan
juga
menambahkan fitur untuk ahli seperti shortcuts yang akan memperkaya desain antarmuka dan meningkatkan kualitas sistem. 3. Memberikan umpan balik yang informatif Untuk setiap tindakan pengguna, harus diterapkan suatu sistem umpan balik agar pengguna dapat mengetahui dari aksi yang dilakukannya. Contoh sederhana seperti saat pengguna selesai melakukan penyimpanan dokumen, jika tidak ada umpan balik yang jelas maka pengguna akan bingung apakah dokumen sudah tersimpan atau belum. 4. Merancang dialog yang menghasilkan penutupan Urutan tindakan disusun secara terstruktur kedalam kelompok awal, tengah, dan akhir. Contohnya pada web e-commerce setelah memilih apa yang akan dibeli maka sistem akan memindahkan pengguna dari pemilihan produk ke kasir, dan berakhir dengan halaman konformasi yang jelas untuk melengkapi transaksi.
12 5. Memberikan penanganan kesalahan yang sederhana. Sistem didesain agar pengguna tidak dapat membuat kesalahan yang serius. Jika kesalahan dibuat, sistem akan mampu mengetahui kesalahan tersebut dan kemudian menawarkan mekanisme sederhana untuk menanggulangi kesalahan tersebut, sehingga
pengguna
tidak
merasa
bersalah
dan
mau
mengeksplorasi lebih jauh lagi. 6. Mengijinkan pembalikan aksi (undo) dengan mudah Tindakan dapat dikembalikan menjadi keadaan sebelumnya. Fitur ini mampu mengurangi kecemasan pengguna karena kesalahan yang dibuat oleh pengguna dapat diperbaiki, dengan demikian dapat mendorong pengguna agar memiliki keinginan untuk eksplorasi lebih jauh. 7. Dukungan kontrol internal Pengguna menginginkan situasi dimana mereka memegang kendali atas sistem, bukan komputer yang memegang kendali atas pengguna. 8. Mengurangi beban ingatan jangka pendek Manusia memiliki ingatan yang terbatas dalam suatu waktu. Karena adanya batasan ini maka tampilan harus dibuat dengan sederhana sehingga tidak membuat pengguna merasa bingung karena terlalu banyak info.
13 2.1.3 Waterfall Model Menurut Pressman (2010, p39), salah satu pengembangan sistem adalah dengan model waterfall. Waterfall adalah model yang sering disebut sebagai pendekatan klasik pada daur pengembangan sistem. Tahapannya adalah sebagai berikut : 1. Communication Tahap ini merupakan yang paling awal, pada tahap ini dilakukan inisiasi proyek, misalnya seperti menganalisis masalah yang ada dan menganalisis tujuan yang akan dicapai. Dan juga dilakukan requirements gathering, dengan cara pengumpulan requirement dari user melalui kuesioner. 2. Planning Tahap ini merupakan tahap akan dilakukannya rencana anggaran mengenai kebutuhan apa saja yang diperlukan untuk membuat suatu sistem. Dan pada tahap ini juga dilakukan penjadwalan proses pengerjaan. 3. Modeling Kemudian mulai masuk pada tahap perancangan, pada tahap ini perancangan menjelaskan apa saja kebutuhan dari sistem menjadi sebuah representasi guna menilai kualitas sebelum tahap selanjutnya dikerjakan. Tahap ini lebih difokuskan pada atribut program, seperti arsitektur perangkat lunak, struktur data, dan juga detail prosedur.
14 4. Construction Tahap ini merupakan tahap dimana perancangan yang sudah dilakukan pada tahap sebelumnya diterjemahkan ke dalam bahasa yang dipahami dan dimengerti oleh mesin. Setelah itu dilakukan uji coba terhadap sistem yang telah dibuat. 5. Deployment Setelah sistem telah selesai dibuat ataupun baru setengah selesai dan telah diuji, maka dilakukan implementasi kepada pengguna. Pada tahap ini dilakukan pengembangan, perbaikan, dan pemeliharaan sistem yang telah dibuat agar dapat berjalan sesuai dengan fungsinya.
Gambar 2.1 Waterfall Model (Pressman, 2010) 2.1.4 Diagram Aliran Dokumen (DAD) Menurut Mulyadi (2001, pp58-63), diagram aliran dokumen adalah suatu diagram yang menggambarkan aliran dokumen dan proses untuk mengolah dokumen.
15
Gambar 2.2 Diagram Aliran Dokumen (Mulyadi, 2001) Berikut ini adalah tabel yang menjelaskan komponen-komponen dari diagram aliran dokumen :
16 Tabel 2.1 Tabel Simbol-simbol Diagram Aliran Dokumen Simbol
Keterangan Dokumen Simbol ini digunakan untuk menggambarkan semua jenis dokumen,
yang
merupakan
formulir untuk
merekam data terjadinya suatu transaksi. Keputusan
Ya
Tidak
Simbol ini menggambarkan keputusan yang harus dibuat dalam proses pengolahan data. Keputusan yang dibuat ditulis dalam simbol. Garis Alir Simbol ini menggambarkan arah proses pengolahan data. Persimpangan Garis Alir Jika dua garis alir bersimpangan, untuk menunjukkan arah masing-masing garis, salah satu garis dibuat sedikit melengkung tepat pada persimpangan kedua garis tersebut. Pertemuan Garis Alir Simbol ini digunakan jika dua garis alir bertemu dan
17 Simbol
Keterangan salah satu garis mengikuti garis lainnya.
Proses Simbol ini untuk menunjukkan tempat-tempat dalam sistem informasi yang mengolah atau mengubah data yang diterima menjadi data yang mengalir keluar. Nama pengolahan data ditulis di dalam simbol. Mulai / Berakhir (terminal) Simbol ini untuk menggambarkan awal dan akhir suatu sistem akuntansi
2.1.5 State Transition Diagram Sebuah sistem membutuhkan banyak layar antarmuka bahkan mungkin sampai ratusan layar. Semua layar dapat di desain dan dijadikan prototype, namun masalahnya adalah bagaimana koordinasi antar layar tersebut. Untuk itu dibutuhkan State Transition Diagram. Menurut Whitten dan Bentley (2007, p635) State Transition Diagram adalah sebuah diagram yang digunakan untuk menggambarkan urutan dan variasi layar yang terjadi dalam suatu sesi.
18
Gambar 2.3 State Transition Diagram (Whitten dan Bentley 2007)
2.1.5.1 Notasi State Transition Diagram Menurut Whitten dan Bentley (2007, p636), terdapat beberapa notasi dalam mendesain sebuah STD. Berikut adalah notasi dalam sebuah STD.
Tabel 2.2 Notasi State Transition Diagram Gambar
Nama
Keterangan
Menggambarkan apa Rectangle
saja yang dapat muncul selama dialog berlangsung
19
Arrow
Arah dari panah tersebut mengindikasikan urutan dari layar
2.1.6 Database Database adalah sekumpulan data yang saling berhubungan satu dengan yang lain dan dirancang untuk memenuhi kebutuhan informasi dari suatu organisasi. Database adalah sebuah tempat penyimpanan data yang digunakan oleh banyak pengguna. Database juga diartikan sebagai sekumpulan data terintegrasi yang menjelaskan dirinya sendiri. (Connolly dan Begg, 2010, p14). Suatu rancangan database juga terdapat sebuah relational database. Menurut Connolly dan Begg (2010, p74) relational database adalah sebuah kumpulan dari relasi yang telah dinormalisasikan. Relational database merupakan suatu tipe database berdasarkan model relational, dimana semua data dapat dilihat oleh pengguna yang disusun ke dalam bentuk tabel. Relasi antar tabel pada relational database sudah melalui tahap normalisasi dengan nama relasi yang berbeda-beda. Menurut (Connolly dan Begg, 2010, p74), ada tiga jenis relasi antarrecord dalam tabel, yaitu : 1. Relasi one-to-one (1...1) Relasi antara satu record dengan satu record dalam tabel lain yang saling berhubungan.
20 2. Relasi one-to-many (1…*) Relasi antara satu record dengan banyak record dalam tabel lain yang saling berhubungan. 3. Relasi many-to-many (*…*) Relasi antar banyak record dengan lebih dari satu record dalam tabel lain yang saling berhubungan. 2.1.7 Storyboard Menurut Pressman (2010, p341) storyboard berfungsi sebagai penunjuk fungsionalitas dari sebuah aplikasi. Salah satu langkah-langkah Interface design workflow adalah dengan memasukan pembuatan storyboard, sebagai representasi penggambaran bagaimana suatu interface merespon interaksi pengguna dan sebagai penggambaran indentifikasi dari tiap-tiap konten objek yang ada walaupun belum dibuat ataupun dikembangkan. Secara umum, storyboard adalah sekumpulan gambar yang terorganisir secara berurutan dan dibuat untuk mem-visualisasikan sebuah gambar gerak, animasi, dan urutan media interaktif, termasuk interaktif dari sebuah web. 2.1.8 Kuesioner Menurut Bardosono (2009, p1) kuesioner adalah suatu kumpulan pertanyaan yang telah disusun sedemikian rupa untuk dijawab oleh responden dalam rangka mengumpulkan data sesuai dengan tujuan penelitian. Kuesioner yang digunakan hanya dibatasi pada pertanyaan
21 tertutup atau pilihan ganda. Ada beberapa jenis pertanyaan dalam suatu kuesioner, yaitu: a. Pertanyaan Tertutup Pertanyaan yang menyediakan alternatif jawaban. Terdapat pilihan jawaban yang seragam dan adanya kemudahan dalam pengolahan data. b. Pertanyaan Terbuka Pertanyaan dimana responden diminta menyediakan jawaban sendiri. Dapat digunakan dalam penelitian yang bersifat kualitatif karena peneliti ingin meneliti apa yang diketahui responden, terutama bila latar belakang populasi penelitian belum dikenal. c. Pertanyaan Introduktif Pertanyaan yang bersifat mengiring dan menuntun responden untuk bisa menjawab pertanyaan-pertanyaan mengenai suatu hal yang baru. d. Pertanyaan Penyaringan Digunakan untuk menyaring suatu populasi untuk mendapatkan kelompok yang spesifik. e. Matriks Pertanyaan Digunakan jika responden memilih sendiri jawaban yang benar dari pertanyaan yang diberikan. Contoh pilihan pertanyaan yang diberikan sangat setuju, setuju dan tidak setuju.
22 2.2 Teori Khusus Teori khusus merupakan teori-teori yang berhubungan dengan topik yang dibahas dalam skripsi ini. 2.2.1 Adobe Flash Menurut
Moock
(2007,
p25)
Adobe
Flash
adalah
sebuah
programming tool untuk membuat suatu konten multimedia yang mengintegrasikan antara gambar, video, animasi dan interaktivitas. Adobe Flash dapat disebut juga sebagai Flash authoring tool. Di dalam Adobe Flash, developer juga membuat sebuah konten interaktif dengan cara menggabungkan ActionScript dan animasi dengan membuat konten dan embedded asset. 2.2.2 ActionScript 3.0 Menurut Moock (2007, p21) ActionScript 3.0 merupakah salah satu bahasa object oriented untuk membuat sebuah aplikasi dengan konten multimedia yang dapat diputar dengan menggunakan flash client runtime. Ada tiga jenis flash client runtime yang dapat menjalankan program dengan ActionScript: 1. Adobe AIR Adobe AIR dapat menjalankan aplikasi berbasis flash yang ditunjukan dengan aplikasi desktop. Adobe AIR mendukung konten berformat SWF, serta konten yang dibuat berdasarkan HTML dan JavaScript. Adobe AIR harus diinstal secara langsung ke dalam sistem komputer.
23 2. Flash Player Flash Player dapat menjalankan konten berbasis flash dan aplikasi yang ditunjukan terhadap web yang meng-embed konten berformat SWF. Flash Player biasanya terinstal sebagai add-on dari sebuah browser, namun juga dapat berjalan sendiri. 3. Flash Lite Flash Lite dapat menjalankan konten berbasis flash dan aplikasi yang ditunjukan terhadap mobile device. Dikarenakan adanya batasanbatasan dari performa mobile device. Flash Lite biasanya mengalami kelambatan (lag) jika dibandingkan dengan Adobe AIR dan Flash Player secara fitur dan kecepatan. Dari ketiga runtime diatas, masing-masing menyediakan kumpulan fungsi, variable, class dan objeknya sendiri, yang disebut sebagai runtime API. Namun setiap API mempunyai kumpulan fungsi inti yang sejenis. Beberapa fitur yang ada pada setiap API pada masing-masing runtime, sebagai berikut: •
Printing
•
Pemutar audio
•
Graphics dan video display
•
Input dan memunculkan teks
•
Arsitectur event yang berhirarki
24 •
Kontrol dari mouse dan keyboard
•
Berkomunikasi dengan aplikasi lokal secara eksternal
•
Keperluan yang membantu programming
•
Fungsi operasi jaringan yang berguna untuk men-load data dan berkomunikasi dengan aplikasi berbasis server ActionScript harus di compile ke file berformat SWF
(Shockwave file) untuk dijalankan pada salah satu runtime. Sebuah file berformat SWF dapat berisi actionscript byte code dan embedded asset seperti gambar, suara, video bahkan tulisan. Agar lebih mudah, sebuah program berbasis ActionScript dapat dipecah menjadi beberapa bagian SWF. Ketika memecah program ke dalam beberapa file SWF dapat mempermudah melakukan perawatan program tersebut, dan memberikan akses yang lebih cepat pada sebuah aplikasi yang terkirim melalui internet karena akan memberikan akses yang lebih cepat kepada user untuk mengakses bagian tertentu dari program tersebut. 2.2.3 XAMPP Menurut Bunafit Nugroho (2008, p2) XAMPP merupakan paket perangkat lunak berbasis open source yang dikembangkan oleh sebuah komunitas open source. XAMPP adalah perangkat lunak yang mendukung banyak sistem operasi yang merupakan gabungan dari beberapa perangkat lunak. XAMPP dikembangkan oleh sebuah tim proyek bernama Apache Friends.
25 Fungsi XAMPP adalah sebagai server yang berdiri sendiri (localhost). Nama XAMPP sendiri merupakan singkatan dari X yang berarti mendukung empat sistem operasi yang terdiri atas Apache, MySQL, PHP dan Perl.
Gambar 2.4 Logo XAMPP
2.2.4 Hypertext Preprocessor (PHP) Menurut Ullman (2011, p10), PHP adalah scripting language yang dirancang untuk melakukan sesuatu hanya jika suatu peristiwa terjadi. Contohnya pada saat user melakukan submit sebuah formulir dari suatu website. PHP sendiri tertanam di dalam HTML dan merupakan teknologi server-side. Maksudnya adalah bahwa semua yang dilakukan oleh PHP terjadi di dalam server. Tujuan utama menggunakan PHP adalah menyediakan web developers untuk membuat halaman yang dihasilkan secara cepat dan dinamis. Salah satu keunggulan dari PHP adalah extensibility-nya dan jumlah extension modules yang telah tersedia untuk mendukung database connectivity, mail, dan XML.
26 2.2.5 MySQL Menurut Ullman (2011, p12) menyatakan bahwa MySQL merupakan database open-source yang paling banyak dikenal. MySQL biasanya digunakan bersama dengan PHP. Perangkat lunak MySQL juga dilengkapi dengan database server untuk menyimpan data. Kegunaan dari MySQL adalah untuk mengatur akses ke data dan memastikan banyak pengguna dapat mengakses dan menggunakan data tersebut secara bersamaan. Selain itu MySQL juga memastikan hanya user yang memiliki izin yang bisa mengakses data – data tertentu. 2.2.5.1 PhpMyAdmin Setiap RDBMS (Relational Database Managemen System) seperti Oracle, SQL Server, MySQL dan yang lainnya, pasti memiliki tool yang dapat digunakan untuk pengoperasian database. Dalam hal ini MySQL memiliki tool atau aplikasi yang disebut dengan PhpMyAdmin. PhpMyAdmin merupakan aplikasi berbasis web yang dikembangkan menggunakan bahasa pemrograman PHP. Melalui PhpMyAdmin, user dapat melakukan perintah query. Perintah tersebut misalnya administrasi user dari privileges, export dan import database, management database, management table, dan structure table. PhpMyAdmin sangat user friendly, sehingga mudah digunakan untuk pengguna baru (Sugiri dan Haris Saputro, 2008, p4).
27
Gambar 2.5 Tampilan PhpMyAdmin 2.2.6 Extensible Markup Language (XML) Menurut Walsh (2013, p2) XML adalah sebuah markup-language untuk suatu dokumen yang di dalamnya terdapat informasi terstruktur. Bahasa markup adalah sebuah mekanisme untuk mengindentifikasi suatu struktur dari dokumen. XML juga merupakan meta-language untuk menerangkan sebuah markup-language.
