Toque

Todas las aplicaciones de Microsoft Windows deben tener una experiencia táctil excelente. Y crear esta experiencia es más fácil de lo que piensas.

La función táctil hace referencia al uso de uno o varios dedos para proporcionar la entrada a través de una pantalla de dispositivo e interactuar con Windows y las aplicaciones. Una aplicación optimizada para toques tiene un modelo de interfaz de usuario e interacción diseñado para adaptarse a las áreas de contacto más grandes y menos precisas del contacto, los diversos factores de forma de los dispositivos táctiles y las numerosas posturas y agarres que los usuarios pueden adoptar al usar un dispositivo táctil.

táctil

Cada dispositivo de entrada tiene sus puntos fuertes. El teclado es mejor para la entrada de texto y proporcionar comandos con un movimiento de mano mínimo. El mouse es mejor para apuntar eficiente y preciso. La función táctil es mejor para la manipulación de objetos y proporcionar comandos simples. Un lápiz es mejor para la expresión de forma libre, como con la escritura a mano y el dibujo.

Windows 8.1 está optimizado para la capacidad de respuesta, la precisión y la facilidad de uso con la función táctil, al tiempo que admite métodos de entrada tradicionales (como el mouse, el lápiz y el teclado). La velocidad, la precisión y los comentarios táctiles que proporcionan los modos de entrada tradicionales son familiares y atractivos para muchos usuarios y potencialmente más adecuados para escenarios de interacción específicos.

Puede encontrar instrucciones relacionadas con el mouse, el lápiz y la accesibilidad en temas independientes.

Cuando piense en la experiencia de interacción de la aplicación:

No suponga que si una interfaz de usuario funciona bien para un mouse, también funciona bien para la entrada táctil. Aunque la buena compatibilidad con el mouse es un inicio, una buena experiencia táctil tiene algunos requisitos adicionales.

Supongamos que si una interfaz de usuario funciona bien para un dedo, también funciona bien para un lápiz. Hacer que la aplicación sea táctil es un largo camino para proporcionar una buena compatibilidad con el lápiz. La principal diferencia es que los dedos tienen una punta más directa, por lo que necesitan objetivos más grandes.

Con la función táctil, puede manipular objetos y la interfaz de usuario directamente, lo que hace que sea una experiencia más rápida, más natural y atractiva.

Proporcionar una excelente experiencia táctil

Debe asegurarse de que los usuarios pueden realizar tareas críticas e importantes de forma eficaz mediante la entrada táctil. Sin embargo, es posible que la funcionalidad específica de la aplicación, como la manipulación de texto o píxeles, no sea adecuada para la entrada táctil y se pueda reservar para el dispositivo de entrada más adecuado.

Si no tiene mucha experiencia en el desarrollo de aplicaciones táctiles, es mejor aprender haciendo. Obtenga un equipo con entrada táctil, alegue el mouse y el teclado, y use solo los dedos para interactuar con la aplicación. Si tienes una tableta, experimenta con mantenerla en diferentes posiciones, como en tu vuelta, lying flat on a table, or in your arms while you're standing. Pruebe a usarlo en orientación vertical y horizontal.

Las aplicaciones optimizadas para toques que funcionan mejor con la interacción táctil suelen ser:

• Natural e intuitivo. Las interacciones están diseñadas para corresponder a cómo interactúan los usuarios con objetos en el mundo real.
• Menos intrusivo. El uso de la función táctil es silencioso y, en consecuencia, es mucho menos distraído que escribir o hacer clic.
• Portátil. Los dispositivos táctiles son más compactos porque muchas tareas se pueden completar sin teclado, mouse, lápiz o panel táctil. También son más flexibles porque no se requiere una superficie de trabajo.
• Directo y atractivo. La función táctil te hace sentir que estás manipulando directamente objetos en la pantalla.
• Menos precisa. Los usuarios no pueden dirigirse a objetos con precisión con la función táctil, en comparación con un mouse o un lápiz.

Touch proporciona una sensación natural y real de interacción. La manipulación directa y la animación completan esta impresión, dando a los objetos un movimiento realista, dinámico y comentarios. Por ejemplo, considere un juego de cartas. No solo es conveniente y fácil arrastrar cartas usando un dedo, la experiencia toma una sensación atractiva del mundo real cuando se puede deslizar, deslizar y girar las cartas como lo haría con una baraja física. Y cuando intenta mover una tarjeta que no se puede mover, es una mejor experiencia tener la resistencia de la tarjeta pero no evitar el movimiento y volver a establecerse en su lugar cuando se libera, para indicar claramente que la acción se reconoció pero no se puede hacer.

Afortunadamente, si la aplicación ya está bien diseñada, proporcionar una excelente experiencia táctil es fácil de hacer. Para este propósito, un programa bien diseñado:

• Garantiza que las tareas más importantes se pueden realizar de forma eficaz mediante un de dedo (al menos las tareas que no implican una gran cantidad de escritura o manipulación detallada de píxeles).
• Usa controles grandes para la entrada táctil. Los controles comunes tienen un tamaño mínimo de 23 x 23 píxeles (13 x 13 DTU) y los controles más usados son al menos 40 x 40 píxeles (23 x 22 DTU). Para evitar un comportamiento no responde, los elementos de la interfaz de usuario deben tener al menos 5 píxeles (3 DTU) de espacio entre ellos. Para otros controles, asegúrese de que tienen al menos un destino de clic de 23 x 23 píxeles (13x13 DLU), incluso si su apariencia estática es mucho menor. Consulte ajuste de tamaño del control estándar.
• Admite la entrada del mouse. Los controles interactivos tienen prestaciones claras y visibles. Los objetos tienen comportamientos estándar para las interacciones estándar del mouse (solo y doble clic izquierdo, clic derecho, arrastrar y mantener el puntero).
• Admite la entrada del teclado. La aplicación proporciona asignaciones de teclas de método abreviado estándar, especialmente para comandos de navegación y edición que también se pueden generar a través de gestos táctiles.
• Garantiza la accesibilidad. Usa automatización de la interfaz de usuario o accesibilidad activa de Microsoft (MSAA) para proporcionar acceso mediante programación a la interfaz de usuario para las tecnologías de asistencia. La aplicación responde adecuadamente a los cambios de orientación, tema, configuración regional y métrica del sistema.
• Elimina interacciones innecesarias. Para evitar la pérdida de datos o acceso al sistema, use los valores predeterminados más seguros y seguros. Si la seguridad y la seguridad no son factores, la aplicación selecciona la opción más probable o conveniente.
• Proporciona un equivalente táctil para mantener el puntero. No se base en el puntero como la única manera de realizar una acción.
• Garantiza que los gestos surtan efecto inmediatamente. Mantenga los puntos de contacto debajo de los dedos del usuario sin problemas a lo largo del gesto, lo que proporciona el efecto de la asignación de gestos directamente al movimiento del usuario.
• Usa gestos estándar siempre que sea posible. Gestos personalizados solo para interacciones exclusivas de la aplicación.
• Garantiza que los comandos no deseados o destructivos se pueden invertir o corregir. Es más probable que las acciones accidentales usen la función táctil.

Directrices para la entrada táctil

Con la función táctil, la aplicación de Windows puede usar gestos físicos para emular la manipulación directa de los elementos de la interfaz de usuario.

Tenga en cuenta estos procedimientos recomendados al diseñar la aplicación habilitada para tocar:

La capacidad de respuesta es esencial para crear experiencias táctiles que se sienten directas y atractivas. Para sentir directamente, los gestos deben surtir efecto inmediatamente y los puntos de contacto de un objeto deben permanecer debajo de los dedos del usuario suavemente a lo largo del gesto. El efecto de la entrada táctil debe asignarse directamente al movimiento del usuario, por lo que, por ejemplo, si el usuario gira los dedos 90 grados, el objeto también debe girar 90 grados. Cualquier retraso, respuesta corta, pérdida de contacto o resultados inexactos destruye la percepción de manipulación directa y también de calidad.

La coherencia es esencial para crear experiencias táctiles que se sienten naturales e intuitivas. Una vez que los usuarios aprenden un gesto estándar, esperan que ese gesto tenga el mismo efecto en todas las aplicaciones. Para evitar confusiones y frustraciones, nunca asigne significados no estándar a gestos estándar. En su lugar, use gestos personalizados para interacciones exclusivas del programa.

A continuación describiremos el lenguaje táctil de Windows, pero antes de continuar, esta es una breve lista de términos básicos de entrada táctil.

• gesto de

  Un gesto es el acto físico o movimiento realizado en o por el dispositivo de entrada (dedo, dedos, lápiz/lápiz, mouse, etc.). Por ejemplo, para iniciar, activar o invocar un comando, se usa un solo toque de dedo para un dispositivo táctil o táctil (equivalente a un clic izquierdo con un mouse, una pulsación con un lápiz o Entrar en un teclado).

• de manipulación

  Una manipulación es la reacción inmediata, en tiempo real o respuesta que tiene un objeto o interfaz de usuario para un gesto. Por ejemplo, los gestos de deslizar y deslizar el dedo normalmente hacen que un elemento o la interfaz de usuario se muevan de alguna manera.

  El resultado final de una manipulación, cómo se manifiesta por el objeto en la pantalla y en la interfaz de usuario, es la interacción.

• de interacción de

  Las interacciones dependen de cómo se interpreta una manipulación y el comando o la acción resultantes de la manipulación. Por ejemplo, los objetos se pueden mover mediante los gestos de deslizar y deslizar el dedo, pero los resultados difieren en función de si se cruza un umbral de distancia. La diapositiva se puede usar para arrastrar un objeto o desplazar una vista mientras se puede usar el dedo para seleccionar un elemento o mostrar una barra de aplicaciones.

Idioma táctil de Windows

Windows proporciona un conjunto conciso de interacciones táctiles que se usan en todo el sistema. Aplicar este lenguaje táctil de forma coherente hace que la aplicación se sienta familiar con lo que los usuarios ya conocen. Esto aumenta la confianza del usuario haciendo que la aplicación sea más fácil de aprender y usar. Para obtener más información sobre la implementación del lenguaje táctil, consulte Gestos, manipulaciones e interacciones.

Mantenga presionado para aprender

El gesto de presionar y mantener presionada muestra información detallada o objetos visuales de enseñanza (por ejemplo, una información sobre herramientas o un menú contextual) sin confirmar una acción o un comando. El movimiento panorámico sigue siendo posible si se inicia un gesto deslizante mientras se muestra el objeto visual.

Estado de entrada: uno o dos dedos en contacto con la pantalla.

Movimiento: Sin movimiento.

Estado de salida: el último dedo hacia arriba termina el gesto.

Efecto: muestra más información.

Gesto de presionar y mantener presionado.

mantener el puntero

El puntero es una interacción útil porque permite a los usuarios obtener información adicional a través de sugerencias antes de iniciar una acción. Ver estas sugerencias hace que los usuarios se sientan más seguros y reducen los errores.

Desafortunadamente, el puntero no es compatible con las tecnologías táctiles, por lo que los usuarios no pueden mantener el puntero al usar un dedo. La solución sencilla a este problema es aprovechar al máximo el puntero, pero solo de maneras que no son necesarias para realizar una acción. En la práctica, esto suele significar que la acción también se puede realizar haciendo clic, pero no necesariamente de la misma manera.

En este ejemplo, los usuarios pueden ver la fecha de hoy al mantener el puntero o hacer clic.

Pulsar para la acción principal

Al pulsar en un elemento se invoca su acción principal, por ejemplo, al iniciar una aplicación o ejecutar un comando.

Estado de entrada: un dedo en contacto con la pantalla o el panel táctil y se levanta antes del umbral de tiempo para una interacción de presión y suspensión.

Movimiento: Sin movimiento.

Estado de salida: el dedo hacia arriba termina el gesto.

Efecto: inicie una aplicación o ejecute un comando.

Gesto de pulsación.

diapositiva para desplazarse hacia

La diapositiva se usa principalmente para las interacciones de movimiento panorámico, pero también se puede usar para mover (donde el movimiento panorámico está restringido a una dirección), dibujar o escribir. La diapositiva también se puede usar para dirigirse a elementos pequeños y densamente empaquetados limpiando (deslizando el dedo sobre objetos relacionados, como botones de radio).

Estado de entrada: uno o dos dedos en contacto con la pantalla.

Movimiento: arrastre, con los dedos adicionales restantes en la misma posición en relación entre sí.

Estado de salida: el último dedo hacia arriba termina el gesto.

Efecto: mueva el objeto subyacente directamente e inmediatamente a medida que se mueven los dedos. Asegúrese de mantener el punto de contacto debajo del dedo a lo largo del gesto.

Gesto panorámico.

deslizar el dedo para seleccionar, comando y mover

Deslizar el dedo una corta distancia, perpendicular a la dirección de movimiento panorámico (donde el movimiento panorámico está restringido a una dirección), selecciona los objetos de una lista o cuadrícula. Muestra la barra de aplicaciones con comandos pertinentes cuando se seleccionan objetos.

Estado de entrada: uno o varios dedos tocan la pantalla.

Movimiento: arrastre una corta distancia y levante antes de que se produzca el umbral de distancia para una interacción de movimiento.

Estado de salida: el último dedo hacia arriba termina el gesto.

Efecto: se selecciona o se mueve el objeto subyacente o se muestra la barra de la aplicación. Asegúrese de mantener el punto de contacto debajo del dedo a lo largo del gesto.

Gesto de deslizar el dedo.

reducir y estirar para acercar

Los gestos de reducir y estirar se usan para tres tipos de interacciones: zoom óptico, cambio de tamaño y zoom semántico.

El zoom óptico ajusta el nivel de ampliación de todo el área de contenido para obtener una vista más detallada del contenido. En cambio, el cambio de tamaño es una técnica para ajustar el tamaño relativo de uno o varios objetos dentro de un área de contenido sin cambiar la vista en el área de contenido.

El zoom semántico es una técnica optimizada para tocar para presentar y navegar por datos estructurados o contenido dentro de una sola vista (como la estructura de carpetas de un equipo, una biblioteca de documentos o un álbum de fotos) sin necesidad de controles de movimiento panorámico, desplazamiento o vista de árbol. El zoom semántico proporciona dos vistas diferentes del mismo contenido al permitirle ver más detalles al acercar y menos detalles al alejar.

Estado de entrada: dos dedos en contacto con la pantalla al mismo tiempo.

Movimiento: los dedos se separan (estiran) o se unen (pellizco) a lo largo de un eje.

Estado de salida: cualquier dedo hacia arriba termina el gesto.

Efecto: acercar o alejar el objeto subyacente directamente e inmediatamente como los dedos se separan o se aproximan en el eje. Asegúrese de mantener los puntos de contacto debajo del dedo a lo largo del gesto.

Gesto de zoom.

Girar para girar

La rotación con dos o más dedos hace que un objeto gire. Gire el propio dispositivo para girar toda la pantalla.

Estado de entrada: dos dedos en contacto con la pantalla al mismo tiempo.

Movimiento: uno o ambos dedos giran alrededor del otro, moviendo perpendicular a la línea entre ellos.

Estado de salida: cualquier dedo hacia arriba termina el gesto.

Efecto: gire el objeto subyacente la misma cantidad que los dedos han girado. Asegúrese de mantener los puntos de contacto debajo del dedo a lo largo del gesto.

Gesto de rotación.

La rotación solo tiene sentido para determinados tipos de objetos, por lo que no se asigna a una interacción de Windows del sistema.

La rotación se realiza a menudo de forma diferente por diferentes personas. Algunas personas prefieren girar un dedo alrededor de un dedo dinámico, mientras que otras prefieren girar ambos dedos en un movimiento circular. La mayoría de las personas usan una combinación de los dos, con un dedo que se mueve más que el otro. Aunque la rotación suave a cualquier ángulo es la mejor interacción, en muchos contextos, como la visualización de fotos, es mejor establecerse en la rotación de 90 grados más cercana una vez que el usuario deje ir. En la edición de fotos, puede usar un pequeño giro para enderezar la foto.

deslizar el dedo desde el borde para los comandos de la aplicación

Deslizar el dedo una corta distancia desde el borde inferior o superior de la pantalla revela los comandos de la aplicación en una barra de aplicaciones.

Estado de entrada: uno o varios dedos tocan el bisel.

Movimiento: arrastre una corta distancia a la pantalla y levante.

Estado de salida: el último dedo hacia arriba termina el gesto.

Efecto: se muestra la barra de la aplicación.

Deslizar el dedo desde el gesto de borde.

Desarrolladores: para obtener más información, consulta DIRECTMANIPULATION_CONFIGURATION enumeración.

Control del uso

Aquí se proporcionan algunas directrices para optimizar los controles para el uso táctil.

• Usar controles comunes. Los controles más comunes están diseñados para admitir una buena experiencia táctil.
• Elija controles personalizados diseñados para admitir la entrada táctil. Es posible que necesite controles personalizados para admitir las experiencias especiales del programa. Elija controles personalizados que:
  • Puede tener un tamaño lo suficientemente grande como para facilitar el destino y la manipulación.
  • Cuando se manipulan, mueven y reaccionan de la forma en que los objetos del mundo real se mueven y reaccionan, como el impulso y la fricción.
  • Perdonan al permitir que los usuarios corrijan fácilmente los errores.
  • Perdonan la inexactitud al hacer clic y arrastrar. Los objetos que se quitan cerca de su destino deben caer en el lugar correcto.
  • Tenga comentarios visuales claros cuando el dedo esté sobre el control.
• Use controles restringidos. Los controles restringidos, como listas y controles deslizantes, cuando están diseñados para facilitar el destino táctil, pueden ser mejores que los controles sin restricciones, como los cuadros de texto, ya que reducen la necesidad de entrada de texto.
• Proporcione los valores predeterminados adecuados. Seleccione la opción más segura (para evitar la pérdida de datos o acceso al sistema) y la opción más segura de forma predeterminada. Si la seguridad y la seguridad no son factores, seleccione la opción más probable o conveniente, lo que elimina la interacción innecesaria.
• Proporcione la finalización automática del texto. Proporciona una lista de valores más probables, o valores de entrada más recientes, para facilitar mucho la entrada de texto.
• Para tareas importantes que usan variasde selección, si se usa normalmente una lista de selección múltiple estándar, proporcione una opción para usar una lista de casillas en su lugar.

Tamaños de control y destinatarios táctiles

Debido al área expuesta grande del dedo, los controles pequeños que están demasiado cerca pueden ser difíciles de apuntar precisamente.

Como regla general, un tamaño de control de 23 x 23 píxeles (13 x 13 DTU) es un buen tamaño de control interactivo mínimo para cualquier dispositivo de entrada. Por el contrario, los controles de giro a 15 x 11 píxeles son demasiado pequeños para usarse eficazmente con la entrada táctil.

Tenga en cuenta que el tamaño mínimo se basa realmente en el área física, no en métricas de diseño como píxeles o DTU. La investigación indica que el área de destino mínima para una interacción eficaz y precisa con un dedo es de 6 x 6 milímetros (mm). Este área se traduce en métricas de diseño como esta:

Además, la investigación muestra que un tamaño mínimo de 10x10 mm (unos 40 x 40 píxeles) permite mejorar la velocidad y la precisión, y también se siente más cómodo para los usuarios. Cuando sea práctico, use este tamaño mayor para los botones de comando usados para los comandos más importantes o usados con frecuencia.

El objetivo no es tener controles gigantes, solo los que se usan fácilmente con el toque.

En este ejemplo, Microsoft Word usa botones de más de 10 x 10 mm para los comandos más importantes.

Esta versión de Calculator usa botones de más de 10x10 mm para sus comandos más usados.

No hay un tamaño perfecto para los destinos táctiles. Los diferentes tamaños funcionan en diferentes situaciones. Las acciones con consecuencias graves (como eliminar y cerrar) o las acciones usadas con frecuencia deben usar destinos táctiles grandes. Las acciones usadas con poca frecuencia con consecuencias menores pueden usar destinos pequeños.

Directrices de tamaño de destino para controles personalizados

Guía de tamaño	Descripción
	7x7 mm: tamaño mínimo recomendado 7x7 mm es un buen tamaño mínimo si se puede corregir el destino incorrecto en uno o dos gestos o en un plazo de cinco segundos. El relleno entre destinos es tan importante como tamaño de destino.
de precisión	Cuando la precisión importa Cerrar, eliminar y otras acciones con consecuencias graves no pueden permitirse pulsaciones accidentales. Use destinos de 9x9 mm si tocar el destino incorrecto requiere más de dos gestos, cinco segundos o un cambio de contexto importante para corregirlo.
	Cuando simplemente no cabe Si te encuentras con las cosas que caben, está bien usar objetivos de 5x5 mm siempre y cuando se pueda corregir el objetivo incorrecto con un gesto. El uso de 2 mm de relleno entre destinos es sumamente importante en este caso.

Directrices de tamaño de destino para controles comunes

• Para los controles comunes, use los tamaños de control recomendados. El tamaño del control recomendado satisface el tamaño mínimo de 23 x 23 píxeles (13x13 DLU), excepto las casillas de verificación y los botones de radio (su ancho de texto compensa un poco), los controles de número (que no se pueden usar con la entrada táctil, pero son redundantes) y los divisores.

  

  Los tamaños de control recomendados son fácilmente táctiles.

• Para los botones de comando usados para los comandos más importantes o usados con frecuencia, use un tamaño mínimo de 40 x 40 píxeles (23 x 22 DTU) siempre que sea práctico. Al hacerlo, se obtiene una mejor velocidad y precisión, y también se siente más cómodo para los usuarios.

  

  Siempre que sea práctico, use botones de comando más grandes para comandos importantes o usados con frecuencia.

• Para otros controles:

  • Use destinos de clic más grandes. Para controles pequeños, haga que el tamaño de destino sea mayor que el elemento de interfaz de usuario visible estáticamente. Por ejemplo, los botones de icono de 16 x 16 píxeles pueden tener botones de destino de clic de 23 x 23 píxeles, y los elementos de texto pueden tener rectángulos de selección de 8 píxeles más anchos que el texto y 23 píxeles de alto.

    Correcto:

    

    Incorrecto:

    

    Correcto:

    

    En los ejemplos correctos, los destinos de clic son mayores que los elementos de la interfaz de usuario visibles estáticamente.

  • Use destinos de clic redundantes. Es aceptable que los destinos de clic sean menores que el tamaño mínimo si ese control tiene funcionalidad redundante.

    Por ejemplo, los triángulos de divulgación progresiva utilizados por el control de vista de árbol son solo 6x9 píxeles, pero su funcionalidad es redundante con sus etiquetas de elementos asociadas.

    

    Los triángulos de vista de árbol son demasiado pequeños para ser fácilmente táctiles, pero son redundantes en la funcionalidad con sus etiquetas asociadas más grandes.

    Respetar las métricas del sistema. No codifique los tamaños de forma dura. Si es necesario, los usuarios pueden cambiar las métricas del sistema o ppp para adaptarse a sus necesidades. Sin embargo, trate esto como último recurso porque los usuarios normalmente no deben tener que ajustar la configuración del sistema para que la interfaz de usuario se pueda usar.

    

    En este ejemplo, se cambió la métrica del sistema para el alto del menú.

Edición de texto

Editar texto es una de las interacciones más difíciles al usar un dedo. El uso de controles restringidos, los valores predeterminados adecuados y la finalización automática eliminan o reducen la necesidad de escribir texto. Pero si la aplicación implica editar texto, puedes hacer que los usuarios sean más productivos al acercar automáticamente la interfaz de usuario de entrada hasta el 150 por ciento de forma predeterminada cuando se usa la función táctil.

Por ejemplo, un programa de correo electrónico podría mostrar la interfaz de usuario con un tamaño táctil normal, pero acercar la interfaz de usuario de entrada al 150 por ciento para redactar mensajes.

En este ejemplo, la interfaz de usuario de entrada se acerca al 150 %.

Diseño de control y espaciado

El espaciado entre los controles es un factor importante para hacer que los controles se puedan tocar fácilmente. La selección de destino es más rápida pero menos precisa cuando se usa un dedo como dispositivo que apunta, lo que da lugar a que los usuarios se toten con más frecuencia fuera de su destino previsto. Cuando los controles interactivos se colocan muy cerca, pero no se tocan realmente, los usuarios pueden hacer clic en el espacio inactivo entre los controles. Dado que hacer clic en el espacio inactivo no tiene ningún resultado o comentarios visuales, los usuarios a menudo no están seguros de lo que salió mal.

Ajuste dinámicamente el espaciado en función del dispositivo de entrada usado. Esto es especialmente útil con la interfaz de usuario transitoria, como menús y controles flotantes.

Proporcione un mínimo de 5 píxeles (3 DTU) de espacio entre las regiones de destino de los controles interactivos. Si los controles pequeños están demasiado espaciados, el usuario debe pulsar con precisión para evitar pulsar el objeto incorrecto.

Hacer que los controles dentro de grupos sean más fáciles de diferenciar usando más que el espaciado vertical recomendado entre controles. Por ejemplo, los botones de radio con un alto de 19 píxeles son más cortos que el tamaño mínimo recomendado de 23 píxeles. Cuando tenga espacio vertical disponible, puede lograr aproximadamente el mismo efecto que el ajuste de tamaño recomendado agregando un espacio adicional de 4 píxeles al estándar de 7 píxeles.

Correcto:

Mejor:

En el mejor ejemplo, el espaciado adicional entre los botones de radio hace que sean más fáciles de diferenciar.

Puede haber situaciones en las que el espaciado adicional sería deseable al usar la función táctil, pero no al usar el mouse o el teclado. En tales casos, solo usa un diseño más amplio cuando se inicia una acción mediante la función táctil.

Elija un diseño que coloque los controles cerca de dónde se van a usar con mayor probabilidad. Mantenga las interacciones de tareas dentro de un área pequeña siempre que sea posible y localice los controles cerca de dónde se van a usar con mayor probabilidad. Evite los movimientos de mano de larga distancia, especialmente para tareas comunes y para arrastres.

Tenga en cuenta que la ubicación del puntero actual es la más cercana que puede ser un destino, lo que hace que sea trivial adquirirlo. Por lo tanto, los menús contextuales aprovechan al máximo la ley de Fitts, al igual que las mini-barras de herramientas usadas por Microsoft Office.

Evite colocar controles pequeños cerca del borde de la aplicación o la pantalla. Los objetivos pequeños cerca de los bordes pueden ser difíciles de tocar (los biseles de pantalla pueden interferir con los gestos de borde). Para asegurarse de que los controles son fáciles de establecer como destino cuando se maximiza una ventana, puede convertirlos al menos en 23 x 23 píxeles (13 x 13 DTU) o colocarlos fuera del borde de la ventana.

Use el espaciado recomendado. El espaciado recomendado es táctil. Sin embargo, si la aplicación puede beneficiarse del ajuste de tamaño y el espaciado más grandes, tenga en cuenta el ajuste de tamaño y el espaciado recomendados para ser mínimos cuando sea necesario.

Proporcione al menos 5 píxeles (3 DTU) de espacio entre controles interactivos. Al hacerlo, se evita la confusión cuando los usuarios pulsan fuera de su destino previsto.

Considere la posibilidad de agregar más que el espaciado vertical recomendado dentro de grupos de controles, como vínculos de comandos, casillas de verificación y botones de radio, así como entre los grupos. Hacerlo hace que sean más fáciles de diferenciar.

Considere la posibilidad de agregar más que el espaciado vertical recomendado dinámicamente cuando se inicia una acción mediante la función táctil. Al hacerlo, los objetos son más fáciles de diferenciar, pero sin tener más espacio cuando se usa un teclado o un mouse. Aumente el espaciado en un tercio de su tamaño normal o al menos 8 píxeles.

de imagen

En este ejemplo, las listas de accesos directos de la barra de tareas de Windows 7 son más amplias cuando se muestran con la función táctil.

Interacción

El uso de los controles correctos solo te permite formar parte de la forma de una aplicación optimizada para tocar, también debes tener en cuenta el modelo de interacción general que admiten esos controles. Estas son algunas directrices para ayudarle con esto.

• Haga que el puntero sea redundante. La mayoría de las tecnologías táctiles no admiten el mouse, por lo que los usuarios con estas pantallas táctiles no pueden realizar ninguna tarea que requiera mantener el puntero.

• Para las aplicaciones que necesitan entrada de texto, integre completamente la característica de teclado táctil por:

  • Proporcionar los valores predeterminados adecuados para la entrada del usuario.
  • Proporcionar sugerencias de autocompletar cuando corresponda.

  Nota

  Desarrolladores: para obtener más información sobre cómo integrar el teclado táctil, consulta ITextInputPanel.

• Permitir a los usuarios ampliar la interfaz de usuario de contenido si el programa tiene tareas que requieren editar texto. Considere la posibilidad de acercar automáticamente al 150 % cuando se usa la función táctil.

• Proporcionar movimiento panorámico suave, dinámico y zoom siempre que sea necesario. Vuelva a dibujar rápidamente después de un movimiento panorámico o zoom para mantener la capacidad de respuesta. Esto es necesario para hacer que la manipulación directa se sienta verdaderamente directa.

• Durante un movimiento panorámico o zoom, asegúrese de que los puntos de contacto permanecen debajo del dedo a lo largo del gesto. De lo contrario, el movimiento panorámico o zoom es difícil de controlar.

• Dado que los gestos se memorizan, asígneles significados coherentes entre aplicaciones. No proporcione significados diferentes a los gestos con semántica fija. En su lugar, use un gesto adecuado específico de la aplicación.

Perdón

La manipulación directa hace que el tacto sea natural, expresivo, eficiente y atractivo. Sin embargo, cuando hay manipulación directa, puede haber manipulación accidental y, por tanto, la necesidad de perdón.

El perdón es la capacidad de invertir o corregir fácilmente una acción no deseada. Se hace una experiencia táctil perdonando proporcionando deshacer, dando buenos comentarios visuales, teniendo una separación física clara entre los comandos usados con frecuencia y los comandos destructivos, y permitiendo a los usuarios corregir errores fácilmente. Asociado con el perdón impide que se produzcan acciones no deseadas en primer lugar, lo que puede hacer mediante controles restringidos y confirmaciones para acciones o comandos de riesgo que tienen consecuencias no deseadas.

• Proporcione un comando Deshacer. Es mejor proporcionar una manera sencilla de deshacer todos los comandos, pero es posible que la aplicación tenga algunos comandos cuyo efecto no se pueda deshacer.

• Siempre que sea práctico, proporcione buenos comentarios sobre el dedo hacia abajo, pero no realice acciones hasta que el dedo hacia arriba. Al hacerlo, los usuarios pueden corregir errores antes de cometerlos.

• Siempre que sea práctico, permita a los usuarios corregir los errores fácilmente. Si una acción surte efecto en el dedo hacia arriba, permita a los usuarios corregir los errores deslizando mientras el dedo sigue abajo.

• Siempre que sea práctico, indique que no se puede realizar una manipulación directa al resistir el movimiento. Permitir que se produzca el movimiento, pero hacer que el objeto vuelva a establecerse cuando se libere para indicar claramente que se reconoció la acción, pero no se puede realizar.

• Tener una separación física clara entre los comandos usados con frecuencia y los comandos destructivos. De lo contrario, los usuarios podrían tocar comandos destructivos accidentalmente. Un comando se considera destructivo si su efecto está generalizado y no se puede deshacer fácilmente o el efecto no es inmediatamente perceptible.

• Confirme comandos para acciones o comandos de riesgo que tengan consecuencias no deseadas. Use un cuadro de diálogo de confirmación para este propósito.

• Considere la posibilidad de confirmar cualquier otra acción que los usuarios tienden a realizar accidentalmente al usar la función táctil y que pasan desapercibidas o son difíciles de deshacer. Normalmente, se denominan confirmaciones rutinarias y se desaconsejan en función de la suposición de que los usuarios no suelen emitir dichos comandos por accidente con un mouse o teclado. Para evitar confirmaciones innecesarias, presente estas confirmaciones solo si el comando se inició mediante touch.

  Las confirmaciones rutinarias son aceptables para las interacciones que los usuarios a menudo usan accidentalmente la función táctil.

  Desarrolladores: puede distinguir entre eventos de mouse y eventos táctiles mediante la API de INPUT_MESSAGE_SOURCE.