PERANCANGAN VISUAL WEBSITE
KUIS KEPRIBADIAN BERDASARKAN
ENNEAGRAM
Fidelia
Universitas Bina NusantaraJl. K.H. Syahdan No. 9, Kemanggisan. Jakarta 11480 +62 21 534 5830 / +62 21 530 0244
fidel.zheng@yahoo.com
Untung Adha Saryanto, S.Sn.
Julianto, S.Sn., M.Sn.
ABSTRACT
Each human being is an individual with different personalities depending on the patterns of thought, emotion, and also their environment. Introspection and looking into yourself could be the way to know you better, but it's not enough. The purpose of this study was to make a tool for each individual to know his/her personality type and develop itself according to its type so that help existing problems in themselves and their environment in a good way. Research method applied by collecting quantitative data based on surveys, and in-depth review on some theories related to this topic. Analysis is done by designing creative strategies in terms of visual communication addressed to relevant targets and tailored to the medium used for visual placement. The result is a website personality quizzes with visual form of flat vector illustrations that explain every type of personality with an interesting way. Keywords : Enneagram, personality quiz, website, flat illustration
ABSTRAK
Setiap manusia merupakan individu dengan kepribadian yang berbeda-beda tergantung oleh pola pikir, emosi, dan juga lingkungannya. Kita dapat tahu kepribadian kita dengan cara instrospeksi ke dalam diri tapi hal tersebut tidaklah cukup. Tujuan dari penelitian ini adalah sebagai salah satu alat bantu untuk masing-masing individu untuk mengenal tipe kepribadiannya dan mengembangkan dirinya sesuai dengan tipenya sehingga mampu mengatasi masalah yang ada dalam diri maupun lingkungannya dengan cara yang baik. Metode penelitian yang dilakukan adalah pengumpulan data yang bersifat kuantitatif berdasarkan survei-survei yang pernah dilakukan oleh lembaga terpercaya dan tinjauan secara mendalam pada teori-teori yang bersangkutan dengan kepribadian, enneagram, dan juga teori-teori desain. Analisa dilakukan dengan merancang strategi kreatif dalam hal komunikasi visual yang ditujukan pada target bersangkutan dan disesuaikan dengan media yang digunakan untuk penempatan visual. Hasilnya adalah sebuah perancangan website kuis kepribadian dengan visual berupa ilustrasi flat vektor yang menjelaskan setiap tipe kepribadiannya dengan cara menarik.
PENDAHULUAN
Manusia pada kodratnya adalah individu yang unik dengan kepribadian yang berbeda-beda. Kepribadian seseorang terbentuk karena adanya pola perilaku, pemikiran, emosi, motivasi, dan kebiasaan yang terbentuk seiring manusia tersebut berkembang. Dengan adanya kepribadian ini, seorang manusia menjadi sadar secara fisik, emosi, pikiran, dan jiwa yang membawanya kepada aktualisasi diri.
Bentuk kesadaran ini umumnya mulai terbentuk di kaum muda saat memasuki usia 18 keatas. Setelah proses mencari jati dirinya dan juga perubahan secara fisik sebelumnya, pada tahap ini manusia mulai merasakan bahwa ia mempunyai kebutuhan untuk memaksimalkan kemampuan dan potensi dirinya sebagai manusia yang utuh. Mengetahui tipe kepribadian secara mendalam menjadi penting untuk proses aktualisasi diri. Ada banyak cara yang telah diriset oleh para ahli psikologi seperti salah satunya adalah enneagram.
Enneagram merupakan sebuah model kepribadian manusia yang terdiri dari sembilan tipe,
digambarkan dalam bentuk suatu lingkaran dengan gabungan titik-titik pada sudut segitiga dan heksagonal tak beraturan yang saling berhubungan. Tipe-tipe kepribadian ini pertama kali dikembangkan oleh Oscar Ichazo. Dalam studi enneagram, terdapat penjelasan dan pengarahan tentang perilaku seseorang seperti kelebihan kekurangan dalam tipe-tipenya. Dengan adanya ini, manusia bisa lebih mengenal dan mengembangkan dirinya untuk merespon tantangan dalam masyarakat. Manusia yang mengenal dirinya secara mendalam mampu mengatasi masalah dalam diri maupun lingkungannya dengan cara yang baik dan tidak merugikan diri sendiri maupun orang lain.
Di Indonesia, enneagram secara luas belum begitu dikenal oleh masyarakat. Literatur yang membahas enneagram berbahasa Indonesia masih sedikit, bahkan jarang ditemukan. Begitu pesatnya teknologi berkembang pada zaman sekarang juga tidak menambah pengenalan
enneagram secara luas. Memang ada artikel-artikel ataupun tes-tes singkat enneagram yang
dapat diakses secara online akan tetapi belum ada yang mengulasnya dengan lengkap. Oleh dari itu, penulis melihat peluang bahwa sangat disayangkan sampai sekarang ini belum ada website berbahasa Indonesia yang secara khusus membahas enneagram secara informatif dengan visual menarik. Terdapat banyaknya informasi dan pengetahuan tentang 9 tipe kepribadian manusia ini jika dilihat dan dipahami lebih dalam, akan dapat membantu seseorang dalam mengembangkan kepribadiannya maupun lebih mengenal kepribadian orang lain lebih mendalam. Maka dari itu, adanya keinginan untuk merancang sebuah
website kuis kepribadian berdasarkan tipe kepribadian enneagram. Sesuai dengan ilmu
desain komunikasi visual, website ini dirancang dengan tampilan yang menarik dan memiliki fitur yang interaktif yang memberikan user experience yang menyenangkan.
Tujuan dari perancangan ini tentunya adalah untuk membuat target sasaran tertarik dalam mengenal tipe kepribadiannya serta ingin mempelajari lebih lanjut tentang enneagram, serta dapat memahami pesan yang ingin disampaikan dengan baik dan dapat melakukan aksi penyebaran informasi kepada orang lain dengan bantuan media sosial yang sedang populer di masyarakat.
METODE PENELITIAN
Dalam mendukung perancangan tugas akhir ini, dikumpulkan berbagai informasi yang digunakan sebagai acuan, antara lain buku-buku maupun artikel yang membahas tentang
enneagram, serta data survei dan wawancara dari sumber yang jelas sebagai bahan
pertimbangan dalam menentukan target sasaran serta visual yang efektif dalam strategi komunikasi terhadap informasi-informasi yang ingin disampaikan. Selain itu dibahas pula teori-teori desain yang sejalan dengan topik dan juga analisa SWOT untuk merancang strategi desain yang tepat sesuai dengan strategi komunikasi yang telah dibuat.
HASIL DAN BAHASAN
Konsep Desain
Website ini merupakan website bersifat webaap yang di dalamnya terdapat kuis kepribadian,
ditampilkan dengan visual ikonik untuk menjelaskan sifat-sifat dari kepribadian manusia. Sesuai dengan big idea “Sembilan Persona” yang diangkat 9 personalisasi tiap karakter berupa peranan atau profesi yang ada dalam masyarakat, sesuai dengan tipe-tipe manusia pada enneagram.
Penggunaan ilustrasi sebagai elemen visual utama. Ilustrasi vektor untuk memudahkan penjelasan berbagai tipe kepribadian enneagram, serta istilah-istilah yang dipakai dalam teori kepribadian tersebut. Ilustrasi bertujuan sebagai graphical assets untuk mempermudah penyampaian informasi pada website.
Visual
Gaya desain yang digunakan adalah gaya flat design, di mana setiap elemen desain yang ada berfungsi untuk menjelaskan berbagai sifat manusia dan tipe-tipe kepribadian enneagram secara praktis dan tetap sebagaimana fungsinya ilustratif. Gaya ini dipakai agar memberi kesan simple dan minimalis. Selain itu, website ini disajikan dengan fitur slide content yang variatif agar lebih menarik.
Gambar 1 Salah Satu Ilustrasi Sifat Manusia dalam Website 9 Persona
Tipografi
Ada 3 jenis typeface yang digunakan, yaitu sans-serif dekoratif yang digunakan pada logo maupun tombol / button yang ada dalam website untuk memberikan kesan playful, slab-serif yang digunakan pada setiap header untuk menciptakan kesan bold, dapat jelas dibaca, serta penggunaan sans-serif pada setiap bodytext untuk memberikan kesan tegas, modern. Berikut gambaran typeface yang dipakai:
Gambar 2 Dari Kiri ke Kanan: Jaapokki–Sans-Serif Dekoratif, Roboto Slab Bold–Slab-Serif, Cabin Regular–Sans-Serif
Warna
Warna yang digunakan adalah warna-warna cerah agar pesan yang disampaikan sesuai dengan makna yang telah dibahas pada subbab sebelumnya. Berikut palet warnanya:
Gambar 3 Palet Warna yang Digunakan (Kode Warna dari Kiri ke Kanan #404041, #EF5E4C, #FBCE4A, #00AC80, #F1F1F2)
Untuk warna merah, hijau, dan biru selanjutnya akan dipakai sebagai warna dasar pada setiap tipe enneagram sesuai dengan pengkategorian tiap tipenya yang akan dijelaskan lebih lanjut pada subbab Hasil Visual.
Grid
Sistem grid yang digunakan untuk website 9persona ini adalah grid 12 kolom. Penggunaan 12 kolom ini fleksibel karna dapat dibagi menjadi 2, 3, 4, 6 ataupun 12 yang membuat variasi layout menjadi lebih mudah.
Gambar 4 Sistem Grid yang Digunakan
Site Map
Berikut site map dari website 9 persona:
Hasil Visual 1. Logo
Gambar 6 Logo 9 Persona
Logo 9 Persona menggunakan typeface Jaapokki dengan elemen visual lainnya seperti pita dan pancaran sinar untuk mencerminkan 9 Persona seperti emblem, di mana setiap persona pada website ini merupakan lambang dari masing-masing tipe. Pada tampilan website, agar terlihat menarik logo dibuat animasi bergerak naik-turun.
2. Ilustrasi Karakter
Dalam penjelasan di bab 2 dapat diketahui ada 3 kelompok besar yang di dalamnya terdapat 3 tipe kepribadian enneagram. Tiga kelompok besar itu yakni pusat naluriah, pusat berpikir, dan pusat perasaan. Ketiga kelompok besar tersebut akan diwakili oleh warna palet yang sesuai dengan sifat dari pusatnya. Pusat naluriah diwakili warna hijau, pusat berpikir diwakili warna biru, dan pusat perasaan diwakili warna merah. Berikut visualisasi karakter tipe kepribadian enneagram yang sudah dikategorikan dengan warnanya:
• Pusat Naluriah (Tipe 1, Tipe 8, dan Tipe 9)
Gambar 7 Visualisasi Tipe 1, Tipe 8, dan Tipe 9
The Reformer, tipe 1 yang realis dan idealis digambarkan sebagai seorang pekerja yang visioner dan seorang yang teliti dan mampu mengerjakan tugasnya dengan baik.
The Challenger, tipe8 yang kuat dan dominan. Tipe ini merupakan tipe yang jujur dalam bicara dan juga protektif. Oleh karena ini, tipe 8 ini digambarkan sebagai 2 orang pahlawan pembela kebenaran super.
The Peacemaker, tipe 9 yang damai dan tenang. Tipe ini divisualisasikan sebagai karakter hippies yang menggambarkan pribadi mereka yang cinta damai, dan konflik.
• Pusat Perasaan (Tipe 2, Tipe 3, dan Tipe 4)
Gambar 8 Visualisasi Tipe 2, Tipe 3, dan Tipe 4
The Helper, tipe interpersonal yang hangat dan suka menolong. Tipe ini digambarkan sebagai orang yang berprofesi suka menolong orang, yaitu petugas tim medis dan dokter. The Achiever, tipe pengejar prestasi ini digambarkan sebagai karakter yang suka mengikuti perlombaan dan juara, seorang lagi digambarkan sebagai mahasiswi yang lulus sarjana. The Individualist, tipe yang sensitif dan instrospektif. Umumnya berjiwa seni tinggi dan ingin tampil berbeda. Hal itu digambarkan melalui karakter dengan rambut pirang dan gaya yang nyentrik, salah satunya suka bercermin.
• Pusat Berpikir (Tipe 5, Tipe 6, dan Tipe 7)
Gambar 9 Visualisasi Tipe 5, Tipe 6, dan Tipe 7
The Investigator, tipe intens dan pemikir. Kedua karakter ini digambarkan sama-sama berprofesi menyelidik, yang satu menjadi detektif dan satu lagi menjadi saintis.
The Loyalist, tipe berkomitmen dan setia. Tipe ini divisualisasikan dengan dua karakter yang memiliki jiwa loyal yang tinggi. Karakter laki-lakinya digambarkan sebagai seorang ksatria dan yang perempuan seorang pelayan.
The Enthusiast, tipe yang suka mencari variasi kegiatan dan sibuk. Karakter ini divisualisasikan sebagai orang yang suka mencari pengalaman baru seperti petualang, dan salah satunya lagi pemandu wisata.
3. Tampilan Website
Pada halaman depan website memperlihatkan ilustrasi beberapa karakter yang mengelilingi logo 9 persona. User dapat mengikuti kuis dengan cara men-klik tombol “mulai kuis”. Tombol akan berubah warna menjadi hijau jika di hover.
Gambar 10 Landing Page
Setelah klik tombol “mulai kuis” akan muncul tampilan seperti di bawah ini. User difokuskan terlebih dahulu membaca instruksi kuinya. Pada tampilan selanjutnya, user dapat memilih gender yang menentukan pada bagian result kuis.
Gambar 11 Tampilan Halaman Kuis – Instruksi dan Pilih Gender
Setelah user memilih gender, akan masuk ke dalam halaman soal kuis yang terdiri dari 36 soal. Pada halaman soal kuis terdapat progress bar untuk memperlihatkan sudah sejauh mana user menjawab soal. Setelah selesai, akan muncul tampilan halaman result dari tipe sesuai dengan jawaban kuis berupa emblem ilustrasi karakter tipenya dan penjelasan mengenai tipe enneagram yang didapat. User bisa memilih untuk membaca keterangan lebih lanjut dengan memilih tombol “baca selengkapnya”. User juga dapat membagikan hasil kuis di media sosial mereka dengan men-klik tombol “share ke facebook” atau “share ke twitter”.
Gambar 12 Tampilan Halaman Soal Kuis dan Result
4. Preview Halaman Lainnya
5. Preview Versi Mobile
Gambar 14 Tampilan Mobile
6. Implementasi pada Media Lainnya • Grafis untuk Media Sosial
Gambar 15 Grafis pada Facebook dan Twitter
• Grafis untuk Wallpaper pada Download Menu
• Poster dan Flyer
Gambar 17 Poster Seri 1 dan Flyer
• Mouse Pad dan Kaos
Gambar 18 Mouse Pad dan Kaos
• Tote Bag, Pouch, Notes, dan Pen
• Sticker, Pin, dan Gantungan Kunci
Gambar 20 Sticker, Pin, dan Gantungan Kunci
• X-Banner
Gambar 21 X-Banner
SIMPULAN DAN SARAN
Pada perancangan website ini merupakan website bersifat webapp yang di dalamnya terdapat kuis kepribadian yang dipaparkan dengan visual ikonik untuk menjelaskan sifat-sifat dari kepribadian manusia sehingga target sasaran dapat memahaminya dengan lebih mudah. Dengan menggunakan gaya flat design, di mana setiap elemen desain yang ada berfungsi untuk menjelaskan berbagai tipe kepribadian secara praktis dan tetap sebagaimana fungsinya ilustratif–memperjelas isi konten yang ada. Di samping itu penggunaan elemen-elemen
visual seperti tipografi dan warna yang mendukung tampilan website agar tetap tercipta
website yang terlihat sederhana namun informatif serta bersifat menyenangkan dan akrab
dengan user-nya. Di lain hal yang masih terkait dengan masalah visual, seringkali sebagai desainer terlalu banyak berpikir dalam ranah interface dan akhirnya user experience yang didapat kurang baik. Ada baiknya kedua hal tersebut tetap diimbangi untuk menghasilkan tampilan yang menarik namun tetap memiliki navigasi yang mudah bagi para penggunanya.
REFERENSI
Buku
Baron, Renee., Elizabeth W. (2005). Eneagram, Mengenal 9 Tipe Kepribadian Manusia dengan Lebih Asyik. Jakarta : Serambi Ilmu Semesta
Baron, Renee., Elizabeth W. (2007). Enneagram of Love and Relationships. Jakarta: Serambi Ilmu Semesta
Benson, Nigel dkk. (2012). The Psychology Book (Big Ideas Simply Explained). DK
Bosler, Denise. (2012). Mastering Type: The Essential Guide to Typography for Print and
Web Design. F+W Media, Inc.
Duckett, Jon. (2011). HTML & CSS Design and Build Websites. John Wiley & Sons, Inc. Friedman, Howard S., Miriam W. (2006). Kepribadian: Teori Klasik dan Riset Modern Edisi 3 Jild 1. Jakarta : Erlangga
Garrett, Jesse J. (2011). The Elements of User Experience. New Riders Ichazo, Oscar. (1982). Interviews with Oscar Ichazo. Oscar Ichazo Fndt.
Morioka, Adams., Terry S. (2006). Color Design Workbook. Rockport Publishers, Inc. Sanafayong, Yongky. (2006). Desain Komunikasi Visual Terpadu. Jakarta: Arte Media Triedman, Karen., Cheryl D.C. (2004). Color Graphics: The Power of Color in Graphic
Design. Rockport Publishers
Wallschlaeger, Charles., Cynthia B. (1992). Basic Visual Concepts And Principles For
Artist, Architects, and Designers. McGraw-Hill
Website
APJII. (2013). The Profile of Indonesia’s Internet Users 2012. www.apijii.or.id, diakses 1 April 2015
Clum, Luke. (2013). A Look at Flat design and Why It's Significant, diakses 1 April 2015 dari http://uxmag.com/articles/a-look-at-flat-design-and-why-its-significant
Enneagram Institute (https://www.enneagraminstitute.com/)
Kemp, Simon. (2015). Digital, Social, and Mobile in APAC 2015, diakses 1 April 2015 dari wearesocial.sg
Schocker, Laura. (2014). This Is Why Those Online Personality Quizzes Are So Irresistible, diakses 1 April 2015 dari http://www.huffingtonpost.com/2014/02/05/psychology-online-quiz_n_4725593.html
RIWAYAT PENULIS
Fidelia lahir di kota Jakarta pada tanggal 10 November 1993. Penulis menamatkan
pendidikan S1 di Universitas Bina Nusantara dalam bidang Desain Komunikasi Visual program studi New Media pada tahun 2015.
