Etkin Mobil Deneyimi İçin Hız Odaklı Çözümler

Kullanıcı deneyiminin güçlü etkileşimler ve akıcı unsurlar ile zenginleştirilmesine yönelik uygulamalar.

01 — App Shell ve Skeleton screen tasarımı

App Shell

a.Cache ye kaydedilmiş “App shell” ani bir şekilde yüklenir. b.“Skeleton screen” sayfa geçişlerinde hız algısı sağlar. c.Sayfa içeriği yüklenince sayfayı doldurur

Skeleton Screen

Kullanıcı beklemedeyken kendisine sunulacak içerikleri tahmin edebilmeli ve dikkatini tasarımda tutabilmeli.

02 — Aktif Mod’da bekleme

Atari GIF by Myles.

03 — Doğru yükleme göstergesi “preloader” kullanımı

Tahmin edilen sürelere göre spinner, progress bar veya rakam kullanılır.

04 — Anlık mikro etkileşim

Vakkorama Mobile App Prototype

05 — Doğru “easing” kullanımı

  • Ease-out: Hızlı başlayıp, sonrasında yavaşlayan tipte animasyondur.
  • Ease-in: Yavaş başlayıp, ease-out ile aynı süre içerisinde sonradan hızlanır.
  • Ease-in-out: Başta ve sonda yavaş olup, ortada ivme kazanan tipte animasyondur.
  • Elastic ve bounce: Elastic, hareketi daha uzun süreye yayan, hızlı başlayan animasyon olup, bounce sürekli iniş ve çıkış gösteren hareket hızlarını içerir.
  1. Tasarımda yer alan UI nesneleri için Ease-out kullanın.
  2. Ease-in ve Ease-in-out sürelerini kısa tutun.
  3. Bounce ve Elastic tipi hareketler için 800ms-1200ms süre aralığı ideal olacaktır.
  4. Ease-out ve Ease-in tipi hareketler için 200ms-500ms süre aralığı ideal olacaktır.
ease-out vs ease-in

06 — İyimser “optimistic” UI tasarımı

07 — Proaktif işleme başlama (Preemptive start)

08 — Erken tamamlama (Early completion)

Airbnb, Uygulama hazır olmadan önce arama UI hazır gibi görünüyor.

--

--

-99 design studio is a multi-disciplinary digital agency specialized in creating useful and engaging digital products.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
-99 design studio

-99 design studio is a multi-disciplinary digital agency specialized in creating useful and engaging digital products.