Interacciones táctiles para Windows
Windows 8.1 proporciona un resumido conjunto de interacciones táctiles que se usan en todo el sistema. Aplicar este lenguaje táctil de forma coherente hace que la aplicación resulte familiar a los usuarios. Al hacer que la aplicación sea más fácil de aprender y de usar, aumenta la confianza del usuario. Para obtener más información sobre la implementación del lenguaje táctil, consulta Gestos, manipulaciones e interacciones.
.jpg "El usuario interactúa con una tableta mediante la función táctil.")
En este artículo:
- Diseñar principios para la función táctil
- Lenguaje táctil
- Destinos táctiles
- Postura y sujeción
- Temas relacionados
Diseñar principios para la función táctil
Proporcionar respuesta inmediata
Aumenta la confianza del usuario ofreciendo información visual inmediata siempre que se toque la pantalla. Todos los elementos interactivos deben reaccionar cambiando de color, de tamaño o desplazándose. Los elementos que no son interactivos deben mostrar elementos visuales táctiles solo cuando se toque la pantalla.
El contenido sigue al dedo.
Los elementos que un usuario puede mover o arrastrar, por ejemplo, un lienzo o un control deslizante, deben seguir el dedo del usuario mientras se mueven. Los botones y otros elementos que no se mueven deben volver a su estado predeterminado cuando el usuario levanta el dedo o lo desliza fuera del elemento.
Haz que las interacciones sean reversibles.
Si seleccionas un libro, puedes volver a dejarlo donde lo encontraste. Las interacciones táctiles deberían comportarse de forma similar, deberían ser reversibles. Ofrece información visual para indicar qué sucederá cuando el usuario levante el dedo. De esta manera, la aplicación se podrá explorar de forma segura mediante gestos táctiles.
Permite cualquier cantidad de dedos.
Las personas a menudo tocan con más de un dedo y ni siquiera se dan cuenta. Por eso, las interacciones táctiles no deberían ser muy diferentes según el número de dedos que toquen la pantalla. Al igual que en el mundo real, deslizar algo con uno o tres dedos no debería suponer ninguna diferencia.
Lenguaje táctil
Mantener presionado para aprender
Esta interacción táctil hace que se muestre información detallada o elementos visuales didácticos (por ejemplo, información sobre herramientas o un menú contextual) sin una confirmación de una acción. Todo lo que se muestre de esta manera no debe impedir que los usuarios realicen movimientos panorámicos si comienzan a deslizar el dedo.
Importante El gesto de mantener presionado puede usarse para la selección cuando el movimiento panorámico está habilitado tanto en dirección vertical como horizontal.
Pulsar para acción principal
Al pulsar sobre un elemento se invoca la acción principal, por ejemplo, se inicia una aplicación o se ejecuta un comando.
Deslizar para movimiento panorámico
El deslizamiento se utiliza principalmente para interacciones panorámicas, pero también se puede usar para mover (cuando el movimiento panorámico se restringe a una sola dirección), dibujar o escribir. El deslizamiento también puede usarse para dirigirse a elementos pequeños y muy próximos entre sí mediante arrastre (deslizar el dedo sobre los objetos relacionados, por ejemplo, botones de radio).
Deslizar rápidamente para seleccionar, ordenar y mover
Cuando se desliza el dedo una distancia pequeña, perpendicular a la dirección de movimiento panorámico (cuando el movimiento panorámico se restringe a una sola dirección), se selecciona el objeto en una lista o cuadrícula. Muestra la barra de la aplicación con los comandos relevantes cuando se seleccionan objetos.
Zoom con gestos de reducir y ampliar
Aunque los gestos de reducir y ampliar se suelen utilizar para cambiar de tamaño, también permiten ir al principio, al final o a cualquier parte del contenido con zoom semántico. El zoom semántico proporciona una vista alejada para mostrar grupos de elementos y formas rápidas de moverse en ellos.
Voltear para girar
Al girar con uno o más dedos, el objeto gira. Gira el dispositivo propiamente dicho para girar toda la pantalla.
Deslizar rápidamente desde el borde para los comandos de la aplicación
Los comandos de la aplicación aparecen al deslizar rápidamente desde el borde inferior o superior de la pantalla. Usa la barra de la aplicación para mostrar los comandos de la aplicación.
Deslizar rápidamente desde el borde para los comandos del sistema
Al deslizar rápidamente desde el lado derecho de la pantalla, aparecen los accesos que exponen los comandos del sistema.
Al deslizar rápidamente desde la izquierda, se recorren las aplicaciones en ejecución actualmente.
Al deslizar rápidamente desde el borde superior al borde inferior de la pantalla, se cierra la aplicación actual.
Al deslizar rápidamente desde el borde superior hacia abajo y hacia el borde izquierdo o derecho, se ubica la aplicación actual a ese lado de la pantalla.
Nota Los usuarios pueden realizar manipulaciones directas como las interacciones deslizar para arrastrar, reducir para acercar y voltear para girar simultáneamente y con cualquier cantidad de puntos táctiles.
Destinos táctiles
Tamaño frente a eficiencia: el tamaño del objetivo influye en la tasa de errores
.jpg "Gráfico que muestra cómo se reducen los errores táctiles para los objetivos grandes.")
No hay un tamaño perfecto para los objetivos táctiles. Los diferentes tamaños sirven para diferentes situaciones. Las acciones con consecuencias graves (eliminar o cerrar) o las acciones de uso frecuente deben utilizar objetivos táctiles grandes. Las acciones de poco uso con consecuencias leves pueden usar objetivos pequeños.
Directrices sobre tamaños de objetivo
.jpg "Tamaño mínimo recomendado de 7x7") |
7x7 mm: tamaño mínimo recomendado 7x7 mm es un buen tamaño mínimo si el toque de un objetivo equivocado se puede corregir en uno o dos gestos, o en cinco segundos. El espaciado entre los objetivos es tan importante como el tamaño del objetivo. |
.jpg "Tamaño de 9x9 recomendado para precisión") |
Cuando la precisión importa Cerrar, eliminar y otras acciones con consecuencias graves no pueden permitirse pulsaciones accidentales. Usa objetivos de 9x9 si corregir el toque de un objetivo equivocado requiere más de dos gestos, cinco segundos o un cambio de contexto importante. |
.jpg "Tamaño mínimo de 5x5") |
Cuando no cabe Si te ves amontonando las cosas para que quepan, puedes usar objetivos de 5x5 mm siempre que el toque de un objetivo equivocado se pueda corregir con un gesto. En este caso es muy importante usar un espaciado de 2 mm entre los objetivos. |
Accesibilidad
Cuando planees la interfaz de usuario y las interacciones admitidas por la aplicación, ten en cuenta la amplia gama de capacidades, limitaciones y preferencias de los usuarios. Sigue los principios de un diseño accesible desde el comienzo para ofrecer accesibilidad al público más amplio posible. Para obtener más información sobre cómo planear un diseño que ofrezca accesibilidad, consulta Directrices sobre accesibilidad.
Tamaños de dedos
A menudo, las personas se culpan por tener dedos grandes. Pero hasta los dedos de un bebé son más anchos que la mayoría de los objetivos táctiles.
La imagen de la izquierda muestra que el ancho del adulto promedio es aproximadamente 11 mm, mientras que el de un bebé es de 8 mm y el de un jugador de baloncesto es de 19 mm.
.jpg "Gráfico que muestra las variaciones de anchos de dedo")
Postura y sujeción
El diseño táctil es mucho más que diseñar lo que aparece en pantalla. Requiere diseñar en función de cómo se sostenga el dispositivo (sujeción).
Normalmente, los usuarios tienen varias maneras de sostener una tableta.
La tarea actual y cómo se presente suele determinar qué sujeción se usa. Sin embargo, el entorno inmediato y la comodidad física también afectan el tiempo que se usa una sujeción y con cuánta frecuencia se cambia.
Intenta optimizar tu aplicación para diferentes sujeciones. Pero, si una interacción tiende de forma natural a una forma de sostener específica, optimízala para dicha forma.
Áreas de interacción
Dado que las pizarras suelen sostenerse a un lado, las esquinas inferiores y los lados son ubicaciones ideales para los elementos interactivos.
.png "Áreas de interacción")
Áreas de lectura
El contenido situado en la mitad superior de la pantalla es más fácil de ver que el contenido de la mitad inferior, que suele ignorarse o quedar tapado por las manos.
.png "Áreas de lectura")
Sujeciones comunes
| Sujeción | Sujeción e interacción | Consideraciones de diseño |
|---|---|---|
.jpg "Sujetar con una mano e interactuar con la otra") |
Sujeción con una mano con interacción ligera a media con una mano |
|
.jpg "Sujetar con ambas manos e interactuar con los pulgares") |
Sujeción con dos manos con interacción ligera a media con los pulgares |
|
.jpg "Interacción con ambas manos") |
El dispositivo descansa sobre la mesa o sobre las piernas con interacción ligera a media con ambas manos |
|
.jpg "Interacción pasiva sin sujeción") |
El dispositivo descansa sobre la mesa o plataforma con o sin interacción |
|
Temas relacionados
Responder a la interacción del usuario
Versión descargable de interacciones táctiles
Interacción del usuario: entrada táctil... y mucho más
Directrices para la selección del destino (aplicaciones de la Tienda Windows)