Diseño de interacción tácil (aplicaciones de la Tienda Windows)
En este tema se describen las interacciones táctiles para Windows 8 y se ofrecen directrices para diseñar interacciones táctiles adecuadas. Para obtener una versión descargable de este tema, ve aquí.
Guía táctil
- Usa el lenguaje táctil de Windows 8.
Windows 8 proporciona un escueto conjunto de interacciones táctiles que se usa de forma coherente en todo el sistema. Aplicar este lenguaje 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.
- Usa los dedos para lo que valen.
Un mouse y un lápiz son precisos, pero los dedos no, y los objetivos pequeños requieren precisión. Usa objetivos grandes que permitan la manipulación directa y ofrezcan datos de interacción táctil enriquecidos. Deslizar el dedo rápidamente hacia abajo en un elemento grande es fácil y rápido porque todo el elemento es un objetivo de selección.
- Examina el contenido mediante gestos táctiles.
El zoom semántico y el movimiento panorámico hacen que la navegación sea rápida y fluida. En lugar de colocar contenido en varias pestaña o páginas, usa Canvass amplios que permitan realizar movimientos panorámicos y usar el zoom semántico.
- Proporciona respuesta.
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 Canvas 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.
- No limites el tiempo de las interacciones.
Las interacciones que requieren gestos compuestos, como la doble pulsación o mantener presionado, deben realizarse dentro de un plazo de tiempo determinado. Evita las interacciones con tiempo como estas porque suelen activarse accidentalmente y son difíciles de temporizar correctamente.
Lenguaje táctil de Windows 8
Esta lista describe los términos estándares relacionados con los elementos táctiles que se usan en Windows 8.
Importante Para evitar que los usuarios se confundan, no crees interacciones personalizadas que dupliquen o redefinan las interacciones estándares existentes.
 | 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. |
 | 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, 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 los dedos rápidamente para seleccionar, ordenar y mover | Cuando se desliza el dedo una distancia pequeña, perpendicular a la dirección de panorámica, se selecciona el objeto en una lista o cuadrícula (controles ListView y GridLayout). Muestra la AppBar 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. Un control SemanticZoom 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. Al girar el dispositivo, gira toda la pantalla. |
 | Deslizar los dedos rápidamente desde el borde para los comandos de la aplicación | Los comandos de la aplicación aparecen al deslizar el dedo rápidamente desde el borde inferior o superior de la pantalla. Usa la AppBar para mostrar los comandos de la aplicación. |
 | Deslizar los dedos rápidamente desde el borde para los comandos del sistema |
Al deslizar rápidamente desde el lado derecho de la pantalla, aparecen los botones de acceso 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 acopla 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.
Postura táctil de Windows 8
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: ya que las pizarras suelen sostenerse a un lado, las esquinas inferiores y los lados son ubicaciones ideales para los elementos interactivos.
Á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.
Cuatro sujeciones de uso común: si bien existen muchas formas de sostener una tableta, estas cuatro sujeciones son las más utilizadas.
| Sujeción | Sujeción e interacción | Consideraciones de diseño |
|---|---|---|
 | Sujeción con una mano con interacción ligera a media con una mano |
|
 | Sujeción con dos manos con interacción ligera a media con los pulgares |
|
 | El dispositivo descansa sobre la mesa o sobre las piernas con interacción ligera a media con ambas manos |
|
 | El dispositivo descansa sobre la mesa o plataforma con o sin interacción |
|
Objetivos táctiles de Windows 8
Tamaño frente a eficiencia: el tamaño del objetivo influye en la tasa de errores
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.
¿Dedos grandes?
|
|
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. |
Directrices para el tamaño de objetivo: estas son algunas directrices para decidir el tamaño de tus objetivos táctiles.
 |
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. |
 |
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. |
 |
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. |
La mayoría de las personas son diestras
La mayoría de las personas sostienen una pizarra con la mano izquierda y la tocan con la derecha. En general, los elementos situados en el lado derecho son más fáciles de tocar, y colocarlos en el lado derecho evita obstruir el área principal de la pantalla.
Accesibilidad e interacciones táctiles
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. Seguir los principios de un diseño accesible desde el comienzo ayuda a que la aplicación sea accesible para el público más amplio posible. Para obtener más información sobre cómo planear un diseño que ofrezca accesibilidad, consulta el tema sobre diseño de accesibilidad.
Temas relacionados
