Menghindari Praktik Buruk di Desain iOS dan Android

Berapa banyak orang rata-rata yang Anda lihat menggunakan perangkat iOS dan Android secara bersamaan ? Angka resmi menurut penelitian ini berkisar antara 10% dan 20%, tetapi angka tersebut mencakup pengguna Mac juga, bukan hanya pengguna ponsel. Dalam praktiknya, orang cenderung menggunakan hanya satu ponsel atau tablet selama periode waktu tertentu. Jika mereka menggunakan dua perangkat, lebih sering daripada tidak, keduanya akan menjalankan OS yang sama.

Artinya, tidak perlu membuat salinan sempurna piksel dari desain UI aplikasi, mencoba mengakomodasi kedua platform, lengkap dengan puluhan ukuran layar, rasio aspek, dan resolusi yang berbeda (jangan sampai memunculkan takik, bilah status , bilah navigasi, tombol perangkat keras, dll.).

Sebaliknya, bahkan jika pengguna melihat aplikasi yang sama di iOS dan Android, kemungkinan besar mereka lebih suka merasakan pengalaman asli pada keduanya. Inilah sebabnya mengapa pendekatan yang diambil oleh banyak manajer proyek dan pemilik produk dalam pengembangan seluler seringkali kurang optimal dan perlu disesuaikan.

Mengapa Ini Masih Menjadi Masalah?

Tetapi mengapa pemangku kepentingan dan manajer masih membuat keputusan yang sering menurunkan pengalaman pengguna, sehingga merusak produk mereka sendiri? Dapat dimengerti pada awal dekade ketika semua orang masih memahami pengembangan iOS dan Android, namun masalah yang mengganggu ini tetap ada hingga hari ini.

Alasan utama munculnya situasi ini adalah kekhawatiran yang diungkapkan oleh manajer proyek dan pengembang seluler bahwa pengguna mereka mungkin bingung jika mereka melihat aplikasi yang sama di platform lain, dan menyadari bahwa itu tidak memberikan perasaan dan UI yang sama persis. Adalah adil untuk mengatakan bahwa sampai batas tertentu, garis pemikiran ini masuk akal, karena beberapa tingkat kesamaan diperlukan dan disambut baik. Namun, mengambilnya terlalu jauh dan, dalam kasus ekstrem, membuat klon aplikasi yang tepat untuk platform yang berbeda sebenarnya cenderung lebih banyak merugikan daripada menguntungkan.

Tujuan utamanya adalah mencapai keseimbangan yang tepat—jangan memaksakan konsistensi piksel yang sempurna, tetapi tetap berpegang pada ide desain umum dan pertahankan peta navigasi aplikasi Anda serupa untuk kedua platform; menyediakan fitur yang sama dan alur kerja yang sama, tetapi cobalah untuk tetap berpegang pada perilaku asli sedapat mungkin.

Semua orang menyukai tombol khusus atau animasi mewah di sana-sini, tetapi elemen asli adalah yang biasa digunakan orang dan lebih mudah dan lebih intuitif untuk digunakan.

Fokus pada Pengguna, Bukan Penampilan

Untuk menemukan pendekatan yang baik untuk mengatasi dilema ini, kita harus mulai dari akhir baris—pengguna akhir. Penelitian memberi tahu kita bahwa pengguna Android dan iPhone adalah orang yang sangat berbeda dan jika kita menargetkan UX yang optimal, kita harus mencoba masuk ke pola penggunaan mereka.

Mulai dari anggaran rata-rata orang memutuskan untuk menghabiskan teknologi per bulan ( iPhone: $100.88, Android: $50.83 ) , melewati jumlah selfie yang mereka buat per hari iPhone: 12, Android: 7 dan mendapatkan teks yang mereka kirim setiap hari iPhone : 57, Android: 26 , mudah untuk melihat bahwa perbedaan itu substansial, sampai-sampai kita dapat menyimpulkan bahwa ada perbedaan dalam perilaku, yang mendorong cara orang menggunakan perangkat mereka.

Jadi, apa yang harus kita fokuskan saat mendesain aplikasi untuk kedua platform secara bersamaan?

Pertama-tama, pilih elemen asli jika memungkinkan. Bahkan jika Anda menggunakan kerangka kerja lintas platform, sebagian besar komponen didasarkan pada tampilan asli murni; jadi kecuali Anda benar-benar membutuhkan sesuatu yang khusus—tetaplah pada dasar-dasarnya. Orang-orang suka menggunakan apa yang biasa mereka gunakan dan Anda akan menghemat waktu pengembangan untuk fitur yang lebih penting (dan ulasan kode!).

Tampilan kustom pasti dapat menghadirkan karakter dan keunikan dalam aplikasi Anda, selama tampilan tersebut mempertahankan ide umum dan perasaan penggunaan yang sama seperti yang umum—terlalu sedikit dan aplikasi Anda membosankan, terlalu banyak, dan tidak perlu mencolok serta sulit digunakan.

Terkadang, bahkan sentuhan kecil dengan tampilan kustom yang sedikit berbeda dapat menjadi pengubah permainan untuk aplikasi Anda, tetapi jika Anda mengisi semua layar dengan elemen baru untuk dijelajahi pengguna, mereka mungkin kewalahan dan tersesat saat mencari informasi penting. Bukan kebetulan bahwa sentuhan-sentuhan kecil ini disebut "poles!"

Cara Mendekati Komponen Desain yang Berbeda

Sebagai aturan praktis, selalu ingat bahwa setiap platform memiliki pedoman desainnya sendiri. Serangkaian pendekatan Android adalah menginjak Desain Material, sementara Apple mempercayai Desain Antarmuka Manusia. Masuk ke komponen spesifik yang harus kita pertimbangkan saat merencanakan desain kita, ada beberapa bagian utama yang harus difokuskan:

1. Gaya umum: kecuali kita berbicara tentang aplikasi lintas platform, kita harus mempertimbangkan untuk mengikuti pedoman gaya umum untuk setiap platform. Secara keseluruhan, desain iOS cenderung lebih datar, sementara Android menggunakan pendekatan yang lebih berlapis.

   Secara historis, platform seluler telah saling mempengaruhi selama satu dekade atau lebih, dan Anda dapat dengan mudah menemukan beberapa konsep Android di iOS dan sebaliknya. Misalnya, ketika sensor sidik jari mulai muncul di dunia seluler, pabrikan ( dan masih ) bereksperimen dengan ukuran dan lokasi sensor, mencoba membuatnya nyaman bagi sebanyak mungkin pengguna. Pada saat yang sama, desainer dan pengembang juga beradaptasi dengan fitur baru, sehingga pada akhirnya, elemen visual dan umpan balik sebagian besar identik di kedua platform (kecuali untuk beberapa pendekatan eksotis).

2. Spesifik perangkat keras dan pola navigasi: ini mungkin salah satu contoh paling mencolok dari hal negatif dari mengkloning aplikasi Anda secara langsung. Sebagian besar perangkat Android masih memiliki kenyamanan bilah navigasi tambahan (baik perangkat keras atau perangkat lunak pada perangkat yang berbeda), termasuk tombol kembali. Karena iOS tidak menyediakan itu, aplikasi harus mempertimbangkan di mana dan kapan menyediakan tombol kembali, biasanya di sudut kiri atas setiap layar.

   Tombol menu (tombol persegi dalam contoh ini) juga dapat menyediakan fungsionalitas tambahan untuk aplikasi Android. Di mana ini relevan? Misalnya saat membuka menu pengaturan atau fitur navigasi serupa.

   

   Sampai saat ini, iPhone juga menampilkan tombol Home tradisional Apple, tetapi sejak diperkenalkannya iPhone X, tombol tersebut telah dikesampingkan dan aliran di iOS sekarang didasarkan pada gerakan. Jika menggesek adalah bagian penting dari aplikasi Anda, pastikan untuk memberikan bantalan yang cukup antara tepi wadah aplikasi dan area gesekan yang Anda izinkan untuk menghindari kebetulan gesekan yang rumit.

   Jika aplikasi Anda bergantung pada fungsionalitas khusus perangkat keras seperti Bluetooth, NFC, atau headphone berkabel, Anda harus selalu mempertimbangkan berbagai spesifikasi perangkat keras yang berbeda yang Anda dukung. Cobalah untuk memberikan umpan balik yang tepat kepada pengguna ketika mereka mencoba berinteraksi dengan fitur tertentu. Jika karena alasan tertentu Anda perlu menyediakan fitur khusus perangkat keras hanya untuk satu dari dua platform, pastikan untuk memberi tahu pengguna Anda tentang perbedaannya.

3. Elemen global (bilah status, tajuk, dll.): komponen yang muncul di semua halaman desain Anda, seperti bilah status, tajuk navigasi, dan sebagainya, harus benar-benar bertujuan untuk memberikan perasaan asli, jadi kami tidak boleh mengubahnya tinggi dan gaya batang tersebut. Ada perbedaan kecil dalam bagaimana elemen global ditata di kedua platform. Misalnya, Android menggunakan teks rata kiri sementara iOS menggunakan judul di tengah. Bilah status adalah komponen asli sehingga Anda tidak perlu mengkhawatirkannya, tetapi ingatlah takik dan rasio aspek layar yang berbeda saat merencanakan bagian atas aplikasi Anda.

   

   

4. Navigasi: Pedoman Desain Material lama Google menyarankan untuk menggunakan navigasi menu laci di aplikasi Android, dengan navigasi bawah berada di belakang, tetapi masih menjadi pilihan yang layak. iOS cenderung hanya untuk bilah tab, yang dapat membatasi opsi navigasi tingkat atas Anda tetapi memberikan pandangan yang jelas tentang semuanya sekaligus. Dalam hal ini, kedua sistem operasi menyediakan komponen serupa yang dapat digunakan bergantung pada kerumitan aplikasi Anda, tetapi perbedaan visual dalam kedua sistem tersebut seharusnya mengarahkan Anda secara alami—misalnya, bilah navigasi global di Android dan kekurangannya di iOS.

   Evolusi yang cepat dari perangkat keras seluler dalam beberapa tahun terakhir telah memperkenalkan banyak variabel dan hal yang tidak diketahui: ponsel semua layar, takik dengan berbagai bentuk dan ukuran, peningkatan penggunaan gerakan untuk navigasi di seluruh perangkat, dan sebagainya. Semua perubahan itu memberikan kekuatan yang belum pernah terjadi sebelumnya kepada pengguna, tetapi dapat menyusahkan ketika kami mencoba mencari tahu semua kasus penggunaan layar tertentu di aplikasi kami. Mengingat masalah ini, pendekatan yang baik untuk menghindari kebingungan bagi pengguna kami adalah menjaga pola navigasi tetap sederhana dan konsisten, tanpa membebani aplikasi dengan terlalu banyak gerakan, bilah, dan opsi gesek multi-arah.

   

5. Tipografi: kedua platform memiliki tipografi default— San Francisco untuk iOS dan Roboto untuk Android. Kecuali jika Anda menggunakan font khusus, yang sangat cocok dengan gaya aplikasi umum Anda, Anda harus tetap menggunakan default. Ingatlah bahwa pengguna mungkin mengubah font sistem default mereka dan ini tidak akan memengaruhi tampilan apa pun yang telah Anda sesuaikan dengan jenis huruf tertentu.

   Misalnya, pengguna disleksia mungkin tidak memiliki waktu terbaik di aplikasi Anda jika mereka telah mengganti font default dengan font yang secara khusus memenuhi kebutuhan mereka. Jika Anda mendukung pengguna yang mungkin menggunakan font non-Latin (seperti Sirilik, Arab, dll.), pastikan font kustom Anda juga menyediakan karakter tambahan tersebut. Jika Anda menyukai game, Anda mungkin melihat papan peringkat dengan skor tinggi yang diraih oleh pemain Rusia yang namanya menonjol karena fontnya yang berbeda. Ini hanya kesalahan kecil yang dibuat selama fase pengembangan, bukan "fitur" untuk pemain tertentu, dan meskipun mungkin tidak akan membuat pengguna membuang aplikasi Anda, itu pasti dapat mengakibatkan pengalaman pengguna yang menurun atau mengakibatkan keluhan atau ulasan yang buruk.

   

6. Komponen lain: tombol, transisi layar, animasi, interaksi mikro, lembar tindakan, peringatan, dan semua jenis kontrol aliran lainnya berada di luar cakupan artikel ini, tetapi komponen tersebut harus mengikuti prinsip umum yang kami terapkan pada elemen desain lain sejauh ini— kedua platform mencegah elemen kustom yang berlebihan, karena dapat mengganggu dan membingungkan pengguna; dalam hal desain, kesan pertama biasanya yang terakhir bagi banyak pengguna dan itulah mengapa sangat penting untuk menarik perhatian pengguna sejak awal, dan membuat mereka merasa seperti di rumah sendiri.

Di dunia nyata, Anda dapat melihat beberapa pengecualian yang sangat populer untuk aturan yang kita diskusikan—aplikasi iOS yang mengikuti pedoman Desain Material dan beberapa produk Android mengikuti pedoman Antarmuka Manusia Apple, tetapi aplikasi tersebut memiliki gayanya sendiri yang telah terbukti. Pengguna sudah familiar dengan aplikasi dan desainnya, dan bagi mereka, masuk akal untuk memberikan perasaan yang sedikit lebih khusus.

Pendekatan Lintas-Platform Dilakukan dengan Benar

Di sisi lain, jika proyek Anda didasarkan pada solusi lintas platform (seperti React Native, Flutter, Xamarin, dll.), Anda harus mempertimbangkan platform utama yang ingin Anda fokuskan dan mulai dari sana.

Dalam beberapa tahun terakhir, kerangka kerja baru ini telah memberikan peningkatan produktivitas besar-besaran dalam pengembangan aplikasi lintas platform. Semakin banyak perusahaan yang beralih ke paradigma pengembangan ini, karena memberikan waktu yang lebih singkat untuk memasarkan, efektivitas biaya yang unggul, dan hambatan teknis yang lebih sedikit, dengan kelemahan utama adalah dukungan fitur yang terbatas dan UX yang kurang optimal dalam beberapa kasus.

Sementara hampir semua solusi lama untuk pengembangan lintas platform didasarkan pada tampilan web dan oleh karena itu mengalami masalah serius dengan responsivitas pada banyak perangkat, saat ini kita dapat menggunakan komponen asli bahkan dalam pendekatan lintas platform. Peningkatan besar ini telah memengaruhi pasar dalam banyak hal dan telah membawa semua platform seluler selangkah lebih dekat menuju pemersatu pengalaman visual pengguna di berbagai perangkat dan platform.

Jika Anda memutuskan untuk menggunakan solusi lintas platform, Anda dapat memulai seperti dalam aplikasi asli standar dengan membangun kerangka aplikasi Anda. Setelah Anda memiliki dan menjalankan prioritas utama Anda (mengatur dependensi dasar, membangun MVP, mencapai tonggak khusus proyek, merilis versi pertama Anda, dll.), Anda dapat dengan mudah memisahkan desain utama Anda untuk dua aplikasi, menggunakan platform- alat khusus yang disediakan setiap kerangka kerja. Bergantung pada ukuran tim Anda dan kerangka waktu yang tersedia, Anda bahkan dapat mempertimbangkan untuk memasukkan tweak tersebut di versi 1, hanya untuk menghindari kebingungan di masa mendatang ketika segala sesuatunya tidak terlihat sama lagi dalam versi platform tertentu.

Setelah semua dikatakan dan dilakukan, Anda harus mengevaluasi prinsip mana yang akan valid untuk aplikasi Anda. Seperti di hampir semua usaha di industri kami, Anda harus mencoba mengikuti panduan, sambil sedikit menyesuaikannya agar sesuai dengan kebutuhan spesifik Anda. Misalnya, jika navigasi laci adalah yang benar-benar masuk akal untuk aplikasi lima layar sederhana Anda, maka Anda tidak perlu menemukan solusi rumit untuk setiap platform. Buat jelas dan mudah bagi pengguna untuk mengenali tombol dan alat khusus Anda, baik itu komponen utama atau hanya penyesuaian kecil.

Desain yang Baik Menghargai Kebiasaan Pengguna

Singkatnya, kita dapat mengulangi sesuatu yang sudah kita ketahui—desain yang baik adalah desain yang menghormati kebiasaan pengguna di setiap sistem operasi. Sedikit polesan di bagian akhir dapat membuat perbedaan antara rata-rata dan aplikasi hebat.

Sering kali, aplikasi Anda tidak akan menyediakan fitur unik yang cukup untuk memenangkan pengguna dengan konten saja. Kebanyakan orang akan menggambarkan keputusan mereka untuk memilih satu produk daripada yang lain dengan "firasat". Kategori pengguna ini mendasarkan pilihan mereka terutama pada apa yang mereka rasakan saat menggunakan aplikasi dengan secara implisit mengevaluasi responsivitas, pilihan gaya umum, palet warna, dan komponen visual individual yang mereka lihat di layar.

Oleh karena itu, cobalah untuk memastikan produk Anda menonjol tidak hanya karena fitur-fiturnya yang luar biasa, tetapi juga dengan kemasan bermutu tinggi agar sesuai dengan kualitas layanan yang diberikannya.