Kenapa Design System itu Sangat Penting 🕺
Berbagi cerita tentang GO-JEK Design Language System (asphalt.gojek.io) dari perspective Product Designer. Dari yang tadinya skeptis, menjadi seorang penikmat dan pecandu Design System. Dan bagaimana saya bekerja dan menerapkannya dalam serangkaian proses desain.
Quote andalan dari Alla K
“Design Systems is about how to approach your design process more systematically, and ensure your design system helps to achieve the purpose of your product and fits with the culture of your team.
— Alla Kholmatova. “Design Systems.”
🧐 Apa Design System itu?
Saya coba menarik beberapa definisi dari pengalaman saya.
Design System itu menurut saya adalah sebuah cara yang sistematis dan kolaboratif yang dapat mempercepat dan mempermudah proses design dan development. Dibuat berdasarkan kebutuhan, memiliki tujuan, dan mendukung scalability produk kita. Bukan hasil duplikasi dari Design System produk lain dan menerapkannya pada produk kita.
😱 Mitos tentang design system
Berdasarkan pengalaman ketika pertama kali berkenalan dengan Design System, termasuk saya dan beberapa stakeholders lainnya. Yang cenderung beranggapan bahwa Design System itu:
- Bikinnya makan waktu lama
- Ga fleksible, kaku
- Membatasi kreativitas desainer
- Buang-buang waktu
- Ga bisa support needs dari product
- Mengurangi lapangan pekerjaan
Jadi beberapa pikiran dan asumsi negatif diatas membuat orang-orang sinis & skeptis dengan Design System dan orang-orang yang terlibat didalamnya 😁. Yang mana itu jelas tidak baik.
😰 Sebelum menggunakan Design System
Beberapa masalah yang timbul sebelum menggunakan Design System pada beberapa fase dibawah ini:
1. Fase design
Fase ini adalah fase dimana terdapat beberapa masalah yang berhubungan dengan design yang mempengaruhi beberapa hal seperti waktu, estetika, konsistensi, style, dll.
- Menghabiskan waktu yang lama pada saat mendesain. Designer cenderung terlalu lama ber-eksplorasi dan mencari inspirasi visual
- Pada saat design review, semua orang cenderung fokus dan berdebat tentang estetika dan hal-hal yang subjective
- Desain tidak konsisten dimana-mana
- Ketidak seragaman style antara masing-masing designer
- Tidak memiliki standar dan identitas design
2. Fase development
- Effort yang berlebih disisi engineering dikarenakan adanya ketidak konsistenan pada design. Design yang seharusnya memiliki konsep atau jenis informasi yang sama/serupa, namun menggunakan design dan pendekatan yang berbeda
- Perubahan visual yang dilakukan oleh designer tidak langsung ter sinkronisasi dan memperbaharui komponen/elemen yang ada.
3. Fase setelah di rilis
Ini adalah fase dimana product/aplikasi Kita telah dirilis ke production atau diuji coba ke beberapa pengguna.
- Pengguna kesulitan berinteraksi dan menerima informasi karena terdapat ketidak konsistenan dari sisi User interface dan juga User Experience. Product/aplikasi yang seharusnya memiliki design, konsep dan informasi yang sama namun menggunakan pendekatan dan desain berbeda.
🤗 Benefit dan fakta
Berikut ini beberapa benefit dan fakta yang sekaligus dapat dijadikan tolak ukur keberhasilan dari Design System itu sendiri.
1. Alignment & consistency
Menjaga konsistensi pada semua platform, mengurangi redundancy, dan menjaga standar behavior untuk tiap-tiap elemen yang penting terkait usability.
2. Efficiency (gaining time & speed)
- Mempercepat proses desain dan development karena Design System menyediakan shared-library dan guidelines dari komponen yang reusable
- Designer mempunyai banyak waktu untuk fokus pada pengguna dan kebutuhan pengguna. Yang mana akan sangat berdampak positif untuk produk & organisasi/perusahaan
- Meng-eliminasi perkerjaan yang repetitive
- Save time & money
- Avoiding design & technical dept (Redundant code)
3. Trust & Intuitive
- Meningkatkan brand trust dengan memberikan pengalaman pengguna yang konsisten dan positif dalam penggunaan produk
- Meningkatkan pemahaman pengguna terhadap product
4. Collaborative & Knowledge sharing
- Membangun mindset kolaborasi dan support teamwork, karena semua orang bekerjasama dalam satu wadah. Mereka menjalankan, menjaga, dan merawat design system itu sendiri serta reducing design debate
- Shared Vocabulary, memiliki bahasa yg sama dan visi dan misi yang sama
- Member baru akan jauh memiliki proses orientasi yang lebih mudah.
5. Flexibility & Constantly Evolving
- Design system akan terus tumbuh, akan terus beradaptasi dan berevolusi berdasarkan kebutuhan product kita (User needs & Business needs)
6. Scalability
- Membantu skala bisnis dengan fondasi yang kuat untuk mengurangi biaya desain dan development di masa depan.
🤖 Bagaimana Design System itu bekerja?
Berikut ini adalah contoh case study sederhana bagaimana saya menggunakan Design System itu pada saat membuat product baru. Case study sederhana ini adalah membuat aplikasi portal berita (konten diambil dari detik.com).
1. Using an existing one
Menggunakan component/element yang sudah ada, tidak ada perubahan/ada kesamaan dari sisi data atau informasi yang ditampilkan dan memilki tujuan dan konteks yang sama.
2. Modifying an existing one
Ini akan terjadi apabila component/element yang ingin kita gunakan tidak 100% cocok dan memerlukan sedikit adjustment.
3. Adding a new component/element
Ini akan terjadi apabila kita tidak menemukan kecocokan terhadap component/element manapun dalam design system, sehingga kita perlu membuat komponen yang baru. Dalam kasus ini kita tidak perlu menambahkan komponen atau elemen design baru karena tidak ada kebutuhan untuk itu.
Berikut ini adalah hasilnya dalam bentuk prototype menggunakan Marvelapp:
🎒 Here is a list of key takeaways from Asphalt’s journey
- Don’t spend too much time worrying about buy-in. Start as small as you can, learn more, gather data to support your argument and then go for the kill.
- Involve engineers early. The code is a fundamental part of a design system. Engineers bring a different mindset and a lot of discipline to the process.
- Start documenting from the word go. It always helps to have something to look back to
🕺 Menyimpulkan
Get Design Systems right and you will have an extremely effective tool and enjoy your life.
🤔 Gitu doang?
Ga dong, yang diatas cuma intro doang. Jadi, kalian harus mampir ke artikel kece yang satu ini kalau mau tau seberapa awesome Asphalt, langsung dari Asphalt team Go-Jek,👇
