La interacción detalla mensajes de "comentarios" que no se pueden ignorar
2) Ningún comentario o un comentario hostil, como una persona fría, traerá a los usuarios una experiencia negativa impotente o infeliz.
La retroalimentación rápida y adecuada a los usuarios es un principio muy importante del diseño de interacción, como se muestra en la siguiente figura.
1) Puedes decirles a los usuarios qué hacer a continuación.
2) Ayudar a los usuarios a tomar decisiones y juicios.
Los comentarios pueden presentarse de muchas formas (consulte la imagen a continuación) y todas las indicaciones deben aparecer en el lugar correcto en el momento adecuado, brindando información útil en texto breve y claro para evitar confundir a los usuarios.
Hablemos primero de la retroalimentación "brindis", que es el mensaje de retroalimentación de los resultados de la operación del usuario. Generalmente, solo aparecen en la pantalla por un corto tiempo y desaparecerán por sí solos como burbujas después de un tiempo sin ninguna operación. Se utiliza para indicar el estado de la tarea y los resultados de la operación, como se muestra en la siguiente figura.
Veamos los comentarios de la "capa flotante", un mensaje de clase dirigido por el usuario que normalmente no desaparece pronto. A veces habrá un pequeño mensaje que apuntará a una ubicación específica (como Didi, Xianyu) para recordarle al usuario a qué ubicación prestar atención. El usuario debe hacer clic en el área de inicio o hacer clic en el botón cerrar para que desaparezca el mensaje.
En términos generales, las ventajas de las capas tostadas y flotantes son que no afectan la operación actual y brindan retroalimentación oportuna. La desventaja es que los usuarios las ignoran fácilmente, por lo que no son adecuadas para transportarlas; mucho texto o información importante.
Las ventanas emergentes se dividen en "modales" y "no modales" y deben usarse en la escena. Consulte la imagen a continuación.
Ventana emergente modal: obliga a los usuarios a prestar atención al contenido y al funcionamiento de la ventana emergente y bloquea todo el contenido en segundo plano. Sin embargo, cabe señalar que se debe salir de la operación; la descripción del texto debe ser lo más concisa posible sin objeciones. Por lo general, se divide en dos métodos de diseño: cuadro de diálogo y cuadro de función en la parte inferior de la barra de acción, que se pueden seleccionar según el escenario real. Generalmente, cuando hay tres o más botones de función en un cuadro de diálogo, aumentará la carga de selección de funciones del usuario. Por lo tanto, cuando sea necesario utilizar varios botones de función para la selección, puede considerar usar la barra de acción.
Ventana emergente no modal:? No afecta la operación actual del usuario, pero a menudo actúa como una ventana flotante. Normalmente los colores de las confirmaciones y cancelaciones se distinguen claramente e indican posibles pérdidas, como se muestra en la siguiente figura.
Resumen de ventanas emergentes:
La aparición de ventanas emergentes obligará a los usuarios a prestar atención al contenido y las operaciones de las ventanas emergentes, lo que molestará gravemente a los usuarios. Según el escenario de uso, reduzca el diseño de patrones tanto como sea posible. Asegúrese de que los usuarios puedan salir de la ruta de forma segura y volver a las acciones esperadas en todo momento. Si aparecen tres o más botones de función, intente usar el cuadro de función en la parte inferior.
Botón: En realidad, presionar un botón provocará inmediatamente un estado presionado, como se muestra a continuación.
En la interacción persona-computadora, cuando el usuario presiona un botón o enlace en la pantalla, el estado también debe cambiar para que el usuario sepa que la interfaz ha recibido su operación, como se muestra a continuación.
El sonido es una parte muy importante de los sentidos humanos y debería ser un aspecto de la experiencia del usuario del producto, pero se ignora fácilmente, de forma intencionada o no.
El diseño de retroalimentación, comúnmente utilizado en el diseño de juegos, es un medio importante para que los jugadores se adapten rápidamente a las operaciones del juego y obtengan una sensación de participación y logro, como se muestra en la siguiente figura.
En la interacción persona-ordenador, el uso adecuado de la retroalimentación sonora da el toque final y aporta placer a las personas, como en el siguiente ejemplo.
Entonces, ¿qué es un buen diseño de sonido de interfaz de usuario? Debes hacer las siguientes tres cosas:
1. Cumplir con las expectativas del usuario (es decir, cerca de escenarios de la vida real)
2. Expresar significados y emociones claros y precisos.
3. Buena experiencia sensorial de los efectos sonoros (musicalidad, sonido y duración)
Por supuesto, no todos los diseños son adecuados para añadir sonido. En muchos casos, es una mejor experiencia no utilizar sonido, por lo que debes permitir a los usuarios silenciar el sonido en la aplicación. Cualquier experiencia con sonidos de "reproducción automática" o "reproducción forzada" debe realizarse con precaución.
Utiliza un cepillo de dientes eléctrico para rodar una escena de la vida real. Durante el uso, el cepillo de dientes proporciona una fuerte respuesta táctil a los dientes y vibra dos veces cada 30 segundos para indicarle que cambie de lado. Los usuarios pueden desarrollar buenos hábitos de cepillado sin cronometrar.
En las interfaces hombre-máquina la vibración se utiliza mucho, como llamadas entrantes, mensajes de texto, conexión a líneas de datos para carga, etc. , como se muestra en la siguiente figura.
Cabe señalar que la vibración es una fuerte retroalimentación táctil y se puede utilizar para reemplazar o mejorar las indicaciones sonoras, pero no se puede utilizar de forma indiscriminada.
La animación enfatiza: adecuación al producto, interesante y oportuna. Tomemos un ejemplo común: baje para actualizar; el uso de animaciones interesantes puede hacer que la espera ya no sea aburrida, como se muestra a la izquierda.
Al igual que en la escena del taxi de Didi, el usuario envía un formulario de consulta y espera la consulta del médico. Los avatares de los médicos a los que se puede consultar aparecen constantemente en la interfaz. El efecto de animación es oportuno y rápido, lo que ayuda. El usuario puede comprender intuitivamente los resultados de la operación, como se muestra en la imagen de la derecha.
El contenido de los comentarios debe ser principalmente texto. La información textual debe ser concisa y fácil de entender, y evitar el uso de oraciones invertidas. Lo mejor es expresar claramente lo que quieres decir en una o dos frases y evitar utilizar un lenguaje demasiado procedimental.
Existen cuatro tipos de contenido:
Información, aquí algunos ejemplos:
Advertencia: generalmente representado por un cuadro de advertencia, utilizado para mostrar al usuario acerca de el programa Utilice información de alto impacto, como se muestra en la imagen a continuación.
Error: La copia avisa al usuario que hay un problema o anomalía en la operación y no se puede continuar con la ejecución.
Confirmación: Se utiliza para preguntar al usuario si desea continuar una operación para que el usuario pueda confirmar una segunda vez y proporcionarle un retiro irrevocable.
Dependiendo de los diferentes escenarios, aparecerá en las siguientes ubicaciones: barra de estado, barra de navegación, encima del área de contenido, en el centro de la pantalla, encima de la barra de menú y en la parte inferior (cubriendo el barra de menú).
Ventajas de la barra de estado: la actualización requiere una cierta cantidad de tiempo para evitar que el usuario espere para hacer otras cosas, y el proceso de espera se debilita. Desventajas: la posición no es obvia. Se recomienda hacer una barra que sea de poca importancia o que se extienda. La pantalla muestra las indicaciones requeridas. (Vea la imagen a continuación)
Barra de navegación: adecuada para mostrar información temporal e importante. Generalmente, muestra el estado de la conexión, lo que indica que el producto está intentando conectarse a la red y extraer datos. (Vea la imagen a continuación)
Encima del área de contenido: ubicada encima del área de contenido y debajo de la barra de navegación, generalmente es una actualización desplegable, que es un acceso directo para cargar contenido nuevo. La información de solicitud predeterminada está oculta. Cuando se abre la interfaz, se mostrará la información de solicitud correspondiente para guiar la operación del usuario.
Centro de la pantalla: suele ser un mensaje de información general e importante. Todos los mensajes del sistema que requieren la atención del usuario se pueden mostrar en esta ubicación, como se muestra en la siguiente figura.
Encima de la barra de menú: puede ser un mensaje para la información general de la aplicación; también puede ser un mensaje relacionado con el contenido en la parte inferior de la interfaz.
Abajo (cubriendo la barra de menú): las indicaciones que se muestran en esta posición están diseñadas en función de las características únicas de la aplicación y pueden ser una búsqueda de nuevas formas. Este diseño de retención mantiene la consistencia en la posición operativa.
- Proporcionar retroalimentación necesaria, positiva e inmediata a los usuarios en todas las etapas.
-Evitar comentarios excesivos para evitar interrupciones innecesarias a los usuarios.
——Una operación simple que puede ver el efecto a tiempo y se puede omitir el mensaje de retroalimentación.
-Los comentarios proporcionados deben permitir a los usuarios completar sus elecciones de la manera más conveniente.
- Realizar un diseño diferenciado para distintos tipos de feedback.
-No interrumpas el flujo de conciencia del usuario y evita oscurecer objetos que el usuario pueda mirar o manipular.
Lo anterior es la introducción del caso del capítulo "Comentarios". El artículo completo enumera brevemente la mayoría de los casos de la aplicación WeDoctor, sin un estudio en profundidad en muchos lugares. Bienvenido a Paizhuan...