Compartir a través de


Interacción

Nota

Esta guía de diseño se creó para Windows 7 y no se ha actualizado para las versiones más recientes de Windows. Gran parte de las instrucciones todavía se aplican en principio, pero la presentación y los ejemplos no reflejan nuestra guía de diseño actual.

La interacción es la variedad de formas en que los usuarios interactúan con la aplicación, como la entrada táctil, el teclado, el mouse, etc. Use estas directrices para crear experiencias intuitivas y distintivas optimizadas para la función táctil, pero que funcionan de forma coherente en los dispositivos de entrada.

Diseño para una experiencia táctil

Ante todo, diseña tu aplicación teniendo en mente que el principal método de entrada de los usuarios será táctil. Si usas los controles de plataforma, la compatibilidad con el panel táctil, el mouse y el lápiz/lápiz no requieren programación adicional, ya que Windows lo proporciona de forma gratuita.

Pero ten presente que una interfaz de usuario optimizada para entrada táctil no es siempre mejor que una interfaz de usuario tradicional. Ambos proporcionan ventajas y desventajas exclusivas de la tecnología y la aplicación. En el movimiento a una interfaz de usuario táctil, es importante comprender las diferencias principales entre la entrada táctil (incluido el panel táctil), el lápiz y el lápiz, el mouse y la entrada del teclado. No tome las propiedades y comportamientos conocidos del dispositivo de entrada, ya que la función táctil en Windows 8 hace más que simplemente emular esa funcionalidad.

Como pronto descubrirás, la entrada táctil requiere un enfoque diferente para el diseño de la interfaz de usuario.

Compara los requisitos de la interacción táctil

En esta tabla se muestran algunas de las diferencias entre los dispositivos de entrada que debes tener en cuenta al diseñar aplicaciones de la Tienda Windows optimizadas para táctiles.

Factor Interacciones táctiles Interacciones con mouse, teclado, pluma/lápiz Panel táctil
Precisión
El área de contacto de la punta de un dedo es mayor que la de una sola coordenada x-y, lo que aumenta las probabilidades de activación no intencional de comandos.
El mouse y la pluma/lápiz suministran una coordenada x-y precisa.
Es igual al mouse.
La forma del área de contacto cambia durante el movimiento.
Los movimientos de mouse y los trazos de la pluma/lápiz suministran coordenadas x-y precisas. El foco del teclado es explícito.
Es igual al mouse.
No hay cursor de mouse para ayudar con la selección del destino.
El cursor del mouse, el cursor de la pluma/lápiz y el foco del teclado ayudan a seleccionar el destino.
Es igual al mouse.
Anatomía humana
Los movimientos de los dedos no son precisos, ya que es difícil realizar un movimiento en línea recta con uno o más dedos. Esto se debe a la curvatura de las articulaciones de la mano y a la cantidad de articulaciones involucradas en el movimiento.
Es más fácil ejecutar un movimiento en línea recta con mouse o pluma/lápiz porque la mano que los controla recorre una distancia física menor que el cursor en la pantalla.
Es igual al mouse.
Puede ser difícil llegar a algunas áreas de la superficie táctil de un dispositivo de pantalla debido a la posición de los dedos y la sujeción del dispositivo por parte del usuario.
El mouse y la pluma o el lápiz pueden llegar a cualquier parte de la pantalla. El teclado permite acceder a cualquier control con el orden de tabulación.
La posición de los dedos y la empuñadura pueden ser un problema.
Puede ocurrir que los objetos queden ocultos por la punta de uno o más dedos o la mano del usuario. Esto se conoce como oclusión.
Los dispositivos de entrada indirecta no provocan oclusión.
Es igual al mouse.
Estado de objeto
La interacción táctil emplea un modelo de dos estados: la superficie táctil de un dispositivo de pantalla se toca (activado) o no se toca (desactivado). No existe un estado de movimiento que pueda desencadenar una respuesta visual adicional.
El mouse, la pluma/lápiz y el teclado exponen un modelo de tres estados: arriba (desactivado), abajo (activado) y movimiento (foco).
Al mantener el puntero sobre un elemento, permite que el usuario explore y aprenda mediante informaciones sobre herramientas asociadas con elementos de la interfaz de usuario. Los efectos de foco y mantener el puntero pueden transmitir qué objetos son interactivos y también ayudar a seleccionar el destino.
Es igual al mouse.
Interacción enriquecida
Admite multitoque: múltiples puntos de entrada (puntas de los dedos) en una superficie táctil.
Admite un punto único de entrada.
Es igual a la entrada táctil.
Admite manipulación directa de objetos por medio de gestos como pulsar, arrastrar, deslizar, reducir y girar.
No admite manipulación directa porque el mouse, la pluma o el lápiz y el teclado son dispositivos de entrada indirecta.
Es igual al mouse.

Note

La entrada indirecta tiene la ventaja de más de 25 años de perfeccionamiento. Algunas funciones, como la información sobre herramientas desencadenada al mantener el mouse sobre un elemento, se diseñaron para explorar la interfaz de usuario específicamente con entrada de panel táctil, mouse, pluma o lápiz y teclado. Funciones de UI como esta se han rediseñado para lograr la experiencia completa que reporta la entrada táctil, sin poner en riesgo la experiencia de usuario de estos otros dispositivos.

Aquí se proporcionan algunas directrices generales de interacción del usuario y se tratan las directrices específicas del dispositivo en estos temas.

Objetos visuales para comentarios

Los comentarios visuales adecuados durante las interacciones con la aplicación ayudan a los usuarios a reconocer, aprender y adaptarse a cómo interpretan sus interacciones tanto la aplicación como los comentarios visuales de Windows pueden indicar interacciones correctas, retransmitir el estado del sistema, mejorar el sentido de control, reducir errores, ayudar a los usuarios a comprender el sistema y al dispositivo de entrada, y fomentar la interacción.

La información visual es esencial cuando el usuario usa la entrada táctil para llevar a cabo actividades que requieren exactitud y precisión en lo que respecta a ubicación. Muestra información siempre que se detecte entrada táctil para ayudar al usuario a entender cualquier regla personalizada de selección de destinos que defina la aplicación y los controles correspondientes.

Optimización de la precisión

La entrada táctil implica todo el área de contacto del dedo. Esta geometría de contacto se usa para determinar el objeto de destino más probable. Ajustar el tamaño de los controles para garantizar una interfaz de usuario cómoda con objetos y controles que sean fáciles y seguros de dirigirse.

Tamaño, espacio y posición de los controles para ayudar a eliminar la oclusión de los dedos y las manos, donde la interfaz de usuario está oculta por la propia interacción del usuario.

Coloque los menús, los elementos emergentes y la información sobre herramientas sobre el área de contacto siempre que sea posible.

Restricción de confianza

Evite o minimice las interacciones inclinadas mediante restricciones de interfaz de usuario.

  • Los puntos de acoplamiento pueden facilitar la detención en ubicaciones deseadas. Los puntos de acoplamiento especifican paradas lógicas en el contenido de tu aplicación. Cognitivamente, los puntos de acoplamiento actúan como un mecanismo de paginación para el usuario y minimizan la fatiga del deslizamiento excesivo, el deslizamiento o la rotación. Con ellos, puede controlar la entrada de usuario imprecisa y asegurarse de que se muestra un subconjunto específico de contenido o información clave.
  • "Rieles" direccionales que resaltan el eje de movimiento (vertical u horizontal).

Evitar interacciones con tiempo

Las interacciones no deben distinguirse temporalmente. La misma interacción debe tener el mismo resultado, independientemente del tiempo que se haya tardado en realizarla. Las activaciones temporales introducen retrasos obligatorios para los usuarios y reducen la naturaleza envolvente de la manipulación directa, así como la percepción de la respuesta del sistema.

Para determinar qué comando se ejecutará, las interacciones temporales suelen depender de umbrales invisibles, como el tiempo, la distancia o la velocidad. Las interacciones con tiempo no tienen comentarios visuales hasta que el sistema realiza la acción y los usuarios deben alcanzar umbrales arbitrarios e invisibles para lograr un resultado. La información visual instantánea durante las interacciones hace que los usuarios se sientan más comprometidos, seguros de si mismos y con el control.

Las interacciones que afectan directamente a los objetos y mimetizan las interacciones de la vida real son más intuitivas y fáciles de detectar y recordar. No dependen de interacciones oscuras o abstractas.

Nota: Una excepción a esto es donde se usan interacciones temporales específicas para ayudar en el aprendizaje y la exploración (por ejemplo, presionar y mantener presionado). El uso de descripciones y indicaciones visuales adecuadas tiene un gran efecto en el uso de interacciones avanzadas.