‘Kertas Kuantum’ atau Quantum Paper adalah codename dari Material Design, sebuah bahasa desain yang dikembangkan oleh Google pada 2014. Disebut ‘bahasa’ karena memang fungsinya adalah seperti sebuah bahasa, yakni menyeragamkan cara kita berkomunikasi, dengan komputer. Itu sebabnya ketika kita memasuki halaman web atau aplikasi, dengan sekilas pandang kita langsung bisa membedakan antara Google (Plus) dengan Facebook, bukannya Twitter, dan lainnya. Desain tersebut juga dirancang agar kita dapat menggunakan web/apps dengan sangat mudah, membuat kita semua mampu menggunakan banyak web/apps tersebut meskipun memiliki ‘bahasa’ yang berbeda.
–Tulisan ini ditujukan khususnya kepada pembaca non-desainer, dengan tujuan untuk memperkenalkan sejauh mana pengaruh sebuah desain antarmuka pada sebuah web/apps—
Menjadi Desain Lintas Platform
Pada mulanya desain Material dibuat sebagai desain antarmuka dari Google Now, sebuah aplikasi personal assistant yang diluncurkan pada 2012. Jika kita ingat, Google Now memiliki desain antarmuka seperti susunan kartu, berisi rekomendasi dan informasi yang berguna. Kini Google Now telah diintegrasikan dengan Google Search apps dan desainnya telah berkembang serta digunakan di banyak produk Google lintas platform.
Kini desain Material dapat ditemukan di hampir semua produk Google, mulai dari Google Search, YouTube, Gmail, Google Drive, Google Maps, hingga Google Plus dan lainnya. Itu sebabnya meskipun kita tak melihat label Google di web/apps tersebut, kita langsung mengenal interface yang kita hadapi, dan dapat mengidentifikasi bahwa antarmuka tersebut adalah buatan Google.
Dari Mana Efek Kertas Berasal
Lantas di bagian mana kita bisa menemukan sebuah desain Material, dan bagaimana ia bekerja? Desain Material berurusan dengan desain visual, sehingga jawabannya ya di seluruh bagian antarmuka yang kita lihat. Every single pixel we saw, it’s by design. Silahkan Anda mengunjungi salah satu layanan Google seperti Google Search, Google Plus atau YouTube, amati visualnya maka Anda akan menemukan tipikal desain seperti berikut.
Yang paling khas dari desain Material adalah kesan 3D tipis pada obyek-obyek yang menyusunnya.
Itu karena memang efek ketebalan sebuah obyek pada desain Material didesain tak melebihi 1dp (density-independent pixels), sehingga tampak konsisten dan tak pernah terlalu tebal. Efek ini membuat kita merasa sedang berinteraksi dengan sebuah kertas, dan di sinilah codename Quantum Paper berasal.
Desainer Matías Duarte menjelaskan,
“Unlike real paper, our digital material can expand and reform intelligently. Material has physical surfaces and edges. Seams and shadows provide meaning about what you can touch.”
Untuk menyusun desain yang demikian khas tersebut, tim desainer Google melakukan riset dan studi yang cukup lama. Mereka meneliti secara langsung bagaimana visualisasi sebuah kertas di dunia tiga dimensi, bagaimana kertas berinteraksi dengan bayangan, hingga bagaimana kertas bergerak secara natural. Perlu diketahui, kertas dipilih sebagai landasan desain Material ini karena kertas dinilai sebagai obyek fisik yang familiar dengan kehidupan kita sehari-hari, sederhana, dan dapat direkayasa sesuai dengan kreativitas.
Konsep Fitur dan Fungsi di Balik Desain Material
Kita telah dapat mengidentifikasi sebuah desain Material, tetapi sejauh apa dan bagaimana rancangannya? Berikut ini adalah prinsip-prinsip umum sebuah desain Material, sehingga dengan mengetahuinya kita dapat menjadi sedikit lebih ahli dalam Material Design dan mampu mengidentifikasi desain Material dan desain-desain lain yang hampir serupa.
- Tiga Dimensi. Elemen dalam antarmuka desain Material memiliki efek ketebalan, bayangan, dan memiliki komposisi yang konsisten dalam ruang, sehingga mengesankan efek 3D. Ide utama dalam prinsip ini adalah adanya ruang yang luas dan fleksibel bagi user untuk mengeksplorasi.
- Grids Layout. Layout ini adalah susunan elemen berupa lempengan-lempengan pipih yang tersusun rapi. Ketika kita membuka YouTube, Google Keep atau Google Plus maka kita akan banyak menemui konten-konten yang terbagi dalam kotak-kotak berbaris.
- Animasi. Tak sekedar obyek dalam desain Material yang bisa berpindah tempat dari satu sudut ke sudut lainnya, animasi dalam desain Material harus mengikuti hukum fisika. Seperti efek pantulan, adanya akselerasi gerakan, semuanya dirancang layaknya kita merasakan obyek bergerak di dunia nyata.
- Huruf Roboto. Huruf ini sangat familiar bagi pengguna Android, menyebar di seluruh elemen antarmukanya dan kini digunakan secara luas di banyak produk Google. Huruf ini sekilas mirip dengan huruf Calibri Light yang dapat kita temui di Microsoft Office, tetapi memiliki lekukan-lekukan yang khas.
- Warna yang Kuat. Desain Material mampu menemukan komposisi warna yang khas untuk digunakan secara luas. Dalam satu set antarmuka, warna-warna ini sangat kontras namun tak pernah terlihat norak. Justru tampak elegan. Kuncinya adalah penggunaan tak lebih dari 3 warna berbeda yang dimunculkan dalam satu set visual.
- Icon Template. Simbol-simbol yang kita sentuh/klik dalam berinteraksi dengan web/apps telah disediakan dalam set yang senada. Sehingga meskipun kita berada dalam antarmuka yang berbeda, kita dapat langsung mengerti bahwa simbol tertentu akan menjalankan fungsi tertentu, bukan selainnya.
- Whitespace. Adalah prinsip desain cetak tradisional yang dipertahankan pada desain Material. Dominasi space putih ini adalah untuk menciptakan fokus pengguna. Kita dapat menemukan whitespace di antarmuka Google seperti YouTube bahkan Google Search.
Di luar itu semua, desain Material dirancang untuk mempertemukan prinsip antara desain yang indah dan fungsional. Ia dirancang tak hanya elegan tetapi juga mudah digunakan. Yang paling penting adalah, desain Material membuat kita familiar dan mudah menggunakan layanan-layanan penting yang kita gunakan setiap hari, mulai dari informasi (Search), transportasi (Maps), komunikasi (Gmail), hingga sosialisasi (G+); dalam satu bahasa.
Untuk mempelajari desain Material lebih lanjut, Anda dapat mengunjungi halaman: material.google.com, design.google.com
sangat membantu, makasih