Memahami Sistem dan Pola Desain

Meskipun mungkin tampak seperti cara baru untuk mendekati alur kerja digital, konsep sistem desain bukanlah "baru" bagi industri kreatif. Inti dari setiap sistem desain adalah bahasa pola desain yang memecahkan masalah umum yang mungkin dihadapi seorang desainer.

Ide bahasa pola berasal dari arsitektur dan desain perkotaan lebih dari 40 tahun yang lalu dan dapat diterapkan pada hampir semua disiplin desain.

Sistem desain seperti Desain Material adalah topik yang trendi, namun pendekatan sistematis terhadap desain telah menjadi bagian integral dari penerbit majalah selama beberapa dekade. Saat membolak-balik halaman majalah besar mana pun, mudah untuk melihat bahwa setiap bagian didefinisikan secara unik sebagai templat dengan tata letak, font, warna, dll. yang umum.

Pola desain yang digunakan untuk bagian halaman memungkinkan teks dan gambar diatur secara konsisten dan efisien dengan cara yang melengkapi visi kreatif publikasi.

Saat melihat majalah pesaing, mudah untuk melihat bagaimana bahasa desain yang satu dibandingkan dengan yang lain.

Jika mereka belum melakukannya, desainer dari berbagai industri akan segera memasukkan bahasa desain dan template ke dalam alur kerja mereka. Untuk desainer produk digital, topik ini berkembang, dan banyak yang belajar mendesain dari perpustakaan pola dalam sistem yang kompleks untuk pertama kalinya (atau bahkan membantu mendefinisikannya).

Ada kompleksitas tambahan saat menyelaraskan pola desain perangkat lunak dengan basis kode front-end, yang dapat membuat belajar bahasa desain terasa berlebihan.

Bahasa Desain Bersifat Holistik

Bahasa desain, seperti halnya bahasa apa pun, rumit dan mengandung nuansa yang mungkin tampak membingungkan untuk dipelajari pada awalnya. Inilah sebabnya mengapa membantu untuk memikirkan bahasa desain sebagai sistem yang kompleks "terdiri dari banyak komponen yang dapat berinteraksi satu sama lain."

Untuk memahami sistem yang kompleks, penting untuk memikirkan bahasa desain secara holistik :

• Mulailah dengan pandangan sekilas tentang bagaimana desain memengaruhi merek atau bisnis.
• Kemudian, renungkan peran desain dengan tim lintas fungsi dan desainer lainnya.
• Terakhir, pertimbangkan bagaimana desain memengaruhi produk dan pengguna pada saat tertentu.

Perspektif holistik ini menekankan cara berpikir sistematis tentang alur kerja desain, dan memungkinkan bahasa desain diterapkan dengan mudah saat memecahkan masalah tertentu.

Dalam praktiknya, bahasa desain adalah sumber daya yang digunakan untuk membantu mengurangi redundansi dan meningkatkan kontinuitas dalam cara desainer mendekati masalah desain umum. Misalnya, masalah umum yang dihadapi oleh desainer produk adalah, "Saya perlu membuat ajakan bertindak agar pengguna mengklik."

Ini adalah sesuatu yang telah dipecahkan sebelumnya, jadi alih-alih menemukan kembali roda (atau tombol), bahasa desain akan mendefinisikan "pola desain" tombol yang dapat digunakan kembali dengan properti preset, seperti warna dan bentuk, bersama dengan pedoman untuk praktik terbaik.

Bahasa desain produk digital biasanya merupakan sumber daya lintas fungsi dengan tujuan meningkatkan efisiensi alur kerja dan kolaborasi untuk tim.

Dalam beberapa kasus, bahasa diperluas ke perpustakaan pola langsung yang terhubung langsung ke basis kode front-end dan analisis metrik pola. Jenis sistem yang kompleks dengan berbagai ketergantungan ini membuat pendekatan holistik untuk pemecahan masalah sangat diperlukan.

Hal yang luar biasa tentang mempelajari bahasa desain adalah bahwa rekan satu tim biasanya cukup bersemangat tentang antarmuka dan interaksi yang digunakan untuk mendefinisikan suatu produk. Mempelajari bahasa baru umumnya merupakan tantangan, tetapi juga bisa menjadi pengalaman mendalam yang mengikat tim!

Pertanyaan Umum untuk “Merancang” System Thinking

Kefasihan dengan bahasa desain akan memastikan kualitas sistem melalui penginjilan—yang dapat mencakup:

• Pelatihan desainer baru;
• Mentoring karyawan junior dan kontraktor pengelola; atau
• Bekerja secara langsung dengan para insinyur untuk menyempurnakan front-end produk sebelum rilis.

Melalui upaya kolaboratif ini, seorang desainer akan dapat memastikan bahwa pedoman untuk sistem ditegakkan atau disempurnakan berdasarkan kebutuhan.

Apa pun tugasnya, ada beberapa pertanyaan umum tentang sistem desain yang berpikir bahwa seorang desainer dapat dimintai pertanggungjawaban untuk:

Apa yang harus saya pikirkan ketika mendesain dalam sistem desain?

Tergantung pada kompleksitas sistem desain, penting untuk memulai dengan mengambil pendekatan yang komprehensif untuk masalah yang sedang dipecahkan. Perhatikan contoh tombol dari sebelumnya.

Jika warna disetel menjadi #1f9efc dan seorang desainer membuatnya #1b3e9b tanpa terlebih dahulu berkonsultasi dengan desainer lain menggunakan pustaka pola yang sama, ini dapat menyebabkan kesalahan sistem.

Saat bekerja dalam sistem desain, pikirkan bagaimana masalah yang dipecahkan akan berdampak pada seluruh siklus pengembangan produk. Dalam banyak kasus, tidak akan ada, dan seharusnya tidak, banyak dampak karena pustaka pola telah divalidasi.

Jika masalah yang dipecahkan adalah hal baru dalam sistem desain, mungkin ada peluang untuk mengembangkan pustaka pola dan membantu menentukan pola desain baru.

Saat sistem berkembang, ini merupakan hal baru bagi alur kerja tim. Di sini, fleksibilitas diperlukan karena pola desain akan berulang seiring waktu. Namun, meskipun mudah untuk mengubah warna tombol, kompleksitas sistem yang lebih besar harus selalu dipertimbangkan.

Untuk ini, akan sangat membantu untuk mendefinisikan taksonomi untuk mengatur sistem desain dan pustaka pola. Terminologi yang digunakan harus mudah dipahami secara lintas fungsi.

Klik untuk melihat gambar berukuran penuh.

Dengan mengelompokkan artefak desain ke dalam topik yang dipahami secara umum, pustaka pola memungkinkan sistem untuk beroperasi di seluruh alur kerja tim dan mengembangkan komunikasi dengan cara pola desain dibicarakan.

Bagaimana saya tahu kapan saya perlu memecahkan pola atau membuat pola baru dalam sistem desain?

Kebutuhan untuk mendobrak atau membuat pola desain baru biasanya tergantung pada kematangan sistem. Ketika sistem desain berkembang, polanya sering berubah. Saat sistem sudah mapan, harus ada proses permintaan perubahan untuk membantu memastikan kontinuitas dan kualitas.

Kompleksitas sistem juga penting untuk dipertimbangkan. Jika mengubah pola berdampak pada desainer dan tim lain, prosesnya mungkin memakan waktu lebih lama untuk diterapkan dan seringkali memerlukan beberapa tingkat upaya atau sumber daya yang lebih dalam (misalnya, memperbarui pedoman bahasa desain, pustaka pola, atau basis kode front-end).

Umumnya, perpustakaan pola tidak dimaksudkan untuk kaku. Anggap saja sebagai kotak peralatan yang dapat memecahkan masalah dan menyelesaikan tugas. Jika semua upaya untuk mendesain dalam batas-batas perpustakaan pola tidak mencapai tujuan proyek, intuisi dapat mengarah pada pencarian alat baru—atau mungkin perubahan pada pola yang ada.

Perhatikan diagram di bawah ini. Aturan umum adalah bahwa identitas dan elemen , yang merupakan blok pembangun merek dasar, jarang berubah karena membantu menentukan merek dan artefak desain.

Sebagian besar organisasi besar memiliki panduan gaya terpisah untuk elemen terkait merek—terutama logo, warna, dan font, yang tidak sering berubah. Untuk elemen seperti tombol, ini mungkin atau mungkin tidak berulang tergantung pada evolusi bahasa desain, tetapi ini juga memiliki perubahan yang lebih jarang karena hubungannya dengan semua aspek produk.

Perubahan pola desain atau pola baru sering muncul pada tingkat komponen dan interaksi karena ini menentukan alur pengguna dan kumpulan fitur. Alur pengguna baru biasanya didefinisikan dalam peta jalan produk, terutama saat meluncurkan fitur.

Pola desain baru akan memiliki properti yang mirip dengan pola yang sudah ditentukan di pustaka (seperti font dan warna) tetapi mungkin memerlukan pembaruan antarmuka atau status interaktif yang merupakan tambahan untuk bahasa desain.

Manajer produk atau pemilik produk yang bekerja dengan seorang desainer akan memberikan persyaratan untuk fitur baru yang selaras dengan tujuan bisnis. Saat memutuskan untuk mendobrak atau membuat pola desain baru, ingatlah teori sistem yang kompleks, dan pastikan solusinya adalah keputusan bersama.

Berikut adalah beberapa langkah yang perlu dipertimbangkan ketika berpikir tentang cara mematahkan atau mengubah pola desain:

1. Pastikan Kontrol Kualitas dan Kontinuitas

   Ingatlah bahwa kualitas adalah tujuan produk bersama. Setiap orang bertanggung jawab untuk memastikan sistem desain melakukan tugasnya.

   Selalu ambil pendekatan holistik itu, dan pikirkan dampak potensial dari memecahkan suatu pola atau menciptakan pola baru.

   Bertanya pada diri sendiri:

   • Apakah melanggar pola satu-satunya cara untuk memecahkan masalah saya?
   • Bagaimana tim lain akan terpengaruh jika saya melanggar pola ini?
   • Apa yang akan terjadi pada pustaka pola jika saya merusak pola ini?

2. Berkomunikasi dengan Kolaborator

   Bicaralah dengan desainer dan anggota tim lintas fungsi untuk melihat apakah ada orang lain yang memiliki batasan yang sama. Pelajari segala sesuatu tentang persyaratan platform dan bagaimana pola yang diusulkan akan bekerja di seluruh keluarga produk.

   Bertanya pada diri sendiri:

   • Siapa lagi yang telah mengerjakan produk atau platform ini?
   • Apa praktik terbaik dari platform yang saya rancang?
   • Siapa yang dapat saya ajak bicara yang mungkin dapat membantu dengan keputusan dan rekomendasi saya?

3. Pahami Kemampuan Front-end

   Pelajari apa yang mungkin untuk implementasi front-end. Jika perubahan tersebut hanyalah pembaruan pada properti HTML/CSS/JavaScript, biasanya tidak diperlukan pemutusan pola atau pembuatan sesuatu yang sama sekali baru.

   Sebaliknya, itu bisa menjadi pembaruan sederhana untuk pedoman bahasa desain. Sebagai seorang desainer, penting untuk bekerja sama dengan front-end dan berpotensi menemukan cara untuk berkolaborasi setiap minggu atau setiap hari.

   Bertanya pada diri sendiri:

   • Apakah tim front-end telah mengikuti pembaruan desain ini?
   • Apakah perubahan yang saya pertimbangkan sebagai pembaruan front-end?
   • Apakah ada yang kurang dari pedoman praktik terbaik?

4. Validasi Keputusan

   Jika ditentukan bahwa pola baru diperlukan, keputusan harus divalidasi dengan kolaborator dan pengguna akhir dan diselaraskan dengan tujuan bisnis.

   Jika komponen front-end terkait dengan metrik, pengujian A/B cepat akan membantu validasi. Jika tidak, melakukan tes kegunaan akan bekerja dengan baik.

   Bertanya pada diri sendiri:

   • Apakah tim kami memiliki proses permintaan perubahan untuk memvalidasi pola desain baru?
   • Apa yang harus saya lakukan untuk memvalidasi keputusan saya?
   • Apakah keputusan ini membuat alur pengguna baru, atau merupakan fitur tambahan?

Kerja Sama, Pola Pikir Berbeda

Saat mendesain dalam suatu sistem, sangat penting bagi desainer produk untuk mengadopsi pola pikir gambaran besar yang diperlukan untuk pengambilan keputusan. Prinsip-prinsip sistem yang kompleks dan pemikiran sistem akan membantu desainer saat mereka tumbuh dalam karir mereka. Hal yang sama berlaku untuk proses membangun dari perpustakaan pola.

Pendekatan-pendekatan ini berguna untuk memulai bahasa desain baru atau berkontribusi pada bahasa desain yang sudah ada karena begitu pola pikir diterapkan, metode sistematis menjadi, yah, "sistematis."

Mengetahui bahwa industri lain dan disiplin desain telah menggunakan metode yang sama untuk merampingkan alur kerja selama bertahun-tahun memberikan desainer produk titik referensi yang sangat baik untuk praktik terbaik.

Pada akhirnya, mendesain dalam suatu sistem tidak akan sepenuhnya mengubah cara pekerjaan diselesaikan. Tentu, akan ada beberapa alat baru untuk menghubungkan dan mengelola kompleksitas, tetapi pada akhirnya, ini adalah pergeseran ke pola pikir holistik yang benar-benar akan membantu meningkatkan alur kerja.

• • •

Bacaan lebih lanjut di Blog Desain Toptal:

• Cara Membuat Panduan Gaya Sketsa, Pustaka, dan Kit UI
• Merancang Pernyataan Masalah – Apa Itu dan Bagaimana Membingkainya
• Gunakan Inspirasi Anda – Panduan untuk Papan Suasana Hati
• Desain Kolaboratif - Panduan untuk Desain Produk Perusahaan yang Sukses
• Rancang Masa Depan: Alat dan Produk yang Menanti Kita