Mobil Deneyimde Responsive'in Bittiği Yer
Mobil uyumluluk çoğu projede tek soruya indirgeniyor: sayfa küçük ekranda bozuluyor mu? Bozulmuyorsa iş bitmiş sayılıyor. Oysa yerleşimin akması ile kullanıcının aradığı işi bulması aynı şey değil, ve aradaki farkı kapatan kararların çoğunun kırılma noktalarıyla ilgisi yok.
Yerleşim akıyor, görev akmıyor
Kırılma noktaları sütunları alt alta indirir. Bu, sayfanın telefonda bozulmamasını sağlar. Masaüstünde yan yana duran sekiz eylem alt alta dizildiğinde sekiz eylem olmaya devam eder, sadece kaydırma uzar.
Yapılacak iş, mobil oturumun ne için açıldığını belirlemek. Analitikte mobil trafiğin hangi üç sayfada yoğunlaştığına bak, o üç görevi ilk ekrana çıkar, kalanı menüye insin. Hangisi olduğuna karar veremiyorsan sayfayı olduğu gibi taşımak yerine tek bir birincil eylem seç: yanlış seçim bile, hiç seçmemekten daha iyi ölçülür.
Dokunma hedefini tahmin etme
Material Design minimum 48x48 dp söylüyor, Apple'ın kılavuzu 44x44 pt. İkisi de kabaca bir yetişkin parmak ucunun temas alanı. 32 piksellik bir ikon düğmesi masaüstünde sorunsuz çalışır, telefonda yanlış dokunma üretir.
Görsel boyutu büyütmek zorunda değilsin, dokunulabilir alanı büyütmen yeterli: padding ya da görünmez bir sözde eleman işi görür. Yan yana duran iki hedefin arasına da en az 8 dp boşluk koy, yoksa yeterince büyük hedefler bile birbirine karışır.
Senkronizasyon bir arayüz kararıdır
"Cihazlar arasında kusursuz senkronizasyon" diye bir özellik yok. Çakışma politikası var. Aynı kaydı telefondan ve masaüstünden değiştiren bir kullanıcı çıktığında sistem üç şeyden birini yapar: son yazanı kazandırır, kullanıcıya sorar, ya da sessizce birini siler. Üçüncüsü bir hata değil, karar verilmemiş olmanın sonucu.
Tasarım tarafındaki karşılığı net: hangi verinin son-yazan-kazanır olacağını, hangisinin kullanıcıya sorulacağını arayüz kararı olarak yaz. Bir not uygulamasında metin gövdesi soruyu hak eder, okundu bilgisi etmez. Bu ayrımı sen yapmazsan geliştirme tarafında varsayılan her zaman en ucuz seçenek olur.
Cihazın kendi yeteneklerini kullan
Mesajdaki numarayı arama düğmesine çevirmek için modül gerekmiyor, tel: bağlantısı yeterli. Aynı mantıkla adres için harita uygulamasını açan bağlantı, tarih alanı için type="date", telefon alanı için inputmode="numeric". Bunlar kullanıcının önüne kendi cihazının bildiği klavyeyi ve uygulamayı getirir. Kendi yazdığın tarih seçici bunun neredeyse her zaman daha kötüsünü yapar, üstelik erişilebilirliğini de sıfırdan kurman gerekir.
İçeriği kısaltma, sırala
"Mobilde metin kısa olsun" tavsiyesi yarı yanlış. Kullanıcı bilgi almaya geldiyse okur; bıraktığı nokta metnin uzunluğu değil, aradığını ilk ekranda görememesi. Metni budamak yerine cevabı yukarı al, gerekçeyi aşağıda bırak. Ürün sayfasında fiyat, stok durumu ve sepete ekleme üstte dursun; kumaş bilgisi aşağıda kalsın, silinmesin.