Al’ Amin, Membangun Aplikasi Simulasi Rambut Berdasarkan Bentuk Wajah dengan Menggunakan Flash 51
Membangun Aplikasi Simulasi Rambut Berdasarkan Bentuk Wajah dengan Menggunakan Flash M. Al’ Amin1, Ermanto2 Fakultas Teknik, Universitas Persada Indonesia Y.A.I. Jl. Salemba Saya 7/9A, Jakarta 10340, Indonesia Email:
[email protected],
[email protected] Abstract. In the modern era, many people consider appearance is very important in supporting their career. However, some people ignore their appearance while interesting look is one one major factor for success beside brain. Many people groom and style their hair and even have routine treatment in order to have attractive appearance but the results are far from satisfying. It might result from the lack of the improper methods applied by a hairdresser that the majority of the community is disappointed with the result. To help people in need of grooming requires an application that can display and provide information as well as training to hairdressing trainees based on the shapes of the faces to make each look good and interesting. The method applied in this research is the Multimedia Development Life Cycle (MDLC). This application was built by using Macromedia Flash 8 as a programming language design, Autodesk 3ds max9 and Adobe Photoshop CS3 to design the display. With the construction of this application is expected to provide trainee with the exisiting information needed and, therefore, the learning process can become more interesting and interactive so that the materials given can be more easily understood. Keywords: Attractive Appearance, Hairdro, MDLC, MacromediaFlash8, Autodesk 3dsmax9. Abstrak. Di zaman yang semakin modern ini, banyak orang berpendapat penampilan sangat penting dalam menunjang karier. Namun tidak sedikit dari masyarakat yang mengabaikan penampilannya, padahal unsur penampilan menarik menjadi salah satu faktor utama kesuksesan seseorang, selain faktor otak. Banyak dari sebagian masyarakat yang melakukan penataan rambut dan bahkan perawatan rutin agar memiliki penampilan menarik tetapi hasilnya kurang maksimal. Hal ini juga dipicu oleh kurang benarnya metode-metode dalam tata rambut yang dilakukan oleh seorang penata rambut, sehingga banyak dari sebagian masyarakat merasa kecewa akan hasil yang diharapkannya. Untuk membantu kebutuhan masyarakat dalam tata rambut tersebut dibutuhkan suatu aplikasi yang dapat menampilkan dan memberikan informasi serta pelatihan untuk siswa trainning tentang tata rambut berdasarkan bentuk wajah secara baik dan menarik. Metode yang dilakukan dalam penelitian ini adalah Multimedia Development Life Cycle (MDLC). Aplikasi ini dibangun menggunakan Macromedia Flash 8 sebagai bahasa pemrograman desain, autodesk 3ds max9 dan adobe photoshop CS3 untuk desain tampilan. Dengan dibangunnya aplikasi ini diharapkan dapat membantu dalam menyajikan informasi dan proses pembelajaran menjadi lebih menarik dan interaktif sehingga materi yang diberikan lebih mudah dipahami. Kata Kunci: penampilan menarik, tata rambut, MDLC, Macromedia Flash 8, Autodesk 3ds max9. 1. Pendahuluan Di zaman yang semakin modern ini, banyak orang berpendapat penampilan sangat penting dalam menunjang karier. Pasalnya banyak perusahaan yang hendak merekrut pegawai memasang iklan pada akhir pekan selalu mencantumkan ’penampilan menarik’ dari salah satu
52 Jurnal Buana Informatika, Volume 3, Nomor 1, Januari 2012:51-60
persyaratannya. Namun tidak sedikit dari masyarakat yang mengabaikan penampilannya, padahal unsur penampilan menarik menjadi salah satu faktor utama kesuksesan seseorang, selain faktor kecerdasan. Salah satu bukti dari kurangnya kesadaran masyarakat akan pentingnya penampilan dalam menunjang karier dapat dilihat dari program tata rambut atau perawatan yang semakin marak saat ini. Tidak dapat dipungkiri lagi hampir sebagian masyarakat memiliki masalah dengan penampilan. Banyak dari sebagian masyarakat yang melakukan tata rambut dan bahkan perawatan rutin agar memiliki penampilan menarik tetapi hasilnya kurang maksimal. Hal ini juga dipicu oleh kurang benarnya metode-metode dalam tata rambut yang dilakukan oleh seorang penata rambut, sehingga banyak dari sebagian masyarakat merasa kecewa akan hasil yang diharapkannya. Untuk membantu kebutuhan masyarakat dalamtata rambut tersebut, maka diperlukan media pelatihan yang dapat mengintegrasikan antara teks, gambar, video dan animasi untuk mempresentasikan tata rambut. Digunakanlah multimedia sebagai sarana untuk menunjang proses pembuatan media pelatihan tersebut. Salah satu contoh aplikasi multimedia yang digunakan adalah Macromedia flash 8 dan 3D Max. Oleh karena itu, penulis ”Membangun Aplikasi Simulasi Tata Rambut Berdasarkan Bentuk Wajah dengan Menggunakan Flash” sehingga hasil tata rambut menjadi efisien. 1.2. Rumusan Masalah Berdasarkan uraian latar belakang di atas, dapat disimpulkan masalah-masalah yang sering terjadi adalah (1) Menjalankan tata rambut yang efektif dengan bantuan simulasi. (2) Menentukan bentuk wajah dan model rambut yang cocok serta menarik sesuai dengan kebutuhan. (3) Menjelaskan keterkaitan antara tata rambut dengan bentuk wajah manusia. 1.3. Tujuan Penelitian Tujuan dari penelitian ini adalah: Membangun aplikasi simulasi tata rambut berdasarkan bentuk wajah. Yang diharapkan dapat membantu pihak pengelola salon dan pelanggannya memperoleh informasi yang lebih akurat tentang tata rambut berdasarkan bentuk wajah secara efektif dan efisien. 1.4. Batasan Masalah Pembatasan masalah akan dibatasi hanya pada: Simulasi tata rambut berdasarkan bentuk wajah manusia meliputi bentuk wajah bulat, bentuk wajah oval, bentuk wajah panjang, bentuk wajah persegi, dan bentuk wajah jantung. 2. Tinjauan Pustaka 2.1. Rambut 2.1.1. Tata Rambut Berbicara tentang tata rambut dapat ditinjau dari asal katanya, seperti yang dijelaskan dalam Kamus Besar Bahasa Indonesia tahun 1991 bahwa: Tata adalah sama dengan aturan, teknik atau susunan. Jadi tata merupakan kaidah seperti; mengatur, menyusun, memperbaiki dari kondisi yang ada menjadi lebih baik dan indah. Dengan demikian pengertian tata rambut adalah; suatu ilmu yang mempelajari bagaimana cara mengatur atau memperbaiki tatanan rambut, kondisi rambut yang dibentuk sedemikian rupa, dari yang ada menjadi lebih baik, indah dan mempesona, memiliki keseimbangan/keserasian dan simetris antara bagian-bagian tubuh lainnya (Rostamailis, 2008). 2.1.2. Anatomi dan Fisiologi Rambut Rambut dikenal sejak zaman dahulu dengan julukan “mahkota” bagi wanita. Tetapi di zaman yang sudah maju seperti sekarang, julukan tersebut tidak lagi tertuju hanya kepada kaum wanita, namun juga untuk pria. Peranan rambut sangat penting untuk diperhatikan, karena rambut bukan hanya sebagai pelindung kepala dari berbagai hal seperti bahaya
Al’ Amin, Membangun Aplikasi Simulasi Rambut Berdasarkan Bentuk Wajah dengan Menggunakan Flash 53
benturan/pukulan benda keras, sengatan sinar matahari, dan sebagainya, tetapi ia juga merupakan “perhiasan” yang berharga. Rambut yang tebal, panjang, hitam/berwarna, berkilau, sehat dan mudah diatur memberikan daya pesona tersendiri bagi pemiliknya. 2.2. Bentuk-bentuk Wajah 2.2.1. Bentuk Wajah Oval Bentuk wajah oval merupakan bentuk wajah yang paling ideal. Ciri khas dari bentuk ini adalah wajah tampak panjang dan lonjong dengan panjang dagu yang proporsional dengan kening. Meski bentuk wajah ini ideal untuk berbagai gaya rambut, namun hindari tatanan rambut yang bervolume dibagian puncak kepala karena memberi kesan bentuk wajah semakin panjang. Bisa juga menerapkan pembagian rambut yang simetris untuk menegaskan keseimbangan bentuk wajah. Lihat Gambar 1, urutan 1 dari kanan. 2.2.2. Bentuk Wajah Panjang Bentuk wajah panjang memiliki karakteristik bagian wajah samping yang tidak lebar (sempit) dengan ukuran kening hingga dagu yang panjang. Bentuk wajah ini dapat diseimbangkan dengan mengaplikasikan penataan rambut yang bervolume dibagian samping, mulai dari bagian pipi ke arah bawah. Biasa juga dengan menerapkan gaya rambut ikal bervolume yang terkesan alami dan acak, sehingga membuat wajah tampak lebih proporsional. Lihat Gambar 1, urutan 2 dari kanan. 2.2.3. Bentuk Wajah Bulat Bentuk wajah bulat di tandai dengan “panjang” dagu melebar kearah samping. Dengan kalimat lain, bentuk wajah ini memiliki proporsionalantara panjang dan lebar. Trik membuat bentuk wajah ini tampak lebih ramping dan proporsionaladalah dengan menerapkan gaya rambut geometris dan simetris, dengan konsep guntingan layer pada rambut panjang atau bob bertingkat untuk menyamarkan pipi dan pelipis, sekaligus membuat wajah tampak lebih panjang. Lihat Gambar 1, urutan 3 dari kanan.
Gambar 1. Contoh Bentuk Oval, Bentuk Panjang dan Bentuk Bulat (anonim, 2011)
2.2.4. Bentuk Wajah Persegi Bentuk wajah persegi ditandai dengan tulang rahang yang tegas yang lebarnya sejajar dengan kening. Cara terbaik untuk membuat bentuk wajah ini tampak proporsional adalah dengan menerapkan guntingan rambut yang bisa membantu menyamarkan rahang. Misalnya guntingan rambut layer atau gaya rambut ikal panjang yang membuat wajah tampak lebih lembut. Lihat Gambar 2, urutan 1 dari kanan.
Gambar 2. Contoh Bentuk Persegi Empat dan Bentuk Hati (anonim, 2011)
54 Jurnal Buana Informatika, Volume 3, Nomor 1, Januari 2012:51-60
2.2.5. Bentuk Wajah Hati Bentuk wajah hati ditandai dengan kening yang lebih lebar dibandingkan dengan bagian lain dari wajah serta dagu yang lancip. Kunci penataan rambut yang tepat untuk bentuk wajah yang ini adalah menjaga keseimbangan antara area kening dan dagu, yaitu dengan cara “menyamarkan” sebagai dari area kening dan/atau mengaplikasikan gaya rambut yang lebih bervolume dibagian rahang dan dagu. Lihat Gambar 2, urutan 2 dari kanan. 2.3. Konsep Dasar Multimedia 2.3.1. Pengertian Multimedia Meskipun definisi multimedia masih belum jelas, tetapi secara sederhana dapat diartikan sebagai “lebih dari satu media”. Multimedia bisa berupa kombinasi antara teks, grafik, animasi, suara dan gambar. Namun, pada bagian ini perpaduan dan kombinasi dua atau lebih jenis media ditekankan kepada kendali komputer sebagai penggerak keseluruhan gabungan media ini. Dengan demikian, arti multimedia yang umumnya dikenal dewasa ini adalah berbagai macam kombinasi grafik, teks, suara, video, dan animasi. Penggabungan ini merupakan suatu kesatuan yang secara bersama-sama menampilkan informasi, pesan atau isi pelajaran. 2.3.2. Macam Multimedia Macam-macam multimedia yaitu: (1) Linear multimedia. Dengan ciri-ciri: informasi sekuensial dan untuk jumlah audiens lebih dari satu orang. (2) Non-linear multimedia (multimedia interaktif). Dengan ciri-ciri: user dapat memilih apa yang akan dikerjakan dan untuk merancang aplikasi interaktif memerlukan kemampuan graphics art dan multimedia programming. 2.3.3. Pengembangan Multimedia Multimedia dapat dibuat melalui enam tahap pengembangan, yaitu Concept, Design, Material Collecting, Assembly, Testing, dan Distribution. Lihat Gambar 3.
Design Material Collecting
Concept
Distribution
Assembly
Testing
Gambar 3. Tahap Pengembangan Multimedia (Sutopo, 2003)
2.3.4. Konsep (Concept) Tahap concept yaitu menentukan tujuan, termasuk identifikasi audiens, macam aplikasi (presentasi, interaktif, dan lain-lain), tujuan aplikasi (informasi, hiburan, pelatihan, dan lainlain) dan spesifikasi umum. Output dari tahap concept ini biasanya dokumen dengan penulisan yang bersifat naratif yang mendeskripsikan proyek multimedia secara garis besar dan memudahkan dalam pengerjaan proyek multimedia pada tahap-tahap selanjutnya. 2.3.5. Perancangan (Design) Disini akan diuraikan mengenai spesifikasi secara rinci mengenai arsitektur proyek, gaya, dan kebutuhan material untuk proyek multimedia. Jika telah diuraikan secara detail dan rinci, maka pada tahap selanjutnya yaitu material collecting dan assembly tidak akan ada
Al’ Amin, Membangun Aplikasi Simulasi Rambut Berdasarkan Bentuk Wajah dengan Menggunakan Flash 55
banyak muncul keputusan baru berupa perubahan ataupun penambahan atau penghilangan materi yang dibutuhkan sehingga memudahkan kelancaran proyek multimedia. Tahap design (perancangan) dapat dibagi menjadi tiga tahap, antara lain: Desain Berbasis Multimedia, Desain Struktur Navigasi, dan Desain Berorientasi Objek. Namun yang akan dibahas lebih lanjut adalah mengenai desain berbasis multimedia dan desain struktur navigasi. 2.3.5.1. Desain berbasis Multimedia Metode desain ini dikembangkan dari metode perancangan pembuatan film menggunakan storyboard. Dalam perkembangannya multimedia memerlukan aspek interaktif, sehingga dilengkapi dengan flowchart view. Dengan menggunakan storyboard pembuat ataupun sponsor dapat mengetahui sketsa dari proyek multimedia yang akan dibuat. Di sini terdapat tampilan tiap scene beserta keterangan seperti hotkey, link, dsb. Sehingga memungkinkan untuk memproduksi dengan lebih mudah. Lihat Gambar 4.
Gambar 4. Storyboard (Sutopo, 2003)
2.3.5.2. Desain Struktur Navigasi Struktur navigasi adalah struktur atau alur dari suatu program (Sutopo, 2003). Salah satu bentuk dasar dari struktur navigasi yaitu Hierarchical Model diadaptasi dari top down design. Konsep navigasi ini dimulai dari satu node yang menjadi halaman utama atau halaman awal. Dari halaman tersebut dapat dibuat beberapa cabang ke halaman–halaman level 1. Halaman tersebut adalah isi atau halaman penunjang dari sebuah halaman utama, dari tiap halaman level 1 dapat juga dikembangkan menjadi beberapa cabang lagi. Lihat Gambar 5.
Gambar 5. Hierarchical Model (Sutopo, 2003)
56 Jurnal Buana Informatika, Volume 3, Nomor 1, Januari 2012:51-60
2.3.6. Pengumpulan Bahan (Material Collecting) Tahap ini dapat dilakukan bersamaan dengan tahap Assembly. Pada tahap ini dilakukan pengumpulan bahan yang dibutuhkan proyek seperti image, video, audio, editing animasi, dan sebagainya. 2.3.7. Pembuatan (Assembly) Inilah yang merupakan tahap inti dari pengerjaan proyek multimedia yaitu pembuatan. Di sini seluruh objek dan pengerjaannya dibuat. Assembly dilakukan berdasarkan apa yang sudah dibuat terlebih dahulu pada tahap design. 2.3.8. Uji Coba (Testing) Setelah aplikasi dibuat maka saatnya untuk diuji kemampuan dan kinerja dari aplikasi tersebut, apakah sudah sesuai dengan yang diharapkan. Di sini dilihat kembali (recompile) apakah semua link, tombol, dan fitur-fitur lainnya dapat berfungsi dengan baik. 2.3.9. Distribusi (Distribution) Tahap ini dilakukan jika aplikasi ingin digunakan pada komputer yang berbeda ataupun hendak dipasarkan. Adapun medianya bisa berupa Floopy Disk, tape, atau yang paling umum dan populer adalah menggunakan CD-ROM dan DVD-ROM disesuaikan dengan ukuran dari aplikasi beserta file-file yang menyertainya. 3. Metodologi Penelitian Dalam mengembangkan Aplikasi Tata Rambut Berdasarkan Bentuk Wajah ini, metodologi yang digunakan adalah Multimedia Development Life Cycle (MDLC) yang terdiri dari beberapa metode, yaitu antara lain sebagai berikut: (1) Concept, pada tahap ini penulis menentukan ide dan rencana tentang software yang akan dibuat. (2) Design, pada tahap ini penulis merancang layout dan mencatat materi atau bahan yang dibutuhkan dalam pembuatan software yang akan dibuat. (3) Material Collecting, pada tahap ini penulis mengumpulkan dan mempersiapkan semua apa yang telah dicatat untuk menunjang pembuatan software yang akan dibuat. (4) Assembly, pada tahap ini penulis membuat software yang telah dirancang dengan menggunakan materi yang sudah dikumpulkan dan dengan software yang menunjang. (5) Testing, pada tahap ini penulis melakukan pengujian pada software yang telah dibuat untuk mendeteksi bug atau kesalahan dan memperbaikinya. (6) Distribution, tahap menyimpan software yang telah dibuat ke dalam media penyimpanan berupa CD untuk diperluaskan atau ditaruh pada sebuah WEB agar dapat digunakan secara luas melalui internet. 4. Perancangan dan Pembahasan 4.1. Perancangan 4.1.1. Rancangan Storyboard Pada tahap pembuatan aplikasi ini, pertama-tama dibuat storyboard untuk halaman awal yang merupakan awal penggunaan aplikasi oleh pengguna, kemudian storyboard untuk scenescene berikutnya. yaitu: (1) Scene 1: Intro. Intro atau tampilan pembuka dari aplikasi. (2) Scene 2: Menu Utama, Menu utama yang menyediakan beberapa pilihan yaitu tutorial, refrensi dan simulasi. (3) Scene 3: Menu Tutorial. Menu Tutorial berisikan informasi mengenai penggunaan simulasi tata rambut berdasarkan bentuk wajah. (4) Scene 4: Menu Referensi. Menu Referensi berisikan informasi tentang kriteria tata rambut dan model rambut yang cocok dari beberapa bentuk wajah. (5) Scene 5: Menu Simulasi. Menu Simulasi memberikan gambaran mengenai prosedur dan langkah dalam tata rambut berdasarkan bentuk wajah secara visual. Menyediakan pilihan sub menu antara lain order, facial, model, dan proses. (6) Scene 5.1: Sub Order. Menampilkan list order berupa teks ketika orang tersebut datang ke salon, isi dari order list berisikan jenis rambut dan model rambut yang diinginkan seorang customer. (7) Scene 5.2: Sub Facial. Menampilkan beberapa bentuk wajah, seperti bentuk wajah ovel, bentuk wajah bulat, bentuk wajah panjang, bentuk wajah persegi, dan bentuk wajah jantung. (8) Scene 5.3: Sub
Al’ Amin, Membangun Aplikasi Simulasi Rambut Berdasarkan Bentuk Wajah dengan Menggunakan Flash 57
Model. Menampilkan beberapa model rambut yang akan di sesuaikan dengan bentuk wajah. (9) Scene 5.4: Sub Proses. Menampilkan gambaran secara visual mengenai proses pengerjaan dan hasil tata rambut berdasarkan bentuk wajah. 4.1.2. Perancangan Struktur Navigasi Struktur navigasi yang akan digunakan adalah Hierarchical Model dengan modifikasi seperlunya. Tambahan pada model ini dapat dilihat penggunaan intro Scene 1 yang dihubungkan dengan Scene 2. Kemudian Scene 2 mempunyai hubungan dengan Scene 3, Scene 4, dan Scene 5 (Gambar 6). Intro Scene 1
Menu Scene2
Tutorial Scene 3
Referensi Scene 4
Order
Simulasi Scene 5
Facial
Model
Proses
Gambar 6. Struktur Navigasi
4.2. Pembahasan 4.2.1. Tampilan Layar Intro Tampilan intro adalah tampilan awal dari aplikasi ini. Setelah tampilan intro ini pengguna dapat langsung menuju ke menu. Selain itu pada tahap intro ini juga dilengkapi dengan backsound dan berdurasi kurang lebih tiga puluh detik. Lihat Gambar 7.
Gambar 7. Tampilan Intro
4.2.2. Tampilan Menu Tampilan Menu merupakan tampilan setelah intro berlangsung. Pada form menu ini terdapat tiga kategori yaitu: Menu Tutorial, Menu Referensi, dan Menu Simulasi. Lihat Gambar 8.
58 Jurnal Buana Informatika, Volume 3, Nomor 1, Januari 2012:51-60
Gambar 8. Tampilan Menu.
4.2.3. Tampilan Submenu Tutorial Tampilan kategori ini menyediakan informasi mengenai panduan untuk mengoprasikan simulasi Tata Rambut Berdasarkan Bentuk Wajah. Tombol menu berfungsi untuk kembali ke menu utama. Backsound juga masih terdapat dalam katagori ini. Lihat Gambar 9.
Gambar 9. Tampilan Submenu Tutorial
4.2.4. Tampilan Submenu Referensi Tampilan kategoriini menyediakan informasi mengenai kriteria tata rambut dan model rambut yang cocok dari beberapa bentuk wajah. Tombol menu berfungsi untuk kembali ke menu utama. Backsound juga masih terdapat dalam katagori ini. Lihat Gambar 10.
Gambar 10. Tampilan Submenu Referensi
4.2.5. Tampilan Submenu Simulasi Tampilan kategoriini menyajikan gambaran mengenai langkah tata rambut berdasarkan bentuk wajah. Terdapat tombol order untuk menampilkan order list. Tombol facial untuk
Al’ Amin, Membangun Aplikasi Simulasi Rambut Berdasarkan Bentuk Wajah dengan Menggunakan Flash 59
menampilkan dan menentukan beberapa bentuk wajah. Tombol model untuk memberikan opsi model rambut yang sesuai dengan bentuk wajah. Tombol proses menggambarkan visualisasi tata rambut berdasarkan bentuk wajah. Lihat Gambar 11.
Gambar 11. Tampilan Submenu Simulasi
4.2.6. Tampilan Submenu Order Tampilan kategoriini menyajikan gambaran order list sebelum dilakukannya ke tahap proses. Lihat Gambar 12.
Gambar 12. Tampilan Submenu Order
4.2.7. Tampilan Submenu Facial Tampilan kategori ini menyajikan gambaran facial dengan menampilkan beberapa bentuk wajah sebelum dilakukannya ke tahap proses. Lihat Gambar 13.
Gambar 13. Tampilan Submenu Facial
4.2.8. Tampilan Submenu Model Tampilan kategori ini menyajikan gambaran beberapa opsi model rambut sebelum dilakukannya ke tahap proses. Gambar 14 merupakan tampilan dari kategori Submenu Model.
60 Jurnal Buana Informatika, Volume 3, Nomor 1, Januari 2012:51-60
Gambar 14. Tampilan Submenu Model
4.2.9. Tampilan Submenu Proses Tampilan kategori ini menyajikan gambaran secara visual pada pengerjaan tata rambut berdasarkan bentuk wajah. Tombol menu untuk kembali ke menu utama. Gambar 15 merupakan tampilan dari kategori Submenu Proses.
Gambar 15. Tampilan Submenu Proses
5. Kesimpulan Berdasarkan uraian diatas dapat ditarik kesimpulan (1) Sasaran utama aplikasi ini adalah sebagai alat bantu pelatihan bagi calon penata rambut. (2) Aplikasi ini membahas tata rambut berdasarkan bentuk wajah, meliputi bentuk wajah bulat, bentuk wajah oval, bentuk wajah panjang, bentuk wajah persegi, dan bentuk wajah hati. Referensi Rostamailis. 2008. Tata Kecantikan Rambut Jilid 1 untuk SMK. Klaten: Macanan Jaya Cemerlang. Rostamailis. 2008. Tata Kecantikan Rambut Jilid 2 untuk SMK. Klaten: Macanan Jaya Cemerlang. Sutopo. 2003. Multimedia Interaktif dengan Flash.Yogyakarta: Graha Ilmu. Anonim, 2011. (Online), (http://informasitips.com/potongan-rambut-berdasarkan-bentuk-wajahdan-postur-tubuh, diakses 15 Maret 2011).