Cómo diseñar para los pulgares en la era de las pantallas enormes
DISEÑO PARA LOS PULGARES?
¿Qué significa diseñar para los pulgares ? Significa construir interfaces que son las más cómodas de usar en el arco natural de barrido de nuestro pulgar.
Pero esto se complica. Inconscientemente, ajustamos la forma en que mantenemos nuestros teléfonos para alcanzar ciertos controles en varias áreas de la pantalla. Durante un día cualquiera, apuesto a que estirar su agarre, ahogarse en el teléfono, o el ángulo de manera que hacen que llegar a zonas difíciles más fácil.
Pero tenemos que empezar en alguna parte. Las investigaciones sugieren que la mayoría de nosotros tenemos nuestros teléfonos de la siguiente manera — con la parte inferior del pulgar anclado en la esquina inferior derecha:
Esta suposición viene de un estudio que el experto móvil Steve Hoober condujo con 1.333 personas a principios del año pasado. Descubrió que la gente tenía sus teléfonos de las siguientes maneras:
- Una mano: 49%
- Acunados: 36%
- Dos manos: 15%
Las cifras de Handedness también fueron instructivas:
- Pulgar derecho en la pantalla: 67%
- Pulgar izquierdo en la pantalla: 33%
Hoober señala que las cifras de zurdos en la población son alrededor del 10%. Por lo tanto, la mayor tasa observada de uso de zurdos podría correlacionarse con personas que hacen otras cosas al mismo tiempo: fumar, andar en bicicleta, beber café, comer currywurst, etc.
LA ZONA DEL PULGAR
La zona del pulgar es un mapa del calor de las clases. Es una mejor suposición de lo fácil que es para nuestros pulgares para aprovechar las áreas en la pantalla de un teléfono.
Utilizemos la investigación de Hoober para crear un mapa de zona de pulgares que represente lo que parece ser el caso de uso más común:
- Uso con una sola mano
- Pulgar derecho en la pantalla
- Pulgar anclado en la esquina inferior derecha
Aquí está el mapa de calor de Thumb Zone aplicado a cada tamaño de pantalla de iPhone desde 2007:
Aquí hay una comparación más directa del iPhone 6 y el iPhone 6 Plus uno al lado del otro:
Notará que la zona verde “segura” permanece más o menos igual (más sobre por qué el iPhone 6 Plus es diferente en un segundo). Eso es porque nuestros pulgares no escalan mágicamente con el tamaño de la pantalla. Y eso también es lamentable, porque me encantaba Dhalsim en Street Fighter cuando era niño.
Pero lo que cambia es la gran cantidad de espacio “Ow”, que se convierte en sorprendentemente evidente con el iPhone 6 Plus.
Además, notará cómo cambia la forma de la zona “Natural” para el iPhone 6 Plus. Eso es porque requiere un tipo diferente de agarre debido a su tamaño, usando su dedo meñique como estabilizador. Me sorprendió lo diferente que fue la experiencia.
Una nota: mi pulgar no alcanza completamente a través de la pantalla del teléfono. Tal vez tengas manos más grandes que yo. Así que los términos y condiciones ciertamente se aplican.
AHOGANDO
Analicemos cómo cambian las zonas de pulgar cuando cambia de posición. A veces puede estar en una situación en la que es más fácil tocar el teléfono con el anclaje del pulgar en el punto medio vertical.
He aquí una ilustración de esto en acción para iPhone 6 y iPhone 6 Plus:
Observe cómo el iPhone 6 Plus realmente gana espacio pulgar natural debido a su tamaño de pantalla. En comparación, el iPhone 6 sólo se queda sin bienes raíces.
ACCESIBILIDAD
Sin embargo, el atragantamiento podría no ser necesario, con la función “Alcanzabilidad” de iOS 8. (Eso es si Apple toma la oportunidad de enseñar a la gente acerca de su existencia). Al pulsar dos veces el botón de inicio (no es lo mismo que “hacer clic” para mostrar las aplicaciones en ejecución), iOS empujará la parte superior de la pantalla a su alcance.
Aquí está una demostración de Alcance:
Y así es como Reachability se ve con la Thumb Zone superpuesta en el iPhone 6 Plus. ¿Notar algo?
Sí, las imágenes de demostración de Apple colocan el pulgar en exactamente la zona “Natural”.
Otra observación sobre Reachability, como señaló John Gruber : “La capacidad de alcance en el 6 Plus mueve las cosas más abajo en la pantalla, en porcentaje, que en el 6 — se trata de mover la parte superior de la pantalla a una longitud típica del pulgar Desde la parte inferior del dispositivo. “
Aquí está eso en acción:
¿QUÉ SIGNIFICA TODO ESTO?
Tamaños de pantalla móvil en general son cada vez más similar, y eso es una buena cosa. Pero también significa que no podemos simplemente tratar las pantallas en el rango de 5,5 “simplemente como una versión ampliada de un teléfono más pequeño. Las empuñaduras cambian completamente, y con eso, su interfaz puede ser necesario hacerlo, también.
DESCARGAR LAS PLANTILLAS ACTUALIZADAS DE THUMB ZONE
¿Quieres una copia del diagrama de Thumb Zone que dibujé para estas capturas de pantalla? Estás de suerte. Puede descargarlos como JPG individuales aquí.
Descargar las plantillas de My Thumb Zone ahora
Originalmente escrito para scotthurff.com
