PERANCANGAN MULTIMEDIA INTERAKTIF UNTUK PROFIL MORISHA SKIN CARE DI YOGYAKARTA Naskah Publikasi diajukan oleh Yogi Hari 08.01.2326 kepada SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER AMIKOM YOGYAKARTA 2012 1
2
MULTIMEDIA INTERACTIVE CONSTRUCTION FOR PROFILE IN MORISHA SKIN CARE YOGYAKARTA PERANCANGAN MULTIMEDIA INTERAKTIF UNTUK PROFIL MORISHA SKIN CARE DI YOGYAKARTA Yogi Hari Jurusan Teknik Informatika STMIK AMIKOM YOGYAKARTA ABSTRACT Morisha Skin Cre employees are required to presentation to the products offered and their functions and also have to recognize the characteristics of the skin type that will do the maintenance. Employees often have difficulty in making the presentation because the constraints do not have an application that is designed specifically for presentations. Seeing the number of employees Morisha Skin Care that requires detailed information about the products offered by the authors would like to bring multimedia applications to facilitate the delivery of information via computer. Computer as a means of delivering multimedia information system that made possible intraktif, so that users can no longer be active or passive reactive nature. Delivery of multimedia-based information is used to assist employees in the delivery of information and a media campaign for Morisha Skin Care. Keywords: Morisha Skin Care Employees, multimedia applications, media information 3
1. Pendahuluan Aplikasi multimedia merupakan salah satu media yang dapat digunakan untuk memberikan kemudahan kepada pengguna (user) secara cepat dan mudah melalui desktop. Maraknya penggunaan notebook dikalangan karyawan-karyawan perusahaan menjadi alasan semakin luasnya penggunaan aplikasi multimedia. Kebutuhan akan sebuah informasi juga menjadi salah satu faktor pendorong perkembangan aplikasi multimedia untuk karyawan Morisha Skin Care. Salah satu bantuan yang dibutuhkan karyawan Morisha Skin Care adalah informasi-informasi tentang produk yang ditawarkan. Aplikasi multimedia untuk karyawan Morisha Skin Care sangat dibutuhkan didalam presentasi ataupun saat di pakai sendiri. Informasi yang dibutuhkan antara lain media interaktif tentang detail produk, media video tentang produk, dan media pemesanan. Melihat banyaknya karyawan Morisha Skin Care yang membutuhkan informasi detail produk maka penulis mencoba merancang sebuah aplikasi multimedia yang memberikan kemudahan dan informasi untuk karyawan Morisha Skin Care secara interaktif. Latar belakang diatas tersebut mendorong dibuatnya penelitian dengan judul Perancangan Multimedia Interaktif Untuk Profil Morisha Skin Care Di Yogyakarta 2. Dasar Teori 2.1 Konsep Dasar Aplikasi Multimedia 2.1.1 Definisi Aplikasi Aplikasi adalah suatu subkelas perangkat lunak komputer yang memanfaatkan kemampuan komputer langsung untuk melakukan suatu tugas yang diinginkan pengguna. Biasanya dibandingkan dengan perangkat lunak sistem yang mengintegrasikan berbagai kemampuan komputer, tapi tidak secara langsung menerapkan kemampuan tersebut untuk mengerjakan suatu tugas yang menguntungkan pengguna. 2.1.2 Definisi Multimedia Multimedia adalah kombinasi dari teks, foto, seni grafis, suara, animasi, dan elemen-elemen video yang dimanipulasi secara digital. Ketika anda mengizinkan pengguna akhir pemirsa dari proyek multimedia mengontrol apa dan kapan elemenelemen tersebut akan dikirimkan, multimedia disebut multimedia interaktif. Ketika anda menyediakan suatu struktur dari elemen-elemen yang terkait dimana pengguna dapat mengarahkannya, multimedia interaktif berubah menjadi hypermedia. 4
2.1.3 Pengertian Multimedia Beberapa pakar mengartikan multimedia sebagai berikut: 1. Multimedia secara umum merupakan kombinasi 3 elemen, yaitu suara, gambar, dan teks (Mc Cormick, 1996). 2. Multimedia adalah kombinasi dari paling sedikit 2 media input atau output dari data. Media ini dapat audio (suara, musik), animasi, video, teks, grafik, dan gambar (Turban, dkk., 2002). 3. Multimedia merupakan alat yang dapat menciptakan presentasi yang dinamis dan interaktif yang mengombinasikan teks, grafik, animasi, audio, dan gambar video (Robin dan Linda, 2001). 4. Multimedia adalah pemanfaatan komputer untuk membuat dan menggabungkan teks, grafik, audio, gambar bergerak (video dan animasi) dengan menggabungkan link dan tool yang memungkinkan pemakai melakukan navigasi, berinteraksi, berkreasi, dan berkomunikasi (Hofstetter, 2001). 2.2 Komponen Multimedia 2.2.1 Text Bentuk data multimedia yang paling mudah disimpan dan dikendalikan adalah text (teks). Teks dapat membentuk kata, surat atau narasi dalam multimedia yang menyajikan bahasa. Kebutuhan teks bergantung pada penggunaan aplikasi multimedia 2.2.2 Grafik Image (grafik) merupakan hasil sebuah pengambilan citra yang didapat melalui alat penangkap citra, seperti kamera dan scanner, yang hasilnya sering disebut dengan gambar. Gambar bisa berwujud sebuah ikon, foto ataupun simbol. 2.2.3 Suara/Audio Audio (suara) adalah komponen multimedia yang dapat berwujud narasi, musik, efek suara atau penggabungan di antara ketiganya. 2.2.4 Video Video merupakan sajian gambar dan suara yang ditangkap oleh sebuah kamera, yang kemudian disusun ke dalam urutan frame untuk dibaca dalam satuan detik 5
2.2.5 Animasi Animation (animasi) merupakan penggunaan komputer untuk menciptakan gerak pada layer. 2.2.6 Virtual Reality Dalam perkembangannya, komponen multimedia bertambah satu lagi, yaitu virtual reality. Virtual reality memungkinkan terjadinya hubungan timbal balik antar-user dengan aplikasi multimedia secara nyata. 2.3 Struktur Multimedia 2.3.1 Struktur Linier Struktur ini bisa dikatakan yang paling sederhana dalam mendesain aplikasi multimedia, karena informasi relasi ini lebih banyak menonjolkan topik tiap level. Maka jika kita ingin lebih menonjolkan arus informasi antara level 2-1 halaman, pertimbangkan pemakaian desain linear. Objek Multimedia Objek Multimedia Objek Multimedia Gambar 2.1 Struktur Linier 2.3.2 Struktur Menu obyek dalam menu dapat diwujudkan dalam garis garis Hypertext ketika anda memilih sebuah obyek dalam menu, obyek yang terhubung akan muncul dan tampil pada layar untuk memilih menu yang lain anda tinggal mengklik menu yang anda inginkan tersebut. 6
Gambar 2.2 Struktur Menu 2.3.3 Struktur Hierarki Struktur hierarki merupakan struktur seperti tangga atau pohon. Masing-masing obyek menyediakan menu pilihan yang menonjolkan lebih banyak menu dengan lebih banyak pilihan. Cocok untuk web, Company profile dan pembelajaran. Gambar 2.3 Struktur Hierarki 2.3.4 Struktur Jaringan Struktur jaringan merupakan desain yang paling kompleks. Dengan obyek yang dapat terhubung pada setiap obyek didalam aplikasi multimedia. Khusus aplikasi multimedia yang benar, desain struktur jaringan memungkin anda melakukan navigasi kesetiap layar. 7
Gambar 2.4 Struktur Jaringan 2.4 Perangkat Lunak 2.4.1 Adobe Flash CS3 Adobe Flash CS3 merupakan software yang bisa digunakan untuk menggambar dan sekaligus bisa untuk menganimasikannya. Selain itu didalam flash kita bisa memasukkan rumus fisika, matematika atau rumus-rumus lainnya dalam bentuk Action Script. 2.4.2 Adobe Photoshop CS3 Adobe Photoshop CS3 adalah software pengolah gambar yang sangat powerfull dengan segala fasilitasnya. Dalam Adobe Photoshop terdapat bagian-bagian seperti Menu bar, Tools panel/tool palette yang berisi tool untuk membuat atau mengolah image, artwork,dll, Control panel/option bar yang digunakan untuk menampilkan option dari tool yang aktif, Panel/palettes, dan Document window. 3. Analasis Dan Perancangan 3.1 Tinjauan Umum Secara umum aplikasi ini dirancang untuk memudahkan pengguna khususnya karyawan Morisha Skin Care. Pada aplikasi yang berupa keterangan-keterangan produk berupa tampilan flash ini pengguna dapat melihat produk dan juga detail-detail tentang produknya. Selain itu pengguna juga bisa melakukan perawatan wajah dirumah dengan panduan video yang ada di aplikasi. 8
3.2 Rancangan Interface 3.2.1 Struktur Aplikasi Yang Digunakan Untuk mempermudah dalam pembuatan aplikasi multimedia flash presentasi penulis mendesain rancangan aplikasi dengan tujuan untuk mempermudah dalam penyampaian informasi dan mempermudah dalam penggunaan interaktif sehingga lebih jelas dan terarah. Maka dari itu penulis dalam pembuatan aplikasi multimedia flash presentasi menggunakan struktur jaringan dimana alur informasi saling berhubungan. A F E Intro B C D Gambar 3.1 Struktur Jaringan Keterangan : A : Home B : Profil C : Produk D : Tips E : Pemesanan F : Peta 9
3.2.2 Rancangan Tampilan Desain Menu Gambar 3.2 Rancangan Menu Intro Gambar 3.3 Rancangan Menu Utama 3.2.3 Rancangan Grafik Proses perancangan grafik dalam multimedia mencakup elemen grafis diantaranya gambar, teks, audio, video. Pemeliharaan elemen yang tepat dalam perancangan grafik dapat mengoptimalkan proses dan hasil yang sesuai dengan tujuandalam pembuatan suatu aplikasi multimedia. Sesuai dengan rancangan desain dan menu yang ada maka penulis menggunakan format teks yang sesuai dengan tema skin 10
carei yaitu font yang formal, jadi tidak hanya satu format teks saja, sedangkan untuk menjelaskan uraian isi, gambar dengan format JPEG dan PNG. Untuk menjelaskan uraian isi Tips berupa video menggunakan format FLV. Karena aplikasi ini ditujukan untuk kebutuhan formal maka penulis tidak terlalu menonjolkan animasi pada tema dan menggunakan background yang sederhana. 3.2.4 Menulis Naskah Dalam merancang sebuah naskah harus menetapkan dialog dan urutan element-element secara rinci. Merancang naskah merupakan spesifikasi lengkap dari teks dan narasi dalam aplikasi multimedia. Naskah diperlukan untuk memberikan keterangan pada menu dan fitur aplikasi serta memberikan kemudahan kepada user untuk berinteraksi, sehingga informasi yang dibutuhkan mudah dipahami dan dimengerti. Dalam merancang naskah penulis menggunakan beberapa pertimbangan: Animasi Di dalam desain aplikasi ini, penulis menggunakan beberapa animasi gerak hanya pada menu utama agar menarik perhatian para pengunjung dan orang yang melihat aplikasi tersebut akan merasa tertarik untuk berkunjung. Desain Dalam membuat tampilan, penulis berusaha mendesain sesederhana mungkin supaya desain yang ditampilkan tidak berlebihan, dengan tujuan untuk mengurangi desain rumit yang mungkin tidak berguna. Warna Penulis mendesain dan menyesuaikan warna dalam pembuatan tampilan background berdasarkan judul tugas akhir yaitu Perancangan Multimedia Interaktif Untuk Profil Morisha Skin Care Di Yogyakarta, sehingga background yang digunakan mengandung unsur perawatan wanita dengan adanya gambar orang yang sedang melakukan perawatan wajah. Dan untuk memadukan dengan unsurunsur tersebut penulis banyak menggunakan warna putih sebagai background untuk memberikan nuansa kecerahan. 11
3.2.5 Desain Aplikasi 1. Intro Gambar 3.4 Tampilan Intro 2. Halaman Menu Gambar 3.5 Tampilan Menu 12
3. Halaman Menu Produk Gambar 3.6 Tampilan Produk 4. Halaman Menu Video 13
Gambar 3.7 Tampilan Video 14
DAFTAR PUSTAKA John M. Duff dan James L. Mohler. 1997, dalam buku Laura Lemay Web Workshop, Desain Grafik dan halaman Web, Jakarta. Mc Leod, Jr. Raymond. 1995 Management Information System. Edisi Bahasa Indonesia, Jilid II.Jakarta : PT Prenhalindo. Suyanto, M Analisis & Desain Aplikasi Multimedia untuk Pemasaran, Andi Offset Suyanto, M.2003.Multimedia Alat Untuk Meningkatkan Keunggulan Bersaing, Andi Offset. 15