{"id":7669,"date":"2020-09-29T13:30:54","date_gmt":"2020-09-29T06:30:54","guid":{"rendered":"http:\/\/crocodic.com\/?p=7669"},"modified":"2020-09-29T14:27:26","modified_gmt":"2020-09-29T07:27:26","slug":"elemen-elemen-yang-sering-terlewat-saat-mendesain-aplikasi-mobile","status":"publish","type":"post","link":"https:\/\/crocodic.com\/id\/elemen-elemen-yang-sering-terlewat-saat-mendesain-aplikasi-mobile\/","title":{"rendered":"Elemen \u2013 Elemen yang Sering Terlewat Saat Mendesain Aplikasi Mobile"},"content":{"rendered":"

Mendesain aplikasi<\/a> mobile bukan hanya sekadar untuk memanjakan mata user, terutama dalam dunia mobile apps<\/a> mobile yang maksimal<\/strong>, baik mobile apps development android<\/strong> ataupun mobile apps development iOS<\/strong>, hal ini mungkin dapat terjadi di beberapa mobile apps developer<\/a> di Indonesia<\/strong>, elemen desain ini juga dapat menjelaskan bagaimana aplikasi mobile yang dibuat bisa berinteraksi secara baik dengan user.<\/p>\n\n\n\n

Tapi sering kali elemen \u2013 elemen kecil itu terlewat saat desainer sedang mengerjakan tugasnya. Walaupun kecil, namun elemen itu bisa berdampak besar untuk aplikasi mobile. Berikut adalah elemen \u2013 elemen yang sering terlewat saat mendesain aplikasi mobile.<\/p>\n\n\n\n

1. Loading<\/strong><\/h2>\n\n\n\n

Elemen ini berfungsi agar user tahu bahwa aplikasi mobile sedang dalam proses. Elemen ini biasa diimplementasikan pada saat berpindah dari satu halaman ke halaman lainnya, pemrosesan data<\/a>, mendownload foto, mengupload foto, dan yang lainnya.<\/p>\n\n\n\n

Jika aplikasi mobile yang dibuat tidak menampilkan loading, bisa mengakibatkan user salah persepsi. Bisa jadi user berpikir bahwa aplikasi mobile itu crash atau error karena mereka tidak melihat proses yang sedang berjalan pada aplikasi mobile yang sedang meraka gunakan.<\/p>\n\n\n\n

\u201cLayaknya perempuan, user juga perlu kejelasan, jangan sampai membuat user berpikir dua kali atau mereka akan beralih ke lain aplikasi\u201d #halah<\/em><\/h5>\n\n\n\n
\"\"<\/figure>\n\n\n\n
Contoh Elemen Loading yang ada pada beberapa aplikasi mobile. | Airbnb, Pinterest<\/h6>\n\n\n\n

2. Error dan Success State<\/h2>\n\n\n\n

Elemen Error<\/strong> dan Success State<\/strong> ini berfungsi untuk memberi tahu user apakah langkah yang telah mereka lakukan benar atau salah. Interaksi ini penting untuk menyampaikan pesan kepada user tentang apa yang baru saja mereka lakukan.<\/p>\n\n\n\n

\u201cBeri tahu user tentang apa yang baru saja mereka lakukan, jangan cuma didiemin. Ingat \u2026 didiemin itu engga enak! #paansi<\/em><\/h5>\n\n\n\n

Baiknya, Error State<\/strong> memberikan informasi tentang dimana letak kesalahan, dan apa yang harus diperbaiki oleh user. Jadi jangan setengah \u2013 setengah. Misalnya jika hanya informasi tentang kesalahan saja yang kita berikan, pastinya itu akan membuat user berpikir dua kali.<\/p>\n\n\n\n

Success State <\/strong>memberikan informasi tentang apa yang selanjutnya harus dilakukan oleh user setelah melewati suatu proses, tapi tidak semua success state seperti itu. Karena ada beberapa ada beberapa proses yang tidak memerlukan langkah selanjutnya.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n
Contoh Error State dan Success State dalam sebuah aplikasi mobile<\/h6>\n\n\n\n

3.    Empty State atau Data Kosong<\/strong><\/h2>\n\n\n\n

Elemen Empty State<\/strong> dibutuhkan saat suatu halaman tidak bisa menampilkan data atau konten. Biasanya karena halaman ini belum terisi data atau konten.<\/p>\n\n\n\n

Ada dua jenis empty state, pertama empty state dengan tombol action<\/strong>, dan kedua empty state tanpa tombol action<\/strong>.
<\/p>\n\n\n\n

Empty State dengan Tombol Action<\/strong><\/p>\n\n\n\n

Saat kita menggunakan aplikasi mobile tiket online dan membuka menu riwayat pembelian maka kita akan melihat informasi bahwa kita belum memiliki riwayat pembelian, untuk mendorong pembelian maka ditempatkan tombol action di halaman itu.
<\/p>\n\n\n\n

Empty State Tanpa Tombol Action<\/strong><\/p>\n\n\n\n

Tidak semua empty state menggunakan tombol action. Ada juga halaman empty state yang tidak memerlukan tombol action. Salah satunya adalah halaman notifikasi.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n
Contoh Empty State dengan<\/g> button action dan Empty State tanpa<\/g> tombol<\/g> action. | Traveloka, Task, Instagram<\/h6>\n\n\n\n

Selain mengganggu proses mobile apps development<\/strong>, melewatkan beberapa elemen ini juga bisa memengaruhi aplikasi mobile yang telah dibuat. Karena elemen \u2013 elemen ini sangat memengaruhi proses interaksi dengan user.<\/p>\n\n\n\n

Sebagai bagian dari mobile apps developer<\/strong> yang baik, jangan biarkan user sampai berpikir ulang hanya karena kita melewatkan satu bagian kecil ini. Karena desain yang baik adalah desain yang tidak membuat user berfikir.<\/p>\n\n\n\n

<\/p>","protected":false},"excerpt":{"rendered":"

Mendesain aplikasi mobile bukan hanya sekadar untuk memanjakan mata user, terutama dalam dunia mobile apps development, baik mobile apps development android ataupun mobile apps development iOS, hal ini mungkin dapat terjadi di beberapa mobile apps developer di Indonesia, elemen desain ini juga dapat menjelaskan bagaimana aplikasi mobile yang dibuat bisa berinteraksi secara baik dengan user. […]<\/p>\n","protected":false},"author":1,"featured_media":8995,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[354,355,82],"tags":[360],"class_list":["post-7669","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-crocodic-design","category-crocodic-dec","category-aplikasi-mobile-android-ios","tag-design-mobile-apps-development"],"acf":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/crocodic.com\/id\/wp-json\/wp\/v2\/posts\/7669","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/crocodic.com\/id\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/crocodic.com\/id\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/crocodic.com\/id\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/crocodic.com\/id\/wp-json\/wp\/v2\/comments?post=7669"}],"version-history":[{"count":2,"href":"https:\/\/crocodic.com\/id\/wp-json\/wp\/v2\/posts\/7669\/revisions"}],"predecessor-version":[{"id":8996,"href":"https:\/\/crocodic.com\/id\/wp-json\/wp\/v2\/posts\/7669\/revisions\/8996"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/crocodic.com\/id\/wp-json\/wp\/v2\/media\/8995"}],"wp:attachment":[{"href":"https:\/\/crocodic.com\/id\/wp-json\/wp\/v2\/media?parent=7669"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/crocodic.com\/id\/wp-json\/wp\/v2\/categories?post=7669"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/crocodic.com\/id\/wp-json\/wp\/v2\/tags?post=7669"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}