32 Perbedaan Desain antara Aplikasi iOS dan Android

Bukan sekadar perbandingan sederhana, tetapi juga artikel yang bagus untuk memahami keunggulan khas UI masing-masing OS

Perbedaan dasar

1. HIG vs. Material Design

2. Satuan: pt vs. dp

3. Layar: 320pt x 568pt vs. 360dp x 640dp

4. Font: San Francisco vs. Roboto

5. Navigation bar Android

6. Shadow dan Elevation pada Material Design

7. Penamaan:

→ Tab bar vs. Bottom Navigation Bar

→ Navigation Bar vs. Top App Bar,

→ Segmented Controls vs. Tabs

→ Alerts vs. Dialogs

→ Touch ID vs. Android Fingerprint

8. Metode navigasi level atas

9. Perbedaan antara tab bar dan bottom navigation bar

10. Fitur khusus tab Android

11. Perbedaan cara menampilkan halaman turunan

12. Pola pemanggilan navigation drawer (drawer)

13. Perbedaan perilaku saat scroll

14. Perbedaan perilaku pencarian

Perbedaan komponen (UI)

15. Hal-hal yang tidak ada di iOS

→ Navigation Drawer, Backdrops, Banner, Snackbar, Chips, Bottom App Bar, FABs(Floating Action Button), Bottom Navigation Drawer, Side Sheet, Expanding Bottom Sheet, Standard Bottom Sheet,

16. Hal-hal yang tidak ada di Android

→ Page Control, Toolbars, Steppers, Popovers

17. Status Bar yang sama tetapi berbeda

18. Refresh Content Control vs. Swipe to refresh

19. Perbedaan visual pada kontrol

20. Perbedaan bentuk panah kembali dan posisi header

21. Perbedaan ikon "tiga titik"

22. Pickers: pemilih tanggal iOS berbentuk drum, Android berbentuk kalender biasa

23. Perbedaan text field

→ iOS menampilkan label di atas field lalu menghilangkannya saat input, Android memindahkannya ke atas saat input

→ Tombol clear isi kurang lebih serupa

→ Material Design menonjolkan garis bawah dengan warna primary saat input

24. Context Menus vs. Menus

25. Action View/Activity View vs. Modal Bottom Sheet

26. Edit Menus vs. Text Selection Toolbar

27. Ukuran divider: iOS 0.5pt vs. Android 1dp

Perbedaan lainnya

28. Ukuran tap zone: iOS 44x44pt, Android 48x48dp

29. App Store vs. Google Play

30. Undo/Redo khas iOS: saat pengguna menggoyangkan ponsel, fungsi Undo dijalankan

31. Perbedaan launch screen: Material mengizinkan logo aplikasi pada launch screen, tetapi HIG tidak merekomendasikan penggunaan launch screen untuk tujuan pemasaran. Hanya digunakan sebagai placeholder

32. Elemen tambahan pada Material Design: Data Format, Data Visualization, Empty States, Offline States, dan lain-lain

[xguru]

Kalau startup, sebaiknya aplikasi dikembangkan dengan apa? Untuk pertanyaan seperti itu, jawaban dasar saya adalah

#1 Jika layanannya tidak benar-benar membutuhkan aplikasi, cukup buat mobile web yang bagus terlebih dahulu.

#2 Jika aplikasi memang wajib, pada tahap awal dukung platform iOS/Android sekaligus dengan React Native atau Flutter.

#3 Jika pengguna bertambah banyak, jumlah developer meningkat, dan dana sudah tersedia, Anda juga bisa beralih ke aplikasi native yang dioptimalkan untuk masing-masing OS. (Swift & Kotlin)

Tapi, jawaban ini sama persis dengan 10 tahun lalu.

Bedanya saat itu hanya HTML5, Hybrid(Phonegap), Objective C++ & Java..

Sekarang kalau web dibuat dengan React, mungkin jadi sedikit lebih nyaman karena ada React Native.

Saya selalu merekomendasikan #1, lalu #2, dan #3 itu opsional.

Tulisan perbandingan UI ini perlu dipahami dengan baik saat memilih opsi #3, dan tetap bagus juga untuk dibaca saat memilih #2.

[laeyoung]

Melanjutkan komentar yang ditinggalkan xguru

Namun, jika ini adalah layanan yang sangat bergantung pada hardware seperti kamera, GPS, akselerometer, dan sebagainya, langsung saja ke nomor 3.

(contoh: ingin membuat aplikasi filter video real-time -> ke #3...)