web-gelistirme-sc.com

Dokunmatik ekran için en küçük düğme boyutu ve aralığı

İPhone gibi bir dokunmatik ekran için, uzaklaşabileceğiniz bir düğmenin en küçük boyutu nedir?

Ve birlikte ne kadar yakından itilebilirlerdi?

Bir ekranda çok fazla düğme olacak bir uygulama var ve bunu kullanışlı olarak tasarlamalıyım.

13
Mongus Pong

(Ben biraz tembel olduğum için, cevabım SO bir iş parçacığından yeniden bastırarak başlayacağım

Son bilimsel araştırmalar şunları buldu:

[A] Ayrık görevler için 9,2 mm hedef boyutu [yani, tek hedef işaretleme görevleri ] ve seri görevler için 9,6 mm'lik hedefler, performansı ve tercihi düşürmeden dokunmatik ekranlı el bilgisayarlarında tek elle başparmak kullanımı için yeterince büyük olmalıdır.

Alıntı: Küçük Dokunmatik Ekranlı Cihazlarda Tek Elle Başparmak Kullanımı için Hedef Büyüklük Çalışması (Parhi, Karlson ve Bederson 2006). Diğer kaynaklar bu "0,4 inç'e yakın kural" konusunda hemfikirdir (örn. Gestural Arayüzler Tasarlamak (Saffer 2008, s. 42)).

İPhone'un 163 PPI (6.417 piksel/mm) piksel yoğunluğu göz önüne alındığında, tercihen 59 piksel çaprazdan herhangi bir hedef.

(Bunun yalnızca tek elle başparmak kullanımı için doğrulandığını lütfen unutmayın.)


Bu yönergeleri izlerseniz can aralığı ortadan kaldırılır.

tl; dr? Her şey piksel yoğunluğuna kadar kaynar.

10
jensgram

Apple'ın önerileri için iPhone İnsan Arabirim Yönergeleri (bu bağlantı web uygulamaları yönergelerine gider) konusuna bakın. Kararlarınızı dayandırmak için kullanabileceğiniz " Parmak Ucu Boyutlu Hedefler Sağlayın " adlı bir bölüm var.

Ayrıca, tahmin etme, test et. Farklı boyuttaki parmakları olan bazı kişileri (hedef kitlenizde) bulun ve bir prototipte farklı boyutta düğmelere basmalarını sağlayın. Bu size ne bekleyebileceğiniz hakkında çok şey öğretecek.

Düzenleme: Windows Phone 7 için Microsoft'un Kullanıcı Arabirimi Tasarım ve Etkileşim Kılavuz ayrıntılar "minimum dokunma hedefi boyutları" sayfa 4. Genel olarak bu kılavuzu mükemmeldir ve dokunmatik ekran kullanıcı arayüzünde çalışan UI tasarımcıları için mutlaka okunmalıdır.

8
Rahul

Bazı Android tabanlı mobil uygulamalar geliştirirken, kullanıcının bir parmak/dokunuşla kolayca ve hassas bir şekilde erişebileceği en küçük dokunma alanını test etmek zorunda kaldım (tıklama ve sürükleme eylemleri gerçekleştirin).

Testler 3 Android tabanlı telefonlar: HTC Hero, Samsung Galaxy Spica, T-Mobile Pulse) üzerinde yapıldı. Telefonların Pulse (3.5 inç ekrana sahip) hariç 3.2 inç ekranları vardı, hepsi 320x480 piksel ekran çözünürlüğü ve kapasitif ekran yüzeyi ile.

Uzun lafın kısası, 20x20 pikselden küçük olan her şey kullanılamazdı. Ayrıca düğmenin etrafında boşluk olması gerektiğini de unutmayın (5 piksel kenar boşluğu).

2
Bojan Gavrovski

UX yönergelerinin çoğu parmak ucu boyutu etrafında döner ve bu yönergeler önerilen boyut ve aralıklarda farklılık gösterir. Parmak ucu boyutları, minimum boyut kontrollerinin ve aralığının ne olacağını belirleyen tek faktör olmamalıdır.

İletişim Yaması

Dokunmatik ekranla temas ederken parmak/başparmak tarafından yapılan gerçek 'temas yamasını' düşünün. Ayrıca, kullanıcı tarafından hedefe dokunmalarını görsel olarak merkezlediklerini düşünürken yapılan yargılama hatalarını da dikkate almanız gerekir, ancak aslında ekranla yapılan gerçek temas bir tarafa biraz kapalı olabilir.

Cihaz tipi

Farklı cihazların tutulması ve kullanıcıdan uzaklık farkı (cep telefonunu bir tabletle karşılaştırın, örneğin bir telefon daha yakın tutulabilir) nedeniyle, minimum dokunma boyutları ve aralıkları da değişebilir. Görüntüleyiciye daha yakın tutuldukları ve hata yapma olasılığı daha düşük olduğu için, bir telefonda daha küçük minimumlarla tartışabilirsiniz. Uzakta tutulan bir tablet gibi daha büyük bir cihaz için, daha yüksek hata şansı sağlamak için minimum boyutlarınızı artırmanız gerekebilir.


UXmatters'ta bunun hakkında ve diğer faktörlerden bahseden bir harika makale var ( http://www.uxmatters.com/mt/archives/2013/03/common-misconceptions-about-touch php ).

Makaleden parçacıklar:

... parmağın veya başparmağın yalnızca bir kısmı ekranla temas ediyor ... temas yaması basınç ve açıya göre değişir

Fiziksel boyutlar önemlidir, bu nedenle tüm iyi yönergeler milimetre, inç, tipografların puanları veya diğer gerçek dünya ölçeklerinde bulunur.

görünür hedefin boyutunu artırmanıza gerek yoktur. Bunun yerine, bir bağlantının veya düğmenin etrafında tıklanabilir alanın boyutlarını artırabilirsiniz

Hem görsel hem de dokunmatik hedef alanlar için tasarım. Kullanıcıların beklentilerini göz önünde bulundurun.

Boyutlar:

enter image description here

1
Dave Haigh

Ek olarak: Google malzeme tasarımı, dokunma hedefi boyutu için en az 7-10 mm öneriyor https://www.google.com/design/spec/search.html?q=Touch+target+size

0
Andi