PEMBUATAN INTERAKTIF COMPANY PROFILE KEYNA GALERI DENGAN MENGGUNAKAN TEKNIK PARALLAX SCROLLING Arief Zulkifli
1)
Karsam, MA., Ph.D (1) Sutikno (2) 1) D4 Komputer Multimedia, STIKOM Surabaya, email:
[email protected] Abstract
Interactive Multimedia is media that consists of many components or media connected to each other and be able to interact (Wirasamodra, 2008). Teaching media in the form of interactive multimedia has the ability to store audio-visual data, create interactive multimedia for promoting and imaging, as a new company or institution in dire need of it. The new institute is Keyna Gallery wants to make interactive company profile with new innovations. The new innovation is meant here is the development of innovation having developed from an idea, concept, or the creativity that exists. The innovation is uses parallax scrolling technique, parallax scrolling is understanding simulate 3D camera moves. Objects that are far away from the eyes appear to move slower than objects close to the eye (Stephen M. James, 2010). The workings of parallax scrolling is required animators create multiple layer containing an array of different objects and have separate sections also have a different speed layers with each others layer. With the parallax scrolling combined with interactive it will form a new thing for the company profile.
Keywords: Interactive Company Profile, Parallax Scrolling.
1
Keyna Galeri adalah sebuah lembaga seni baru yang unik dan bergerak di bidang seni dan multimedia. Keunikan yang dimiliki adalah selain bertempatkan di daerah kabupaten, Keyna Galeri bukan hanya mengkoleksi karya seni rupa tetapi juga karya multimedia dan buku. Keyna Galeri bertempatkan di Jalan Joyo Lengkoro No. 30 Ploso Jombang yang sedang melakukan pencitraan. Pencitraan menurut Setiawan Tirta Wijaya (www.konsultanseojakarta.com) sangat penting karena menggambarkan nilai, kepercayaan dan produktivitas perusahaan sehingga menghasilkan reputasi positif di mata publik. Salah satu bentuk pencitraan pada Keyna Galeri ini dibuat dalam bentuk interaktif company profile yang berisikan latar belakang atau seluk beluk dari Keyna Galeri, kumpulan karya-karya yang dihasilkan, serta tempat dan info tentang Keyna Galeri. Keyna Galeri membutuhkan interaktif Company Profile untuk digunakan sebagai media promosi atau media komunikasi kepada masyarakat, agar masyarakat mengetahui bahwa Keyna Galeri ini merupakan sebuah wadah atau tempat untuk menyalurkan karya-karya seni dari seniman-seniman dan juga karya-karya dari masyarakat. Dalam hal ini Keyna Galeri membutuhkan interaktif yang tidak hanya bermain-main pada grafis atau animasi tetapi juga membutuhkan inovasi yang baru. Dari kajian terdahulu, inovasi menurut (Clark and Guy, 1997:
5) adalah aplikasi komersial yang pertama kali dari suatu produk atau proses yang baru. Dengan adanya inovasi tersebut terbentuklah sebuah konsep pembuatan interaktif company profile dengan menggunakan teknik Parallax (Multi-Plane) Scrolling. Dari pihak Keyna Galeri setuju dengan interaktif dengan teknik Parallax Scrolling. Dijelaskan bahwa pengertian Parallax Scrolling menurut Stephen M.James(www. Interactivellama.com) adalah: Parallax Scrolling mensimulasikan kamera 3D yang bergerak. Objek yang jauh dari mata terlihat bergerak lebih lambat dari objek yang dekat dengan mata. Ada dua cara untuk membuat parallax scrolling. Salah satunya adalah memiliki tiga objek. Salah satu di latar depan, latar tengah, dan latar belakang. Jika kamera bergerak ke kiri, latar depan, latar tengah jalan ke kanan (arah berlawanan), sedangkan langkah latar belakang (searah) kiri. Semua langkah tiga dengan kecepatan yang berbeda dengan latar belakang bergerak lambat dan latar depan bergerak tercepat. Semakin dekat suatu obyek penampil lebih cepat obyek tampak bergerak. Penggabungan interaktif dan parallax scrolling akan menghasilkan sesuatu yang baru. Karena merupakan sebuah inovasi yang jarang sekali para pembuat interaktif menggunakan teknik ini, dan dapat menggambarkan situasi secara real melalui gambar atau foto.
2
Teknik Parallax Scrolling yang akan diaplikasikan ke dalam Interaktif Company Profile Keyna Galeri untuk memudahkan akses informasi tentang galeri, fasilitas galeri, dan mevisualisasikan hasil-hasil karya seni yang terdapat di Keyna Galeri kepada masyarakat luas dan membantu mengembangkan Keyna Galeri untuk ke depannya.
digunakan dalam SDLC diantara adalah planning atau perencanaan, analisa, desain, implementasi (build and coding), pengujuan (testing), dan pemeliharaan (maintenance).
TUJUAN Tujuan dibuatnya interaktif company profile Keyna Galeri ini adalah: Membuat interaktif company profile yang mampu menggambarkan ciri khas Keyna Galeri. Membuat interaktif company profile Keyna Galeri yang dapat menyampaikan informasi kepada masyarakat tentang karya seni dan multimedia. Membuat interaktif company profile Keyna Galeri dengan menggunakan teknik Parallax Scrolling. Membuat interaktif company profile Keyna Galeri yang ditujukan untuk semua lapisan masyarakat.
Gambar Diagram Metodologi Perancangan menggunakan Sistem SDLC Ide dan Konsep Awal Interaktif
Ide awal dalam pembuatan interaktif untuk company profile ini setelah mengetahui sebuah galeri seni baru yang bertempatkan di Ploso Jombang dan dikelola oleh Bapak Karsam, yang belum memiliki media promosi atau media untuk memperkenalkan galerinya kepada masyarakat luas dan media untuk mempresentasikan terhadap kalangan masyarakat luas. Salah satunya dengan membuatkan interaktif company profile.
METODE PENELITIAN Metode penelitian yang digunakan dalam proses pembuatan interaktif ini dilakukan berdasarkan SDLC (System Development Life Cycle) dimana SDLC didefinisikan oleh Dewan Perwakilan Rakyat AS sebagai sebuah proses pengembangan software yang digunakan oleh analis sistem, untuk mengembangkan sebuah sistem informasi. Tahapan-tahapan yang
Konsep CD interktif company profile ini berawal dari saya melihat sebuah website dengan tampilan teknik parallax yang umum disebut dengan ilusi mata dengan terdiri dari 3 (tiga) objek yang apabila mouse digerakkan kearah kanan maka objek bergerak kearah kiri dan sebaliknya dan dengan memiliki kecepatan gerak yang berbeda. 3
Dari hal itu terpikirkan untuk menggunakan teknik tersebut untuk membuat interaktif company profile. Dengan mengacu dan menyesuaikan pada keyword dan analisa warna konsep yang akan digunakan adalah classic dengan menggunakan properti visual yang berupa foto-foto karya yang disusun dalam ruangan.
profile Keyna Galeri ini yaitu jenis huruf serif seperti Black Chancery dan Gabriola Menurut Adi Kusrianto dalam bukunya Pengantar Tipografi (Adi Kuristianto, 2010:48) menjelaskan font serif ini dikenal lebih legible dan readable karena garis horizontal pada masing-masing kaki font membantu menuntun pandangan mata pembaca pada garis teks yang tengah dibacanya. Berikut adalah font yang nantinya akan dipilih dan digunakan untuk pembuatan interaktif company profile Keyna Galeri yang disesuaikan berdasarkan keyword dan legiblenya.
Alur Sistem Interaktif
6.
suara atau bunyi yang dihasilkan ketika molekul di udara berubah oleh suatu gerakan yang ditimbulkan sebuah objek yang menghasilkan getaran. Pada interaktif Keyna Galeri ini dimasukkan beberapa audio yang bisa mendukung suasana. Setelah melakukan wawancara kepada owner dari Keyna Galeri untuk menentukan audio yang digunakan adalah lagu instrumental jawa.
Gambar Alur Sistem Interaktif Struktur Navigasi
7. Gambar Struktur Navigasi Full Web
5.
Audio
Warna Pada interaktif Keyna Galeri ini telah ditemukan sebuah keyword yang terdapat di teori warna kobayashi yaitu provincial. Warna
Tipografi
Pemilihan jenis huruf yang akan digunakan pada interaktif company 4
ini yang disesuaikan dengan visi dan misi dari Keyna Galeri.
Dalam pembuatan layer ini memiliki tahapan-tahapan yang perlu diperhatikan yakni menentukan back layer, middle layer, dan front layer agar memudahkan pada saat proses input layout pada aplikasi adobe flash. Dapat diperhatikan semua prosesnya seperti pada gambar dibawah ini:
8. Komposisi Interaktif company profile Keyna Galeri ini menggunakan teknik Parallax Scrolling, yang dimana teknik ini memerlukan beberapa bagian layer atau latar yaitu latar belakang, latar tengah, dan latar depan yang akan digunakan untuk menunjang effect dari parallax scrolling. Setiap latar memiliki bagian-bagian yang berbeda dan perlu memperhatikan komposisi, angle dan perspektifnya.
3.
Dalam proses croping object photo ini merupakan proses penyesuaian objek yang nantinya akan diletakkan pada layer-layer yang telah jadi sebelumnya sebagai objek thumbnail yang tujuannya untuk mewakili isi dari objek-objek yang nanti akang ditampilkan dalam sebuah galeri. Dengan melakukan proses croping, pada bagian-bagian dari photo yang tidak dibutuhkan dapat dibuang dan membuat objek itu berdiri sendiri dalam file dengan berformat png dengan memiliki bagian yang transparan. Berikut adalah langkah-langkah untuk membuat objek tersebut:
IMPLEMENTASI 1.
Pemotretan Objek
Pemotretan objek harus dimulai sejak awal karena akan digunakan untuk sign (tanda/simbol) yang mewakili dari isi yang akan ditampilkan dan digunakan juga untuk memberikan pengelompokan tersendiri. Seperti pada gambar-gambar dibawah ini merupakan objek yang akang digunakan sebagai sign.
4.
2.
Croping Object Photo
Penempatan Komposisi
Tahapan ini adalah fase dimana layer background mulai dikombinasikan dengan thumbnail yang sudah diedit kemudian dipadukan menjadi satu kesatuan, kemudian digabung menjadi satu membentuk susunan dan suasana ruangan. Bisa dilihat pada gambar 4.19,
Pembuatan Layer
Pembuatan layer ini harus dimulai terlebih dahulu karena digunakan sebagai acuan dalam animasi interaktif. 5
gambar 4.20 dan gambar 4.21 berikut ini:
aplikasi interaktif dapat digunakan di media komputer atau laptop, tanpa kendala perbedaan sistem operasi.
KESIMPULAN
5.
Dari penelitian yang dilakukan dapat dilihat bahwa dalam proses pembuatan interaktif company profile Keyna Galeri dengan menggunakan teknik Parallax Scrolling dengan mampu memberikan gambaran tentang ciri khas keyna galeri dengan adanya penyesuaian penggambaran kondisi yang ada di Keyna Galeri. Dengan penggunaan teknik parallax scrolling pada company profile Keyna Galeri ini juga untuk mempermudah akses dari halaman ke halaman berikutnya dengan menggeser mouse kearah kanan namun perlu diperhatikan juga pada kecepatan gesernya. Teknik parallax scrolling ini dengan menggunakan beberapa layer dengan lebih memperhatikan lagi penempatan objek dan komposisi objek yang digunakan sehingga hasil transisi dari parallax scrolling memiliki komposisi dan gerakan juga efek yang dihasilkan bagus. Dengan adanya kemudahan untuk mengakses setiap isi dari company profile Keyna Galeri informasi yang tertampung di dalam company profile tersebut dapat tersampaikan dengan memberikan tampilan yang tersusun dengan rapi sehingga informasi dapat tersampaikan dengan baik.
Editing
Proses ini merupakan proses finishing project, karena ini adalah tahapan akhir yang diambil untuk membuat suatu interaktif Parallax Scrolling. Ditahap ini, akan dijelaskan bagaimana langkahlangkah dalam menggabungkan layer per layer dalam frame interaktif.
6.
Finishing
Ini adalah fase terakhir dalam sebuah produksi animasi, pada tahapan ini adalah tahap publikasi atau export file ke dalam sebuah animasi yang berformat swf. Hal ini bertujuan agar animasi atau
SARAN 6
Dalam pembuatan interaktif dengan teknik Parallax Scrolling hendaknya dipikirkan sebuah tema dan konsep yang jelas untuk melandasinya. Diharapkan untuk pengembang materi teknik interaktif dengan teknik parallax scrolling lebih memperhatikan komposisi objek dan juga memperhatikan unit interface juga sudut pandang sehingga objek tidak terlihat datar dan lebih memiliki dimensi isi. Kunci dari pembuatan parallax scrolling ini adalah teliti dan pertimbangan akang komposisi.
Personal and Professional Use. Japan: Kodansa America. Komputer, W, 2009, ShortCourse: Desain Grafis dengan CorelDRAW X4, Semarang: ANDI OFFSET. Kusrianto, A, 2010, Pengantar Tipografi, Jakarta: PT. Elex Media Komputindo. Profil, Company, 2011, 4 Faktor Penting Dalam Company Profile,
. (diakses pada tanggal 12 September 2012).
DAFTAR PUSTAKA Clark and Guy, 1997, Innovation in Business and Enterprice Technologies and Frameworks, Harshey, PA: Business Science Reference.
Putrasun, 2011, Graphic Standart Manual, . (diakses pada tanggal 20 Desember 2012).
Desain, Getart, 2011, Fungsi Company Profile, . (diakses pada tanggal 12 September 2012).
Sugeng Widada, L. S. (2008: 92), Journal Enriching Corporate Identity dalam Perancangan Graphic Standart Manual.
James, S. M., 2010, Flash : Parallax (Multi-plane) scrolling with ActionScript, . (diakses pada tanggal 12 September 2012.
Suyanto, 2004, Panduan Mengenal Desain Grafis, . (diakses pada tanggal 12 September 2012).
Kobayashi, Shigenobu. 1998. Colorist: A Practical Handbook for
7