Rabu, 13 Agustus 2014

Menyambut Tampilan Baru Android L: Material Design (Kinian 13 Agustus 2014)

Konferensi Google I/O pada 25 Juni 2014 lalu memperkenalkan konsep antarmuka (user interface/UI) baru pada Android "L"—yang akan dirilis akhir 2014.
   Sepintas, gayanya mengikuti tren yang dimulai Windows 8, yakni peralihan ke antarmuka berkonsep modern yang menurut Wikipedia ("Flat UI Design") adalah,
rancangan antarmuka yang menyingkirkan semua pilihan gaya yang memberikan ilusi tiga-dimensi (seperti bayangan, gradasi, atau tekstur) dan berfokus pada penggunaan minimalis dari elemen-elemen sederhana, tipografi (aksara), dan warna datar (flat).
   Microsoft sendiri menyatakan mendapatkan inspirasinya dari desain rambu transportasi kota ("metro" subway) yang lebih menekankan penyampaian informasi daripada estetika (keindahan).
   Selain itu, kesederhanaan dan minimumnya kebutuhan pemrosesan yang dibutuhkan membuat gaya ini lebih mudah diterapkan untuk segala ukuran peranti keras (responsive). Apakah ukuran layar monitor biasa, tablet, smartphone, hingga wearables seperti smartwatch.
Android L, responsiveness
   Kalau melihat renovasi rumah-rumah di Bandung yang lumayan banyak akhir-akhir ini. Agaknya tren ini juga merasuki bidang properti. Gaya ini memang dipopulerkan gaya bangunan Bauhaus yang contoh menyoloknya di Bandung adalah arsitektur pada gedung IKIP (sekarang UPI) Bandung.
Bauhaus, Wikipedia

Tren yang Dipelopori Microsoft (Windows 8)

   Saat pertama kali menyaksikan Windows 8 muncul, saya sudah merasa bahwa alih-alih terus menjadi pengikut, agaknya kali ini Microsoft akan menjadi pembuat tren (trend setter) yang akan diikuti pasar.
   Prediksi pribadi itu ternyata tak salah. Apple berencana merilis antarmuka gaya modern-nya pada OS X Yosemite, dan kini disusul Google dengan konsep antarmuka bernama material design. Mengapa dinamai material?
   Saya coba google dengan perintah "define material" dan muncul jawaban berikut (cara efektif mencari dengan Google silakan sua artikel ini),
Google Search define 'material'
   Ringkasnya, material adalah ide/konsep yang digunakan untuk membuat karya yang lain. Dengan demikian, material design adalah konsep antarmuka yang digunakan untuk membuat karya lain seperti Android L berikut segenap app dan gatra di dalamnya, atau Google Apps (segenap situs properti Google), dst. Google memang sudah berencana me-modern-isasi seluruh app pada segenap properti Google-nya mengikuti material design.
   Ooh..., jadi itu kenapa dinamai material, semula saya pikir itu singkatan atau apalah, karena namanya mengingatkan saya kepada toko material yang menyuplai renovasi rumah-rumah di Bandung tadi.

Mengapa Google Beralih ke Material Design?

Selain kenyataan bahwa desain gaya modern memang lebih ringkas (tidak ramai), lebih mudah dipahami, hingga akan membuat pengguna lebih produktif; ada alasan lain yang membuat Google melakukan perombakan drastis dan menyeluruh ini.
   Alasan utama adalah tidak konsistennya pengalaman interaksi pengguna (user experience) dengan produk Android.
   Sudah menjadi pengetahuan umum, bahwa salah satu penyebab GNU/Linux belum bisa menjadi pilihan utama pengguna biasa adalah terlalu banyaknya ragam antarmuka yang ditawarkan (disebut "distro" alias distribusi).
   Penyakit GNU/Linux itu menular kepada Android. Produk yang dikeluarkan Samsung, LG, Sony, hingga Xiaomi berbeda-beda antarmukanya. Meski secara mendasar serupa, tapi mau tak mau ini membuat pengguna harus belajar lagi setiap kali ia berganti merek.
   Lihatlah misalnya antarmuka buatan Samsung (TouchWiz, kiri) dan Xiaomi (MIUI 5, kanan) berikut.
Samsung TouchWiz UI on S5, and MIUI v5
   Keadaan ini menyebabkan rasa percaya diri (trust) pengguna Android tidak sebaik pengguna produk berbasis iOS (Apple) atau Windows Phone (Microsoft). Itu karena Apple dan Microsoft bisa memaksa produsen peranti keras mengikuti pedoman antarmuka mereka.
   Mengingat Android bersumber dari komunitas lepas lokan (open source) maka ketaatan kepada pedoman antarmuka itu sangat bergantung kepada "kerelaan" produsen peranti keras.
   Google hanya bisa berharap konsistensi dan kemolekan material design kali ini akan mampu membuat para produsen tadi "bertobat ke jalan yang benar," demi konsumen.

   Nah, kini kita akan saksikan bersama, apakah penampilan material design memang semolek tampilan modern Windows 8 maupun OS X Yosemite.

Informasi Dulu, Penampilan Kemudian—Tapi Tak Sembarang Tampil Juga

Ini prinsip dasar konsep modern, ia harus sederhana—"tidak ramai" atau berjejal informasi,
Simple layout structure
   Memiliki gaya aksara (font) atau tipografi yang jernih dan mudah dibaca,
Simple more refined/clear Roboto font typhography
   Menggunakan warna bercorak datar/flat—yakni tidak bergradasidan umumnya tak lebih dari 3 warna datar untuk tiap set antarmuka,
Simple, small selections of flat colors
   Prinsip-prinsip dasar tadi memastikan pengguna bisa terfokus pada informasi yang disajikan, dan... bisa memberikan respon—seperti menekan tombol, menggeser layar, dst.—dengan cepat, karena interaksi yang sederhana dan lebih mudah dipahami:
Focus on information and easier task responses

Penyajian Informasi—Kartu dan Tab

Penyajian informasi menggunakan sistem petak (grid). Ini fitur logis pendekatan modern. Penerapan Google diberi nama kartu (cards). Bagi pengguna Windows 8, ini sungguh mengingatkan kepada gaya penyajian ala ubin (tile) dari Microsoft,
Google Material Design: Cards
   Penyajian yang berikut ini makin memperlihatkan betapa konsep Modern UI/Microsoft sangat berpengaruh dalam tren desain antarmuka masa kini,
Google Material Design: Cards
   Penyajian paduan teks dan gambar yang mengingatkan kepada scrolling live tile pada Windows 8,
Google Material Design: Cards
   Dan, tentu saja, sistem petak/grid dan kartu/tile sangat cocok untuk menyajikan informasi berjenis galeri gambar/foto,
Google Material Design: Cards
   Ringkasnya, pengguna Windows Phone, Android L, dan bahkan iOS "Next"; akan lebih mudah berpindah gawai/gadget karena semuanya dirancang dengan pendekatan antarmuka modern.
   Hal yang terbetik—bagi saya pribadi sebagai penggemar lama Windows—betapa kini, di luar kebiasaan, Microsoft-lah yang membuat tren yang diikuti...!

   Pengelompokan informasi dengan tab masih mempertahankan pola lama, tapi material design lebih efisien memanfaatkan ruang hingga terlihat lebih lapang dan mudah dicerna,
Google Material Design, Tabs
    Perhatikan contoh tab ketiga (paling kanan), material design masih mempertahankan pilihan modus tampilan bercorak gelap (dark).

Menemukan Informasi

Aspek lain penyajian informasi adalah kemudahan pengguna untuk mencari—dan lebih penting lagi—menemukan informasi yang ia inginkan,
Google Material Design: Search and keyboard
   Efisiensi ruang kembali diperlihatkan di sini, lihatlah bagaimana tombol numerik/angka bisa disisipkan di sela-sela QWERTY.
   Ini meningkatkan produktivitas pengguna karena mengurangi kebutuhan untuk berpindah ke layar numerik/simbol.

Kendali dan Respon Pengguna—Menu

Menu utama (kiri) dan menu konteks (kanan) terlihat lebih ringkas, dan terlihat lebih lapang target ruangnya hingga memudahkan sentuhan dengan jari,
Google Material Design: main and context menu
   Menu pada tampilan mendatar/landscape dapat memanfaatkan ruang yang lebih luas dengan pola berjenjang/cascade,
Google Material Design: landscape mode menu
   Menu konteks saat penyuntingan,
Google Material Design: landscape mode menu, editing
   Nah, ini dia, menu penyetelan/settings. Spasi terlihat lebih tinggi, submenu juga terlihat lebih lapang. Secara umum lebih mudah di mata juga mudah di jari,
Google Material Design: Settings menu

Pilihan Tema—Terang dan Gelap

Gelar pratinjau di situs material design umumnya menyontohkan tampilan bertema terang (light). Ini mungkin akan menjadi pilihan baku pada rilis finalnya nanti.
   Tetapi, bagi pengguna yang sadar energi, tampilan terang ini jelas menghisap daya lebih banyak dibandingkan tampilan lama yang bertema gelap (dark).
   Jangan takut. Agaknya tampilan gelap masih ada seperti misalnya terlihat pada pratinjau tampilan menu settings,
Google Material Design: settings, dark
demikian pula pada pratinjau elemen-elemen kendali seperti misalnya kotak pilihan (centang), penyuntingan teks, hingga penggulir (slider) masih menyertakan tema terang maupun gelap,
Google Material Design: slider, light

Google Material Design: slider, dark
   Seperti pernah kami tulis dalam artikel lain, salah satu perbaikan signifikan pada Android L adalah efisiensi baterenya hingga 36% lebih hemat dibandingkan versi sebelumnya, KitKat.
   Menggunakan tampilan versi gelap—alih-alih yang baku (terang)—membuat pengaruh penghematan hasil riset Project Volta itu akan lebih terasa.

   Demikianlah sekilas tinjauan tentang tampilan terbaru Android L. Meski dokumentasi material design sendiri masih terus berkembang hingga mencapai bentuk finalnya pada saat Android L dirilis pada musim gugur nanti (September).
   Moto utama Android L agaknya: hemat energi, hemat ruang, dan hemat waktu (produktif).
   Selamat datang L![]

UPDATE (13 Agu, 2014): Daftar Android App berantarmuka Material Design

Written by

LepasLokan.org—melalui majalah lepas Open Your Windows, Indonesia! —mempromosikan penggunaan aplikasi bebas biaya/gratis—baik dari sumber lepas lokan ( open source ) maupun gratis ( freeware )—yang berbasiskan sistem operasi Windows, juga artikel teknologi di sekitar Windows XP/Vista/7/8, gawai ( gadget ), dan Internet pada umumnya.

 

© 2011-2014 Open Your Windows! | All rights reserved | Designed by Templateism | Open Your Windows, Indonesia! RSS Feeds