iOS ve Android uygulamalarının tasarımındaki 32 fark

Bu yazı, sadece basit bir karşılaştırma sunmakla kalmıyor; aynı zamanda her OS UI’sinin öne çıkan güçlü yanlarını anlamak için de faydalı.

Temel farklar

1. HIG vs. Material Design

2. Birim: pt vs. dp

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

4. Yazı tipi: San Francisco vs. Roboto

5. Android navigasyon çubuğu

6. Material Design’ın Shadow ve Elevation özellikleri

7. Adlandırma:

→ 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. Üst seviye navigasyon yöntemleri

9. Tab bar ile alt navigasyon çubuğu arasındaki fark

10. Android sekmelerinin özel işlevleri

11. Alt sayfaların gösterilme biçimindeki farklar

12. Navigation Drawer çağırma kalıpları

13. Kaydırma sırasındaki davranış farkları

14. Arama davranışındaki farklar

Bileşen (UI) farkları

15. iOS’ta olmayanlar

→ 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. Android’de olmayanlar

→ Page Control, Toolbars, Steppers, Popovers

17. Aynı ama farklı olan Status Bar

18. Refresh Content Control vs. Swipe to refresh

19. Kontrollerin görsel farkları

20. Geri okunun şekli ile başlık konumundaki fark

21. "Üç nokta" ikonundaki farklar

22. Pickers: iOS’ta tarih seçimi tambur tipindeyken, Android’de normal takvim görünümündedir

23. Metin alanı farkları

→ iOS, etiketi alanın üstünde gösterir ve giriş başladığında kaybolur; Android’de ise giriş sırasında yukarı taşınır

→ İçeriği temizleme düğmesi benzerdir

→ Material Design, giriş sırasında alt çizgiyi Primary rengiyle vurgular

24. Context Menus vs. Menus

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

26. Edit Menus vs. Text Selection Toolbar

27. Ayırıcı boyutu: iOS 0.5pt vs. Android 1dp

Diğer farklar

28. Dokunma alanı boyutu: iOS 44x44pt, Android 48x48dp

29. App Store vs. Google Play

30. iOS’un ilginç Undo/Redo özelliği: kullanıcı telefonu salladığında Undo işlevi çalışır

31. Açılış ekranı farkı: Material, açılış ekranında uygulama logosuna izin verir; ancak HIG, açılış ekranının pazarlama amacıyla kullanılmasını önermez. Yalnızca yer tutucu olarak kullanılmalıdır

32. Material Design’ın ek öğeleri: Data Format, Data Visualization, Empty States, Offline States vb.

[xguru]

Bir startup’ız; uygulamayı neyle geliştirmeliyiz? sorusuna benim temel cevabım şu:

#1 Uygulamanın gerçekten gerekli olmadığı bir hizmetse, önce sadece mobil web’i iyi yapmak da yeterlidir.

#2 Uygulama gerçekten gerekiyorsa, başlangıçta React Native veya Flutter ile iOS/Android platformlarını aynı anda destekleyin.

#3 Kullanıcı sayısı artar, geliştirici ekibi büyür ve bütçe oluşursa, her OS için optimize edilmiş native uygulamalara geçmek de iyi olabilir. (Swift & Kotlin)

Ama ilginç olan şu, bu cevap 10 yıl önce de aynıydı.

O zamanlar sadece HTML5, Hybrid(Phonegap), Objective C++ & Java vardı..

Bugün web’i React ile yaparsanız, React Native sayesinde biraz daha rahat olabilir tabii.

#1 kesin, #2’yi öneririm, #3 ise tercih meselesi

Bu UI karşılaştırma yazısı, #3 söz konusu olduğunda iyi anlaşılması gereken; #2 için de önceden göz atılması faydalı bir yazı.

[laeyoung]

xguru’nun bıraktığı yorumu devam ettirerek

Ancak kamera, GPS, ivme sensörü gibi donanıma çok bağımlı bir hizmetse doğrudan 3. maddeye geçin.

(örn. gerçek zamanlı video filtre uygulaması yapacağım -> #3’e...)