BAB II TINJAUAN PUSTAKA 2.1. Desain Grafis Desain grafis adalah bentuk komunikasi visual yang digunakan untuk menyampaikan pesan atau informasi kepada audiensi (Landa, 2016). Solusi desain grafis dapat membujuk, menginformasikan, mengidentifikasi, memotivasi, meningkatkan kualitas, mengorganisasi, membangun merek, merangsang, menempatkan, mengikutsertakan, dan membawa atau menyampaikan berbagai tingkatan pesan. Solusi yang diberikan dalam desain tidak hanya harus efektif tetapi juga harus mengkomunikasikan ide. Desain memiliki berbagai elemen desain untuk terciptanya suatu prinsip desain. Elemen desain adalah salah satu hal terpenting dalam grafis desain karena elemen ini akan menjadi fondasi awal untuk merancang suatu desain. Menurut Lauer dan Pentak (2011), elemen desain terdiri dari enam hal yaitu line, shape, value, color, texture, dan illusion of space. Selanjutnya, dalam merancang desain membutuhkan beberapa prinsip desain seperti unity, balance, emphasis, rhythm, dan scale or proportion. 2.1.1. Elemen Desain Dalam buku Design Basics karya Lauer dan Pentak (2011), ada beberapa elemen desain yang diperlukan dalam perancangan, yaitu : 6
2.1.1.1. Line Secara teori garis hanya terdiri dari dimensi panjangnya tetapi dalam hal seni dan desain garis dapat memiliki dimensi yang bervariasi (Lauer & Pentak, 2011). Wujud garis dapat memberi emosi yang berbeda-beda seperti gugup, marah, bahagia, bebas, tenang, bersemangat, tenang, anggun, dan lain-lain. Penggunaan variasi garis ini perlu disesuaikan dengan kebutuhannya. Garis dalam desain memiliki tiga jenis yaitu actual lines, implied lines, dan psychic lines. 1. Actual Lines Actual lines dapat bervariasi dalam berat, karakter, dan makna lainnya untuk komposisi desain. Gambar 2. 1 Contoh Actual Lines (Lauer & Pentak, 2011) 2. Implied Lines Implied lines terbentuk dengan posisi serangkaian titik sehingga secara otomatis mata dapat menghubungkannya. 7
Gambar 2. 2 Contoh Implied Lines (Lauer & Pentak, 2011) 3. Psychic Lines Psychic lines tidak memiliki garis yang nyata namun dapat dirasakan seperti ketika seseorang sedang menunjuk sesuatu. Gambar 2. 3 Contoh Psychic Lines (Lauer & Pentak, 2011) 2.1.1.2. Shape Shape adalah area yang secara visual dibentuk oleh garis warna yang tertutup atau perubahan value yang menentukan tepi luar (Lauer & Pentak, 2011). Area kosong di dalam elemen visual dan ruang yang mengelilinginya dapat juga disebut shape. Bidang kosong juga dapat dianggap sebagai suatu elemen desain. 8
Shape juga dapat disebut dengan form. Kedua istilah ini umumnya identik dan sering digunakan secara bergantian. Shape adalah istilah yang lebih tepat karena form memiliki makna yang lain dalam seni. Gambar 2. 4 Contoh Shape (Lauer & Pentak, 2011) 2.1.1.3. Value Value dalam suatu area yang memiliki tingkat terang atau gelap dapat memberi konteks tertentu (Lauer & Pentak, 2011). Dalam desain kontras value dapat digunakan untuk menonjolkan suatu informasi yang ingin disampaikan. Penggunaan kontras terang dan gelap adalah hal terpenting dalam menciptakan focal point atau pusat perhatian dalam suatu desain. 9
Penekanan visual atau focal point sangat diperlukan dalam merancang desain untuk terciptanya hierarki dalam desain. Gambar 2. 5 Contoh Value (Lauer & Pentak, 2011) 2.1.1.4. Color Warna memiliki banyak aspek yang memiliki banyak arti berbeda sehingga peran warna adalah salah satu elemen yang kuat dalam desain (Lauer & Pentak, 2011). Warna memiliki peran untuk menginformasikan pesan serta kesan yang terkandung dalam sebuah desain. Warna memiliki tiga properti yaitu hue, value, dan intensity or complementary colors. 1. Hue Properti pertama dalam warna adalah hue. Hue adalah penggunaan nama pada warnanya seperti merah, oranye, hijau. Hue menggambarkan sensasi visual dari berbagai bagian spektrum warna. Maka dari itu, dari satu hue dapat bervariasi untuk mengahasilkan banyak warna. 10
Gambar 2. 6 Contoh Warna Hue (Lauer & Pentak, 2011) 2. Value Value adalah properti kedua warna yang mengacu pada terang atau gelapnya pada hue. Menambahkan putih mencerahkan warna dan menghasilkan warna, atau warna bernilai tinggi. Menambahkan hitam akan membuat warna lebih gelap dan menghasilkan warna yang teduh, atau bernilai rendah. 11
Gambar 2. 7 Contoh Warna Value (Lauer & Pentak, 2011) 3. Intensity or complementary colors Properti ketiga pada warna adalah intensity yang mengacu pada kecerahan warna. Warna berada pada intensitas yang penuh hanya ketika tidak dicampur. Mencampur warna hitam atau putih dengan warna akan mengubah value dan pada saat yang sama memengaruhi intensitasnya. Gambar 2. 8 Contoh Intensity or complementary colors (Lauer & Pentak, 2011) 2.1.1.5. Texture Di dalam seni, tekstur dikategorikan menjadi dua, yaitu tekstur tactile dan tekstur visual (Lauer & Pentak, 2011). Tekstur tactile adalah nyata, sehingga teksturnya dapat dirasakan permukaannya. Sedangkan tekstur 12
visual adalah ilusi, tekstur tersebut memberikan impresi yang sederhana dari tekstur yang nyata. Kedua tekstur ini dapat memberikan kesan bagi yang merasakan dan melihatnya. Gambar 2. 9 Contoh Texture (Lauer & Pentak, 2011) 2.1.1.6. Illusion of Space Ruang dapat dihadirkan dengan adanya bentuk (Lauer & Pentak, 2011). Pembagian bidang atau jarak antar objek berunsur titik, garis, bentuk, dan warna. Keberadaan ruang sebagai salah satu unsur visual sebenarnya tidak dapat diraba tetapi dapat dimengerti. 13
Gambar 2. 10 Contoh Illusion of Space (Lauer & Pentak, 2011) 2.1.2. Prinsip Desain Dalam buku Design Basics karya Lauer dan Pentak (2011), ada beberapa prinsip desain yang diperlukan dalam perancangan, yaitu : 2.1.2.1. Unity Dalam desain dibutuhkan adanya kesatuan untuk menciptakan sebuah struktur komposisi dan perpaduan yang teratur antara satu elemen ke elemen desain lainnya (Lauer & Pentak, 2011). Persatuan berarti bahwa ada kesesuaian di antara elemen-elemen dalam suatu desain. Aspek terpenting dari kesatuan visual adalah bahwa secara keseluruhan harus lebih dominan dibandingkan elemen individual lainnya. Setiap elemen lainnya mungkin memiliki makna dan menambahkan efek 14
tetapi jika audiensi bingung melihatnya maka desain tersebut tidak memiliki kesatuan visual. Dalam mencapai unity terdapat empat cara yaitu dengan teori gestalt, proximity, repetition, dan continuation. 1. Gestalt Desainer dalam menciptakan unity akan lebih mudah jika membuat audiensi mencari susunan dalam desain. Maka dari itu, desainer harus memberikan beberapa tanda untuk audiensi supaya menemukan suatu pola dan kesatuan yang koheren. Gambar 2. 11 Contoh Gestalt (Lauer & Pentak, 2011) 2. Proximity Proximity adalah salah satu cara mudah untuk mencapai unity karena dengan cara ini membuat berbagai elemen yang terpisah terlihat seperti bersatu. 15
Gambar 2. 12 Contoh Proximity (Lauer & Pentak, 2011) 3. Repetition Cara yang paling sering digunakan untuk mencapai unity adalah dengan repetition karena seperti istilah yang tersirat menggunakan sesuatu yang berulang dalam desain untuk menghubungkan bagian satu sama lain. 16
Gambar 2. 13 Contoh Repetition (Lauer & Pentak, 2011) 4. Continuation Continuation adalah cara yang lebih halus daripada proximity dan repetition karena mata audiensi dibawa dari satu elemen ke elemen berikutnya untuk mencapai unity. 17
Gambar 2. 14 Contoh Continuation (Lauer & Pentak, 2011) 2.1.2.2. Balance Keseimbangan merupakan sebuah stabilitas yang dapat tercipta melalui tampilan berat pada visual dari titik pusat yang terbagi secara merata pada setiap sisinya (Lauer & Pentak, 2011). Setiap elemen desain memiliki kekuatan dan berat yang terpancar secara visual. Tampilan berat pada setiap elemen desain secara visual tergantung pada beberapa faktor seperti ukuran, bentuk, warna dan tekstur yang dimiliki oleh masing-masing elemen. 18
Gambar 2. 15 Contoh Balance (Lauer & Pentak, 2011) 2.1.2.3. Emphasis Dalam menciptakan emphasis, seorang desainer perlu menampilkan konten yang disusun secara terstruktur serta mengontrol bagaimana cara informasi atau pesan dapat tersampaikan (Lauer & Pentak, 2011). Tekanan dapat dicapai dengan beberapa cara yaitu tekanan melalui contrast, isolation, dan placement. 1. Contrast Contrast adalah cara untuk membantu titik fokus dalam mengatur desain ketika pola terlalu kompleks. Ketika sebagian besar elemen gelap, bentuk cahaya akan memecah pola dan menjadi titik fokus. 19
Gambar 2. 16 Contoh Contrast (Lauer & Pentak, 2011) 2. Isolation Isolation adalah cara yang serupa dengan contrast tetapi isolation adalah bentuk sedangkan contrast adalah penempatan. Gambar 2. 17 Contoh Isolation (Lauer & Pentak, 2011) 3. Placement 20
Placement adalah cara menciptakan emphasis dengan penempatan elemen di satu titik sehingga perhatian audiensi diarahkan ke elemen tersebut. Gambar 2. 18 Contoh Placement (Lauer & Pentak, 2011) 2.1.2.4. Rhythm Dengan membuat proses pengulangan pada berbagai macam elemen desain, maka akan tercipta pola dan irama (Lauer & Pentak, 2011). Irama juga mampu menciptakan sebuah gambar atau desain yang menarik serta mampu menyampaikan pesan atau informasi melalui cara yang tidak terduga. 21
Gambar 2. 19 Contoh Rhythm (Lauer & Pentak, 2011) 2.1.2.5. Scale or Proportion Proporsi adalah perbandingan ukuran antara bagian dengan bagian dan antara bagian dengan keseluruhan (Lauer & Pentak, 2011). Prinsip komposisi tersebut menekankan pada ukuran dari suatu unsur yang akan disusun dan sejauh mana ukuran itu menujukan keharmonisan tampilan sesuatu desain. 22
Gambar 2. 20 Contoh Scale or Proportion (Lauer & Pentak, 2011) 2.1.3. Fungsi Desain Interaksi Menurut dari Interaction Design Foundation (2020), desain interaksi adalah interaksi antara pengguna dan produk. Tujuan dari desain interaksi adalah untuk menciptakan produk yang memungkinkan pengguna mendapatkan apa yang diingkannya dengan cara terbaik. Hal terpenting dalam mendesain adalah untuk memahami dan memprediksi bagaimana user akan berinteraksi dengan sistem. 2.1.3.1. Dimensi Desain Interaksi Kerangka dimensi dari desain interaksi adalah sebuah model yang berguna untuk memahami apa yang perlu diperlukan untuk membuat desain yang interaktif (Babich, 2019). Gillian Crampton Smith, adalah akademisi dalam bidang desain interaksi yang pertama kali memperkenalkan konsep dimensi desain interaksi. Pada saat itu hanya ada empat konsep dimensi 23
yang diperkenalkan lalu ditambahkan oleh Kevin Silver menjadi lima yaitu words, visual representations, physical objects or space, time, dan behaviour. 1. Words Penggunaan kata-kata dalam desain interaksi harus mudah dipahami oleh pengguna. Namun, penggunaan kata-kata yang dipilih juga tidak boleh memuat terlalu banyak informasi karena dapat membuat pengguna merasa bingung. 2. Visual Representations Visual representations menyangkut beberapa elemen grafis seperti gambar, tipografi, dan icon yang dapat berinteraksi dengan pengguna. Elemen visual tersebut bertujuan melengkapi kata-kata yang sudah dipilih agar bisa menyampaikan informasi kepada pengguna dengan tepat. a. Tipografi Tipografi adalah desain dari satu set karakter yang disatukan dengan properti visual yang konsisten (Landa, 2016). Biasanya, tipografi mencakup huruf, angka, simbol, tanda, tanda baca, dan aksen atau tanda diakritik. b. Icon 24
Menurut Hicks (2011), icon berfungsi untuk menginformasikan, menerjemahkan, dan memperingatkan. Jenis icon yang sering digunakan pada desain website dan user interface sering kali berupa piktogram, ideogram, ataupun bentuk sewenang-wenang. Icon dalam desain tersebut sering kali hanya berbentuk monokrom sehingga dapat membantu melakukan tindakan dan fungsi yang lebih jelas. 3. Physical Objects or Space Pemilihan platform produk yang dirancang untuk dapat berinteraksi kepada pengguna dengan contoh seperti ketika pengguna komputer harus dipastikan pengguna menggunakan mouse untuk mengoperasikan komputer tersebut. 4. Time Gerakan dan suara adalah salah satu elemen penting dalam desain interaksi pada suatu produk yang dapat membuat pengguna menghabiskan banyak waktu ketika pengguna berinteraksi kepada produk tersebut. Namun, perlu diperhatikan waktu interaksi pada elemen tersebut karena lama atau cepat interaksi penggunaan produk dapat membuat pengguna tertarik atau dapat juga kesulitan. 5. Behaviour Behaviour pada dimensi desain interaksi mencakup aksi dan reaksi karena dari feedback pengguna menggunakan produk dapat menjadi 25
sebuah iterasi untuk merancang desain produk yang lebih baik sesuai perilaku pengguna saat menggunakan produk tersebut. 2.2. Mobile Application Semakin populernya teknologi dan aplikasi seluler, membuat banyak perusahaan mengembangkan hubungan dengan konsumen melalui aplikasi seluler (Tarute, Nikou, & Gatautis, 2017). Karena itu, penting untuk memahami bagaimana merancang aplikasi berdasarkan preferensi konsumen. 2.2.1. Kategori aplikasi Menurut laman app categories dari Facebook for Developers aplikasi memiliki 13 kategori yaitu : 1. Bisnis dan Halaman Aplikasi yang membantu bisnis untuk berbagi, kolaborasi, dan perencanaan. 2. Komunitas dan Pemerintah Aplikasi yang mendukung acara lokal, organisasi dan asosiasi lokal, lembaga pemerintah, atau organisasi politik. 3. Pendidikan Aplikasi yang berfokus pada mengajarkan keterampilan dan mata pelajaran. 4. Hiburan Aplikasi yang dirancang untuk menghibur pengguna, dan yang berisi konten audio, visual, atau lainnya. 26
5. Game Aplikasi yang interaksi utamanya adalah bermain game dan tidak ada tujuan lain. Game bisa pemain tunggal atau multi pemain. 6. Gaya Hidup Aplikasi yang berfokus pada gaya hidup atau peningkatan diri, termasuk blog. 7. Bot Messenger untuk Bisnis Aplikasi yang menghubungkan bisnis dengan orang melalui bot messenger. 8. Berita Aplikasi yang berfokus pada topik peristiwa terbaru seperti politik, hiburan, bisnis, sains, teknologi, dan lain-lain. 9. Kuis dan Horoskop Aplikasi yang membuat hasil yang dipersonalisasi berdasarkan serangkaian pertanyaan atau profil sosial. 10. Belanja Aplikasi yang berkaitan dengan belanja dan membeli barang. 11. Jaringan Sosial dan Kencan Aplikasi yang menghubungkan orang dengan jaringan. 12. Pengriman Pesan 27
Aplikasi yang menghubungkan orang dengan orang melalui SMS, foto, suara, atau video. 13. Ultilitas dan Produktivitas Aplikasi yang berfokus pada organisasi, pemecahan masalah, atau penyempurnaan proses. 2.2.2. Perancangan Aplikasi Produk seluler selalu diciptakan dan dimulai dari memahami pengguna dan manfaat yang ditawarkan media (Fling, 2009). Perancangan aplikasi menggunakan empat buku yaitu buku karya Jenifer Tidwell yang berjudul Designing Interfaces, buku karya Dan Saffer yang berjudul Microinteractions, buku karya Kathryn McElroy yang berjudul Prototyping for Designers, dan buku karya Michael Evamy yang berjudul Logotype. 2.2.2.1. User Research User research menurut Jenifer Tidwell (2011) adalah mengumpulkan informasi pengguna untuk merancang suatu aplikasi yang dibagi menjadi empat metode yaitu direct observation, case studies, surveys, dan personas. Metode ini bertujuan untuk mendapatkan data yang akan diolah menjadi suatu aplikasi yang sesuai dengan penggunanya. 1. Direct Observation 28
Wawancara dan kunjungan ke pengguna di tempat untuk mengetahui kebiasaan pengguna dalam kehidupan sehari-hari dan kebiasaan pengguna dalam menggunakan suatu aplikasi. 2. Case Studies Case studies berguna untuk memberi perspektif yang lebih mendalam dan terperinci ke beberapa pengguna dalam menggunakan suatu aplikasi. Oleh karena itu, case studies dapat dijadikan pelajaran yang penting jika ingin mendapatkan informasi tentang konteks penggunaan aplikasi sebenarnya. 3. Surveys Surveys digunakan untuk mengumpulkan informasi dari banyak pengguna dan mendapatkan data tentang aspek-aspek tertentu dari target audiensi suatu aplikasi. 4. Personas Personas membantu dalam setelah mendapatkan informasi dari ketiga metode sebelumnya dan dijadikan data untuk merancang model aplikasi yang sesuai dengan pengguna. Hal ini bertujuan supaya setelah aplikasi diluncurkan dapat diterima oleh pengguna dengan baik. 29
2.2.2.2. Orginizing the Content Menurut Jenifer Tidwell (2011), Setiap halaman dalam suatu aplikasi dapat melakukan salah satu fungsi seperti show one single thing, show a list or set of things, dan facilitate a single task. Fungsi-fungsi tersebut disesuaikan dengan data yang telah diolah supaya aplikasi dapat berfungsi dengan optimal. 1. Show One Single Thing Fungsi show one single thing ini adalah halaman yang menunjukkan langsung kepada pengguna konten utama dari aplikasi. Contoh dari halaman ini adalah memiliki halaman panjang yang dapat digeser secara vertikal dan memiliki gambar atau artikel pada halaman tersebut. 2. Show a List or Set of Things Halaman ini menampilkan daftar-daftar barang yang dibutuhkan oleh pengguna dalam aplikasi. Halaman harus disusun secara menarik dan berbeda agar tidak menghilangkan ketertarikan pengguna ditengah pemakaian aplikasi. 3. Facilitate a Single Task Halaman ini berfungsi seperti formulir bagi pengguna aplikasi untuk masuk, daftar, mengunggah, membayar, atau mengganti pengaturan. 30
2.2.2.3. Navigation Navigation adalah tahap merancang suatu rambu-rambu pada aplikasi supaya pengguna tidak kehilangan arah dan bingung ketika menggunakan aplikasi (Tidwell, 2011). Fitur navigation harus memiliki tanda yang jelas dan tidak ambigu untuk memberi petunjuk kepada pengguna yang harus dilakukan selanjutnya. Navigation memiliki beberapa model yang tipikal pada situs atau aplikasi seperti multi-level dan stepwise 1. Multi-level Model multi-level memiliki halaman utama yang sepenuhnya terhubung dengan satu sama lain tetapi sub halaman hanya terhubung di antara bagian itu sendiri. Model ini sering juga digunakan pada website atau aplikasi. Gambar 2. 21 Contoh Multi-level (Tidwell, 2011) 2. Stepwise 31
Model stepwise digunakan untuk mengarahkan pengguna langkah demi langkah melalui halaman dalam urutan yang telah ditentukan. Gambar 2. 22 Contoh Stepwise (Tidwell, 2011) 2.2.2.4. Orginizing the Page Orginizing the page adalah tahap merancang layout pada setiap halaman untuk menarik perhatian pengguna saat menggunakan aplikasi (Tidwell, 2011). Perancangan layout halaman memiliki dua elemen yaitu visual hierarchy dan visual flow. Konsep visual hierarchy berperan dalam semua bentuk desain grafis. Inti konsep visual hierarchy adalah konten yang paling penting dan utama harus menonjol. Visual flow berkaitan dengan alur yang cenderung diikuti oleh mata pengguna saat membaca halaman dan ini terhubung dengan visual hierarchy karena dirancang untuk mengatur titik fokus pada setiap halaman. Penggunaan pola layout pada aplikasi yang umum adalah pola visual framework dan grid of equals. 1. Visual Framework Pola layout visual framework adalah desain pada halaman yang memiliki layout dasar yang sama, warna, dan elemen visual. Layout visual framework dapat digunakan untuk memberikan fleksibilitas ketika membuat desain meskipun konten pada halaman berbeda-beda. 32
Gambar 2. 23 Contoh Visual Framework (Tidwell, 2011) 2. Grid of Equals Pola layout grid of equals ketika ingin menampilkan item yang banyak tetapi memiliki gaya dan kepentingan yang sama. Penggunaan desain ketika perancangan mengikuti template yang umum dan bobot visual setiap item harus serupa. Item yang dimaksud dalam penggunaan layout grid of equals seperti artikel berita, blog, dan produk. 33
Gambar 2. 24 Contoh Grid of Equals (Tidwell, 2011) 2.2.2.5. Lists of Things Penggunaan fitur dari lists of things berguna untuk mendapatkan gambaran umum bagi pengguna saat menggunakan aplikasi atau saat pengguna mencari sesuatu yang spesifik pada halaman tertentu (Tidwell, 2011). Jenis teknik yang akan digunakan untuk perancangan aplikasi memiliki tiga jenis yaitu one-window drilldown, thumbnail grid, dan carousel. 1. One-Window Drilldown One-window drilldown adalah teknik untuk menunjukkan dari beberapa daftar item dalam satu halaman. Pengguna dapat melihat detail informasi ketika memilih salah satu dari item tersebut di halaman yang berbeda. 34
Gambar 2. 25 Contoh One-window Drilldown (Tidwell, 2011) 2. Thumbnail Grid Thumbnail grid adalah teknik menyusun daftar item secara visual untuk menarik perhatian pengguna. Teknik ini dapat digunakan oleh pembeli untuk melihat satu atau lebih dari beberapa item yang ingin dicari. 35
Gambar 2. 26 Contoh Thumbnail Grid (Tidwell, 2011) 3. Carousel Carousel adalah teknik yang menarik bagi pengguna dalam menggunakan aplikasi karena pengguna didorong untuk menjelajahi setiap item satu per satu dan memeriksa item yang terlihat. Gambar 2. 27 Contoh Carousel (Tidwell, 2011) 2.2.2.6. Actions and Commands Tujuan ketika merancang actions and commands adalah membuat tindakan yang tepat tersedia, memberi label dengan baik, dan mendukung urutan tindakan (Tidwell, 2011). Berikut adalah daftar tombol tindakan 36
yang digunakan dengan cara umum untuk pengguna menurut buku Designing Interfaces karya Jenifer Tidwell dalam perancangan aplikasi. 1. Buttons Tombol buttons yang ditempatkan langsung pada halaman aplikasi yang dibuat besar, mudah dibaca, dan mudah digunakan sehingga untuk pengguna yang mempunyai pengalaman minim dalam menggunakan aplikasi dapat menggunakannya juga. Gambar 2. 28 Contoh Buttons (Tidwell, 2011) 2. Links Link umumnya terdapat warna terutama warna biru dan menggaris bawahi suatu teks agar memberi kesan clickability. Gambar 2. 29 Contoh Links (Tidwell, 2011) 37
2.2.2.7. Information Graphics Information graphics adalah fitur yang membantu aplikasi untuk menjelaskan kepada pengguna suatu informasi yang kompleks (Tidwell, 2011). Information graphics secara sederhana adalah data yang disajikan secara visual atau data yang diinginkan oleh pengguna untuk mencapai tujuannya dalam menggunakan aplikasi. Information graphics memiliki interaktif yang bagus jika dapat menawarkan jawaban kepada pengguna seperti bagaimana data terorganisasi, bagaimana data dapat dieksplor, dan bagaimana pengguna mendapatkan data yang diinginkan. 2.2.2.8. Microinteractions Microinteractions adalah bagian kecil dari fungsi suatu produk yang hanya melakukan satu hal (Saffer, 2013). Detail dalam microinteractions dapat memudahkan pengguna dalam menggunakan produk bahkan tidak secara sadar mereka dapat mengingat fungsi microinteractions. Bagian kecil dari microinteractions dapat memberikan perasaan menyenangkan atau menarik kepada pengguna aplikasi. Microinteractions bagus untuk digunakan seperti menyelesaikan suatu tugas, menghubungkan dua perangkat secara bersamaan, berinteraksi pada satu data, menyesuaikan pengaturan, dan mengaktifkan atau menonaktifkan fitur atau fungsi. Microinteractions menurut buku Microinteractions karya Dan Saffer mempunyai empat struktur dalam melakukan perancangan yaitu triggers, rules, feedback, dan loops & modes. 1. Triggers 38
Triggers adalah bagian pertama dari microinteractions dan diperlukan pengguna untuk melakukan sesuatu terlebih dahulu untuk memulai microinteractions. Microinteractions dibutuhkan kebutuhan pengguna dalam apa yang ingin dicapai pengguna, kapan pengguna ingin melakukannya, dan seberapa sering pengguna melakukannya. Dengan mengetahui kebutuhan pengguna akan menentukan keterjangkauan, aksesbilitas, dan kelanjutan pemicunya. Namun triggers tidak selalu digunakan oleh pengguna, semakin banyak triggers yang dilakukan oleh sistem saat aplikasi mendeteksi kondisi tertentu telah terpenuhi maka microinteractions baru dapat dilakukan. Contoh triggers seperti dalam gambar, dalam iOS pengguna dapat menggunakan kamera meskipun handphone dalam keadaan terkunci. Gambar 2. 30 Contoh Triggers (Saffer, 2013) 39
2. Rules Rules dalam microinteractions ditentukan oleh desainer untuk membuat sebuah urutan dalam sistem aplikasi ketika microinteractions digunakan. Contoh rules dalam microinteractions adalah ketika menggunakan aplikasi Spotify lalu menyalakannya di device lain maka urutan pertama aplikasi tersebut akan dijeda. Jika pengguna melanjutkan menggunakan aplikasi di device pertama maka di dalam device kedua akan berhenti. Rules dalam microinteractions tersebut menciptakan layanan lintas device yang mudah dan tanpa hambatan. Gambar 2. 31 Contoh Rules (Saffer, 2013) 3. Feedback Feedback adalah untuk membantu memahami rules dari sebuah sistem dalam microinteractions. Feedback dapat dibentuk dalam beberapa 40
wujud seperti visual, aural, atau getaran. Feedback dapat mempunyai rules juga seperti ketika bagaimana pengguna ingin merubah warna atau ingin memutar posisi layar. Rules dalam feedback dapat menjadi microinteractions tersendiri, karena pengguna mungkin menyesuaikannya secara manual sebagai pengaturan. Contoh feedback seperti di dalam gambar ketika tombol process my order ditekan menjadi sebuah progress bar. Teks juga dapat berubah seiring perkembangan hingga selesai untuk memberikan informasi yang jelas kepada pengguna. Gambar 2. 32 Contoh Feedback (Saffer, 2013) 4. Loops and Modes Loops & modes adalah bagian akhir dari microinteractions karena dapat membentuk meta rules sendiri seperti seiring waktu dalam microinteractions apakah interaksi tersebut masih digunakan hingga dimatikan secara manual atau apa yang terjadi selama perubahan kondisi tertentu. Contoh loops & modes seperti di dalam gambar ketika ingin 41
berbelanja barang di eBay secara otomatis tombol berubah dari buy it now menjadi buy another. Gambar 2. 33 Contoh Loops and Modes (Saffer, 2013) 2.2.2.9. Low-Fidelity Digital Prototypes Low-fidelity digital prototypes adalah cara terbaik untuk merancang konsep sebelum merancang sesuatu yang lebih spesifik (McElroy, 2017). Dalam perancangan low-fidelity digital prototypes menggunakan tahapan seperti merancang wireframes. Wireframes adalah perancangan layout dari setiap halaman aplikasi. Perancangan layout pada halaman berdasarkan information architecture yang sudah dibuat. 42
Gambar 2. 34 Contoh Wirefames (McElroy, 2017) 2.2.2.10. Medium-Fidelity Digital Prototypes Mid-fidelity digital prototypes adalah tahapan peningkatan dari low-fidelity untuk merancang bagian yang ingin diuji lebih lanjut tetapi visual tetap rendah agar mendapatkan kedalaman yang lebih tinggi (McElroy, 2017). Mid-fidelity clickable prototypes adalah proses seperti meningkatkan low- fidelity yang terbuat dari paper prototypes dengan menggunakan software seperti Photoshop. 43
Gambar 2. 35 Contoh Mid-fidelity Digital Prototypes (McElroy, 2017) 2.2.2.11. High-Fidelity Digital Prototypes High-fidelity digital prototypes adalah tahap pengembangan aplikasi yang dapat dilakukan dengan developer untuk menjadikan aplikasi seperti produk asli (McElroy, 2017). High-fidelity clickable prototypes adalah peningkatan dari mid-fidelity dengan menggunakan interaksi yang lebih kompleks. Performa aplikasi pada tahap ini adalah yang diuji sebelum menjadi aplikasi yang dapat digunakan oleh pengguna. 44
Gambar 2. 36 Contoh High-fidelity Digital Prototypes (McElroy, 2017) 2.2.2.12. Testing Prototypes Testing prototypes menurut Kathryn McElroy (2017) dibagi menjadi tiga tahapan yaitu planning the research, conducting the research, dan synthesizing the research. 1. Planning the Research Planning the research adalah tahapan merancang rencana uji coba aplikasi seperti menentukan subjek pengujian, pertanyaan yang perlu ditanyakan, atau tugas yang perlu dikerjaan oleh pengguna untuk menguji aplikasi. 2. Conducting the Research 45
Conducting the research adalah mendokumentasikan seluruh sesi uji coba melaui pengambilan audio maupun gambar. Tahap ini mencatat semua pengalaman penguji secara verbal dan nonverbal. 3. Synthesizing the Research Synthesizing the research adalah tahap mengolah semua informasi menjadi data yang akan digunakan jika terdapat sebuah masalah dalam aplikasi yang sudah di uji coba sebelumnya atau performa aplikasi dapat ditingkatkan lagi. 2.2.2.13. Logotype Logotype atau tanda kata, monogram, dan tanda satu huruf adalah dimana verbal menjadi visual (Evamy, 2012). Survei pada logotype yang paling sederhana adalah kata atau singkatan diatur dalam jenis huruf yang dipilih untuk menyampaikan sesuatu dari sifat, status, atau karakter organisasi. Logotype adalah yang paling mendekati fashion typeface karena kesederhanaan memberikan penggunaan logo memiliki jangka yang panjang. Gambar 2. 37 Contoh Logotype (Evamy, 2012) 46
2.3. Fast Fashion Fast fashion adalah strategi retail dimana penjual mengadopsi pendekatan pemasaran untuk merespon tren fashion terkini dengan sering memperbarui produk dengan siklus pembaruan yang singkat dan mengubah katalog dengan cepat (Gupta & Gentry, 2019). Dengan semakin pendeknya siklus pembaruan, para peretail fast fashion memiliki jumlah produk yang terbatas di setiap stok gaya dan dengan sengaja memanipulasi produk di retail. Juga diketahui bahwa peretail fast fashion mengadopsi rantai pasokan yang lebih pendek dan fleksibel seperti respon yang cepat terhadap tren baru. 2.3.1. Perkembangan Industri Fast Fashion Secara historis, tipikal siklus hidup dari sebuah merek fashion mencakup empat tahap yaitu pengenalan dan adopsi gaya oleh trendsetter fashion, pertumbuhan dan penerimaan publik, integrasi massa, dan penurunan dan keusangan fashion (Gupta & Gentry, 2019). Ramalan fashion selama ini didominasi oleh fashion show dan peretail pakaian tradisional menggunakan kemampuannya untuk meramalkan permintaan konsumen dan tren fashion jauh sebelum dari waktu konsumsi sebenarnya. Untuk bersaing para peretail fashion sangat bergantung pada tren masa yang akan datang dibandingkan mencari data terkini untuk kebutuhan dan keinginan konsumen. Industri pakaian fashion berkembang secara signifikan pada akhir tahun 1990, ekspansi industri yang menyebabkan peningkatan musim fashion dan modifikasi karakteristik struktural dalam rantai pasokan. Faktor sosial budaya juga menciptakan laju kehidupan yang lebih cepat dengan kebutuhan dan 47
keinginan konsumen berubah banyak lebih cepat seperti pada perempuan lebih sering mengganti isi lemari pakaiannya dibandingkan sebelumnya. Budaya populer juga berperan penting dalam membentuk tren fashion dan kebangkitan fast fashion seperti musik, film, dan media lain yang memberikan pengaruh lebih besar kepada konsumen. Peretail fast fashion yang telah sukses seperti H&M dan Zara telah mengambil alih industri fashion. Pada tahun 2012, Zara peretail yang berbasis di Spanyol telah mendapatkan peningkatan penjualan sebesar 18 persen dan tempat retail yang berkembang di 86 pasar. Penjualan online di 21 negara berbasis platform e-commerce mencakup seluruh pasar berpotensi tinggi seperti China, Rusia, dan Kanada. 2.3.2. Karakteristik Peretail Fast Fashion Peretail fast fashion mempunyai karakteristik sendiri yang berbeda dengan peretail konvesional seperti pada tabel berikut perbedaan karakteristik peretail fast fashion dan peretail konvesional menurut Mihm (2010). Tabel 2. 1 Karakteristik Fast Fashion No. Fast Fashion Konvesional 1 Mengembangkan desain house in- Mengembangkan berbagai desainer dan merek in-house campuran dari 2 Sebagian memiliki produk besar produsen Sebagian besar produsen melakukan outsourcing manufaktur 3 Distribusi terpusat Distribusi regional 4 Produksi batch kecil Produksi batch besar 5 Produk baru dua kali dalam seminggu Enam koleksi dalam setahun 48
6 Harga bervariasi berdasarkan Penetapan harga standar lokasi negara 7 Mempertahankan margin laba tinggi Margin laba lebih rendah daripada yang diantisipasi 8 Menggunakan sangat sedikit iklan yang Menggunakan iklan yang banyak 9 Sedikit penjualan online atau tidak ada Menggunakan penjualan online 2.3.3. Konsumen Fast Fashion Motto "banyak identitas diri dalam evolusi" sangat berhasil memuaskan generasi muda dengan memenuhi kebutuhan mereka oleh peretail fast fashion (Gupta & Gentry, 2019). Identitas sementara ini merupakan fenomena postmodern dimana individu tidak dapat mempertahankan identitas dirinya dalam jangka waktu yang lama. Identitas diri ini terus berubah dengan adanya gaya hidup yang serba cepat sehingga dalam konteks fashion gaya baru terus menggantikan gaya yang lama dengan perubahan yang konstan. Konsumen fast fashion biasanya berusia antara 15 sampai 29 tahun dan konsumen muda ini memiliki disposable income yang memungkinkan mereka untuk sering membeli produk fast fashion. 2.3.4. Pemakaian Berkelanjutan Pemakaian berkelanjutan merupakan salah satu alternatif cara untuk mengurangi dampak buruk dari perubahan tren fashion yang cepat dengan cara memperpanjang jangka waktu pemakaian pakaian (Zamani, Sandin, & Peters, 2017). Perbedaan skenario pemakaian biasa dan pemakaian berkelanjutan akan terlihat seperti pada gambar berikut. 49
Gambar 2. 38 Skenario Pemakaian Berkelanjutan (Zamani, Sandin, & Peters, 2017) 50