Mengendarai kapal eksplorasi samudra atau pesawat ulang - alik eksplorasi Mars adalah urusan serius. Diharapkan dasbor akan memiliki kualitas terbaik. Lebar dua paku, kemiringan 45 °, potongan Lego yang umum "kemiringan dihiasi 2x2" adalah antarmuka dari set mainan ini, yang menghubungkannya ke bagian luar.
Karya seni ikonik dan beresolusi rendah ini adalah alat yang sempurna untuk mempelajari dasar-dasar desain antarmuka. Mari kita mempersenjatai diri dengan 52 batu bata dan melihat apa yang dapat mereka ajarkan tentang desain, tata letak, dan pengaturan antarmuka yang kompleks.
Selamat datang di dunia pengalaman khusus Lego.
Kekacauan yang terorganisir
Sekilas, variasi gambar dapat membingungkan, tetapi segera menjadi jelas bahwa beberapa antarmuka terlihat sedikit lebih kacau daripada yang lain. Kebanyakan antarmuka di dunia nyata merupakan campuran dari layar digital dan perangkat input analog seperti sakelar dan dial. Panel Lego mengikuti prinsip yang sama.
Jika Anda menempatkan panel di sepanjang dua sumbu, "terorganisir kacau" (bawah ke atas) dan "panel penuh-tanpa layar" (kiri ke kanan), Anda mendapatkan beberapa cluster terpisah. Di kiri atas, akan ada layar yang dipadukan dengan deretan tombol. Di kanan atas adalah sekelompok kecil panel sakelar yang sangat terorganisir. Bagian bawah tengah ditempati dengan konsep yang tidak biasa yang sulit dipahami.
Mengembangkan antarmuka mesin yang kompleks merupakan perpaduan dari banyak faktor berbeda, dari ergonomi hingga pertimbangan teknik. Namun, kami dapat membagi masalah ini menjadi dua pertanyaan kunci:
- Bagaimana Anda membedakan fungsi dari perangkat input yang berbeda?
- Bagaimana Anda mengatur beberapa perangkat input dan output sehingga Anda dapat memahami hubungannya?
Mari kita lihat lebih dekat jawaban atas pertanyaan-pertanyaan ini di Lego.
Membedakan perangkat input
Mengapa 400 pilot selama Perang Dunia II mulai melepas roda pendaratan pada pembom B-17 sebelum mendarat? Apakah ini kesalahan manusia yang sangat besar atau sesuatu yang lebih mendasar?
Psikolog Alfonis Chapanis adalah orang pertama yang menyatakan bahwa sejumlah besar pendaratan yang tidak berhasil mungkin disebabkan oleh antarmuka yang dirancang dengan buruk. Roda pendaratan dan kenop pengatur flap terletak berdampingan dan memiliki bentuk yang sama. Para pilot tidak punya kesempatan.
Belly B-17 dan pengkodean fungsi berdasarkan bentuk, yang memungkinkan untuk menghindari masalah
Solusi sementara yang dia usulkan adalah merekatkan potongan karet dengan bentuk berbeda ke masing-masing pegangan, yang memungkinkan Anda mengontrol pesawat dengan sentuhan. Alhasil, ide pengkodean berdasarkan bentuk lahir, dan sistem diferensiasi masih diikuti dalam desain kabin pesawat.
Mari bandingkan tiga antarmuka yang ditunjukkan di bawah ini untuk melihat cara kerjanya. Abaikan tata letak umum elemen - untuk saat ini, tombol individual penting bagi kami. Bayangkan Anda mencoba meraba-raba salah satunya tanpa melihat. Saat bekerja dengan panel kiri, "Slope 45 2 x 2 with 12 Buttons", Anda membutuhkan koordinasi tangan-mata yang tepat. Di panel kanan, Aircraft Multiple Flight Controls, perbedaan yang jelas dibuat antara stik kontrol (gerakan vertikal menyapu dalam garis lurus), sakelar (sakelar toggle vertikal bulat), dan tombol (kotak).
Dari kiri ke kanan: diferensiasi yang buruk, buruk, dan tidak buruk di antara kontrol
Diferensiasi semacam itu masih menjadi masalah serius hingga hari ini. Ford menarik kembali 13.500 crossover pada tahun 2015Lincoln MKC, karena pengemudi, saat melaju dengan kecepatan tinggi di jalan raya, terus-menerus mematikan mesin secara tidak sengaja saat mencoba mengaktifkan mode Sport. Dapatkah Anda memahami mengapa ini terjadi?
Panel kontrol Ford Lincoln MKC sebelum tombol start / stop mesin dipindahkan.
Pengkodean fungsi dengan bentuk adalah salah satu pendekatan diferensiasi, tetapi ada pendekatan lain. Dalam kehidupan kita sehari-hari, kita hanya mendengar tentang kode warna. Tetapi ada yang lain: pengkodean berdasarkan ukuran, tekstur, lokasi dan metode kerja. Keenam ini adalah sekutu kami dalam desain antarmuka anti-kesalahan.
Enam metode dasar untuk mengkodekan suatu fungsi. Perhatikan bagaimana beberapa contoh yang diberikan menggunakan beberapa opsi encoding secara bersamaan.
Dari kiri ke kanan, atas ke bawah: ukuran, bentuk, warna, tekstur, lokasi, metode kerja.
Ini didasarkan pada metode pengkodean ukuran, warna dan bentuk - mereka dapat dengan cepat menyelesaikan banyak masalah antarmuka. Tekstur juga bagus untuk pekerjaan buta - terutama pada pemintal dangkal untuk penyetelan yang bagus.
Pengkodean tata letak tampak seperti hal yang jelas, tetapi sering kali tidak digunakan secara maksimal. Perangkat dengan bentuk ergonomis yang jelas (seperti teropong atau pengontrol permainan) dapat menggunakan posisi tangan yang alami untuk membedakan antara tindakan primer dan sekunder.
Terakhir, pengkodean kerja menetapkan berbagai jenis gerakan ke perangkat input yang berbeda (seperti pivoting atau geser vertikal). Pendekatan ini dapat bekerja dengan baik bila jenis pergerakan perangkat input cocok dengan operasi yang dikendalikannya - misalnya, derek mengangkat beban saat tuas dinaikkan.
Enam jenis pengkodean di antarmuka Lego (kiri ke kanan, atas ke bawah): ukuran, bentuk, warna, tekstur, posisi, metode kerja.
Diferensiasi adalah langkah pertama yang baik untuk menghindari kebingungan pada sakelar yang berdekatan. Namun, hanya organisasi perangkat masukan yang baik yang akan memungkinkan kami menyampaikan model antarmuka yang jelas dan tepat kepada pengguna.
Organisasi perangkat input
Bandingkan tiga panel berikut. Tata letak kontrolnya identik, tetapi bilah biru terlihat jauh lebih jelas daripada bilah putih. Prinsip Gestalt bekerja di sini, menggabungkan entitas terkait di satu area.
Diferensiasi dasar dengan metode pengelompokan
Cukup sederhana. Tetapi bagaimana kita memutuskan perangkat input mana yang akan dikelompokkan?
Saya suka menggunakan panel kontrol Soviet sebagai titik awal . Dinding indah dengan tikungan dan belokan yang tidak masuk akal ini menjadi hidup, diatur dalam skema pabrik raksasa. Akan sulit untuk memikirkan organisasi informasi yang lebih literal.
Saya akan menyebut panel seperti itu sebagai antarmuka yang terkonsolidasi. Semua elemen masukan dan umpan balik dikumpulkan dalam satu panel. Pendekatan inimemilih Dyson untuk mobilnya . Sekarang bayangkan contoh sebaliknya - kami memindahkan semua sakelar dan lampu ini ke lokasi katup sebenarnya di pabrik. Kedengarannya konyol - namun, kisi - kisi ventilasi pada Audi TT ini menunjukkan bahwa pendekatan terdistribusi juga sangat cocok untuk pengguna. Saya menulis banyak tentang antarmuka terdistribusi tahun lalu.
Panel mobil Lego: antarmuka terdistribusi (kiri) versus konsolidasi (kanan)
Mari kita kembali ke pabrik Soviet. Panel antarmuka mereka sangat baik dalam menjawab pertanyaan "Apakah katup ini memungkinkan air masuk ke reservoir B?" Namun, mereka sama sekali tidak cocok untuk menemukan jawaban atas pertanyaan seperti "apakah semua katup air tertutup?" atau "di mana semua sakelar yang perlu saya persiapkan untuk transmisi shift?"
Lego menggunakan pendekatan Soviet untuk panel yang fantastis , karena skema tersebut dengan sempurna menyampaikan model mental tentang cara kerja sistem orang lain. Namun, untuk penggunaan sehari-hari, ada beberapa pendekatan lain yang lebih nyaman. Antarmuka Insectoid dan UFO Lego. Saya ingin tahu untuk apa tombol-tombol ini sebenarnya?
Filosofi desain paling populer, yang mungkin bisa disebut filosofi "default", adalah organisasi berdasarkan fungsionalitas. Kelompokkan semua perangkat input dan output untuk setiap fitur produk. Ventilator coronavirus berikutnya dari Cambridge Consultants akan menjadi contoh yang bagus dari pendekatan ini - namun, kami juga sering melihatnya di mobil, saat mengelompokkan perangkat input untuk kontrol ventilasi, dan menempatkan semua kontrol di lampu samping pada satu tuas.
Ventilator Coronavirus dari Cambridge Consultants dengan organisasi fungsional yang jelas.
Sebuah metode organisasi operasi meletakkan semua sakelar yang bekerja dengan cara tertentu di satu tempat. Saya tidak tahu untuk apa semua katup ini di foto, tetapi saya yakin tidak semuanya membuka hal-hal terkait. Setiap kali Anda melihat serangkaian sakelar yang terlihat dan berfungsi sama, tetapi mengontrol bagian sistem yang berbeda, Anda dihadapkan pada cara kerja pengorganisasian.
Kebanyakan antarmuka saat ini pada dasarnya adalah sistem kontrol fly-by-wirenamun, secara historis, tuas yang Anda tarik, misalnya, saat berada di kabin traktor, sebenarnya menggerakkan piston hidraulik yang terletak di bawah jok. Melarutkan semua sistem kelistrikan, mekanis, dan hidraulik yang berbeda ini dapat sangat merusak pengelompokan antarmuka dan mengarah pada organisasi teknologi.
Persamaan modern dari pendekatan ini sangat umum. Ini digunakan oleh layar sentuh apa pun dengan tombol yang terletak di sebelahnya. Di masa mendatang, SpaceX dapat menempatkan kontrol fisik ini tepat di sebelah informasi yang terpengaruh, tetapi untuk saat ini mereka duduk dengan canggung di sebelah layar, seolah-olah seharusnya.
Bob dan Doug di kapsul SpaceX Dragon
Di Lego, kami bertemu dengan organisasi berbasis fitur di Monitor dengan panel pola -19 °. Dua kelompok kontrol eksplisit - mungkin untuk kontrol suhu dan untuk pelacakan tanda-tanda vital. Saya tidak tahu apa yang dilakukan semua sakelar di panel kedua ini, namun mereka dikelompokkan dengan jelas berdasarkan pengoperasian, bukan berdasarkan fungsionalitas.
Ada banyak panel Lego dengan pemisahan teknologi yang sama seperti yang terlihat di kapsul SpaceX Dragon, tapi saya suka membayangkan bagaimana unit polisi dari awal 90-an ini harus memisahkan pemutaran audio dan video karena teknologi reel-to-reel baru tidak kompatibel dengan saluran telepon analog. Sebuah organisasi teknologi bekerja di sini.
Dari kiri ke kanan: Pengorganisasian berdasarkan Fungsionalitas, Metode Operasi, Teknologi, dan Situasi
Sejauh ini, semua pendekatan kita - organisasi berdasarkan fungsi, metode operasi, atau teknologi - telah dikaitkan dengan properti sistem, bukan pengguna. Alternatif untuk ini adalah mengatur berdasarkan kasus penggunaan - pengelompokan berdasarkan tugas harian pengguna.
Bayangkan para pekerja tiba di pabrik Lego setiap pagi untuk memindai orang. Pengelompokan kontrol berdasarkan tugas (menyiapkan mobil, memuat bodi, memulai pemindaian) menunjukkan pemisahan tombol iradiasi dan pemindai di banyak area panel. Ini akan lebih sulit untuk komputer, tetapi lebih nyaman bagi operator. Hanya pengembang dan pengguna yang akan memutuskan mana yang terbaik untuk mereka.
Tapi antarmuka mana yang lebih baik?
Saya sering mengatakan bahwa tidak ada antarmuka yang lebih baik, tetapi ada banyak contoh antarmuka terburuk.
Namun, saya punya tiga contoh favorit. Tata letak kontrol yang bagus dan dapat dipahami secara visual dengan diferensiasi perangkat input yang baik dan pengaturan yang sederhana dan jelas. Saya akan dengan bangga duduk di salah satu konsol ini:
