Mobil formlar için ipuçları

Mobil formlar, masaüstü formlardan çok daha fazla kısıta sahip. Ekranlar daha küçük, girdi alanlarını kullanmak daha zor ve küçük hatalar büyük kayıplara neden olabiliyor. O yüzden her bir kısıt için bulduğunuz çözümleri, tasarımda bakış açınız olarak yansıtabilmek de büyük bir marifet.

Hatayı görmek kolay olmalı

Mobil formları, iki tarafın da birbirine uyumlu hareket etmesi gereken bir tür diyalog olarak ele alabiliriz. Kullanıcıya yaptığı hatayı ya da eksiği gösterebilmek için sadece doğru alanları ya da renkleri kullanabilir, bunun yanında yanında animasyonlara da yer verebiliriz. Formlarda özellikle hata kullanımlarını görmek istiyorsanız size bu yazıyı okumanızı öneririm.

erorr1-01-01
Kullanıcı formdaki eksiklikleri anında ve aynı ekranda görebilmeli. Başka bir deyişle form girdilerinde eksik ya da hatalı alanları, pop-up uyarı bildirimleriyle göstermek iyi bir fikir olmayabilir. Aşağıdaki örnekte görebileceğiniz gibi, bu uyarı alelacele geçildiği zaman kullanıcının hangi alanda hata yaptığına dair hiçbir fikri olmayacak.
alert

Okumak kolay olmalı

Desktop ve mobil arasındaki alan farklılığını doğru kullanarak kolay okunan form alanları yaratabilirsiniz. Formun olması gereken düşey hareketi her zaman korunmalı ancak istisnai durumlar için de özel çözümler üretmek de gerekebiliyor.
simple-01-01
Her ne kadar ilgili alanın üzerinde her zaman başlığı olması gerektiğini düşünüyorsak da cihazını yatay kullananlar için de özel çözümler düşünülebilir. Aşağıdaki örnekte görülen, kullanım farklılıklarına ayak uydurabilen bu form yapısı belki projenize uygun bir çözüm olabilir. baymard

Kullanıcı minimum efor harcamalı

Girdi alanlarını en aza indirgemek hem formunuzun daha kolay yüklenmesini, hem de kullanıcının formu daha akıcı doldurmasını sağlar. Telefon numarası, tarihler gibi bol seçenekli veri girişlerinde, kullanıcıyı en kısa yolla yönlendirebilmek çok önemli.
airbnb-01

Küçük jestlerle formları kolaylaştırmak

Eğer seçenekleriniz uygunsa, standart bir dropdown kullanacağınız yerde seçeneklerinizi yayabilir, kullanıcının hem seçenekleri görmesini sağlar hem de yolunu kolaylaştırabilirsiniz. 02b-egitim-title-1-selaected-01
Eğer formunuzda zorunlu alanlar isteğe bağlı alanlardan fazla ise, isteğe bağlı alanları kullanıcıya göstermek daha pratik olabilir.
optional
Form tasarımında önemli olan, kullanıcının formu kısa zamanda ve kafasında karışıklığa sebep olmayacak şekilde doldurabilmesini sağlamak, hedef odaklı doğru yönlendirmeler yapabilmek ve asıl amacımız olan dönüşümleri arttırmak. Tasarımına doğru bilgi mimarisiyle başlayıp, kullanıcı odaklı etkileşimlerle geliştirip, ihtiyaçlara uygun görsel çözümlemelerle sonuçlandıracağınız formlar, mobil sitenizin arayüzünde zayıf noktalar değil güçlü etkenler olacak.


 Kaynaklar

  • Özkan Özsert

    Teşekkürler

  • Özkan Özsert

    Teşekkürler

Bugün 0 makale daha okuyabilirsin. Sınırsız okumaya devam etmek için
Ücretsiz Kaydol

Bu içerik SHERPA Blog okurlarına özel.

Devamı ve daha fazlası için sadece okur girişi yapman yeterli.

Kullanıcı deneyimi (UX), tasarım ve teknoloji alanında bilgini pekiştir.

Kullanım koşullarını okudum ve kabul ediyorum.
Neden kaydolmalıyım?