Membangun Design System selangkah demi langkah

Mungkin temen-temen pernah tau Lego? Permainan yang bisa disusun atau dirangkai satu persatu komponennya hingga menjadi sebuah bentuk, begitu juga dalam konsep Design System merupakan bagian dasar yang paling penting dalam membangun Desain Produk Digital.

Tetapi Design Systems ini jika kita rangkum bakal banyak yang harus dibahas, aku akan sharing ke temen-temen tentang bagaimana sajakah tahapan-tahapan membangun Design System.

Sebelum membahas lebih detail ke inti permasalahannya, maka disini aku sharing tentang apa itu Design System

Apa itu Design Systems

Secara Bahasa Design System memiliki banyak pengertian yang di katakan oleh pakar-pakar design, tapi gampangnya Design System adalah kumpulan UI kits untuk designer bisa dipake lagi tanpa bikin ulang dari awal,

nah secara gambar besar Design System ini sangat memudahkan pekerjaan designer. Bahkan didalam Design System ini dilengkapi dengan aturan main dan cara menggunkannya.

Dalam buku Design Systems yang ditulis mba Allan Kholmatova Design System itu, katanya:

A design system is a set of interconnected patterns and shared practices coherently organized to achieve the purpose of digital products.

Nah jadi Design System dirancang untuk saling terkoneksi antar pola-pola yang lainnya seperti sistem yang dibuat untuk berkolaborasi atar tim yang lainnya. Nah sampe segitunya, jadi hanya memiliki pola dan pattern komponen doang yah.. tetapi juga merancang Design System perlu aturan dan cara mainnya didalam tim product design.

Selain definisi dari mba Allan, dilain sisi dari mas Nathan Curtis katanya:

A design system offers a library of visual style, components, and other concerns documented and released by an individual, team or community as code and design tools so that adopting products can be more efficient and cohesive.

Nah begitu ya temen-temen, jadi pada intinya Design System ini memudahkan kita, kamu, dan aku bisa untuk membuat digital product dengan cepat.

Nah jadi udah pada ngerti ya, baik dari bahasa maupun definisi Design System itu sendiri yah.

Kemudian seberapa penting sih Design System ini?

Kenapa harus pake Design Systems

Kita kasi perumpamaan adalah sebuah persimpangan empat, apa yang terjadi jika persimpangan empat tersebut tidak memiliki rambu lalu lintas? Pasti dari sini kita mikir pasti banyak kecelakaan karena tidak ada sama sekali yang tertib dan bisa membahayakan bagi pengendara di jalan.

Nah sama halnya dengan semua aspek kehidupan kita yang mengharuskan punya aturan dan prinsip kehidupan, minimal dibuat oleh kita sendiri. Termasuk dengan aturan Design system yang dimana ia mengatur keberlangsungan merancang sebuah desain.

Metode yang digunakan

Salah satu metode yang populer di Product design yaitu Atomic Design System Methodology yang di kembangkan oleh Brad Frost. Penerapannya cukup unik, yang dimana setiap langkahnya mengambil dari bentuk atom, Nah temen-temen pasti penah belajar mengenai tabel periodik di masa SMA.

Dengan metode yang sama, penyusunan komponennya juga satu persati sesuai dengan urutan hirarki yang eksplisit hingga menjadi organisme sebuah bentuk, untuk memahami desain atom dengan lebih baik, kita perlu memoles beberapa konsep kimia dasar dengan cepat.

Semua materi terdiri dari partikel-partikel kecil yang disebut atom, jika kita mengulik lebih dalam lagi, atom itu sendiri terdiri dari partikel subatomik: Proton, Neutron dan Elektron yang masing-masing memiliki sifat positif, negatif dan netral.

Tetapi secara keseluruhan, kita bisa memecahkan semua ke level terendahnya, dimulai dari atom.

Untuk menjelaskan hal ini dengan lebih baik, mari kira ambil contoh Air atu H2O

Pesamaan kimia menunjukkan bahwa ia mengandung 2 atim Hidrogen dan 1 atom Oksigen; keduanya independen dengan sendirinya, namun jika digabungkan sehingga menjadi satu molekul H2O atau kita sebut “Air”.

Prinsip design atim berfokus pada memecahkan bagian antarmuka menjadi komponen yang lebih kecil yang di sebut atom. Atom-atim ini kemudian bertindak sebagai blok penyusun untuk semuakomponen lain di seluruh Design system, Kalo kita berfikir ini adalah tugas yang mudah tapi bisa menjadi rumit tergantung pada ukuran proyek yang sedang kita kerjakan.

Elemen Atomic Design

Sama seperti materi, kita dapat mengatur komponen secara hirarki dalam Design system ke dalam berbagau tingkatan tergantung pada konstruksi dan kompleksitasnya, sementara prinsip Desain atom standar oleh Brad frost memiliki enam lapisan, seperti gambar dibawah ini: