actualmente estamos desarrollando un portal web bastante complejo. Para mejorar la experiencia del usuario, queremos proporcionar un sistema de ayuda en línea sensible al contexto que pueda ayudar al usuario a comprender ciertos aspectos del sitio.
En nuestro caso, el sitio tiene una variedad de widgets que muestran todo tipo de datos tabulares, gráficos, etc. Por ejemplo, uno de esos widgets puede mostrar VIX y el sistema de ayuda ofrecería una breve descripción de lo que es el VIX.
Ahora, busqué en Internet y encontré algunos artículos interesantes como Diseñar listas de verificación para la ayuda en línea , pero la mayoría de lo que encontré parece bastante desactualizado. Lo que me interesa específicamente son los problemas de diseño como estos:
Las respuestas a algunas de estas preguntas pueden parecer obvias, pero cuando se trata de usabilidad, he comprobado que la respuesta intuitiva no siempre es la mejor. En segundo lugar, soy desarrollador de software y, como tal, tiendo a mirar las cosas desde el punto de vista de un ingeniero. Y creo que todos sabemos que este es, la mayoría de las veces, un ángulo bastante pobre desde el cual abordar el diseño de una interfaz de usuario. Es por eso que me gustaría recibir comentarios de personas con más experiencia en este campo.
Voy a aportar una respuesta limitada, por lo que no voy a responder a todas sus preguntas.
La investigación reportada por Andrea Ames hace unos años en una mini-conferencia en el campus del centro de la UBC, sugirió que la asistencia integrada y la usabilidad son mejores que la Ayuda. Ella contó la historia de cómo comparó tres métodos diferentes de entrega de Ayuda con/en un software financiero familiar. Los usuarios no perciben la asistencia integrada como una forma de Ayuda e informan que estaban "simplemente usando el software", en lugar de usar la información que los instruye y los guía a través del software. Cuando los usuarios se enfrentan a un problema, a menudo, lo último que quieren hacer es desconectarse y comenzar otra cosa. Para muchos usuarios, iniciar la Ayuda se ajusta a la categoría de "algo más", por ilógico que sea. Lo último que supe fue que Andrea estaba trabajando para IBM. Por asistencia integrada No me refiero a etiquetas y nombres de botones, sino a texto que aparece directamente en una interfaz de usuario cuya función es orientar, explicar, instruir y proporcionar contexto.
Lois Hawk informó sobre una respuesta involuntaria en el cerebro llamada respuesta de estímulo inminente. Cuando algo cambia inesperadamente en su campo visual, como un tigre, su cerebro responde de la siguiente manera: 1) enjuague la memoria a corto plazo, 2) libere un poco de adrenalina para prepararse para la acción, y 3) realice un escaneo visual del entorno. Probablemente pueda imaginar que si una ventana emergente también desencadena esta respuesta involuntaria y, por lo tanto, enjuaga la memoria a corto plazo de sus usuarios con sus ventanas emergentes de Ayuda y aumenta su estrés, no van a estar seguros de por qué no les gusta la experiencia, pero no les va a gustar. Este trabajo de investigación se encuentra en las actas de la conferencia conjunta STC región 7 y 8 en Honolulu, en 2000 (creo que ese fue el año). Es difícil encontrar una copia del mismo.
Puede ser difícil lograr que la gente lea. A veces asumen que saben lo que quieres y se niegan a leer la ayuda. La respuesta obvia sería hacer que su aplicación sea tan simple que no requiera explicación. Pero no siempre es tan fácil y es algo con lo que he luchado durante mucho tiempo.
Pero en términos de ayuda específica al contexto, elegí hacer que la ayuda aparezca cada vez que se enfoca en un cuadro de texto. Por ejemplo, el cuadro naranja a continuación solo es visible cuando el cuadro de texto del código postal tiene el foco ...
De esta manera, el usuario no tiene que hacer clic en un icono para que aparezca la ayuda. Simplemente aparecerá de forma natural a medida que completen la aplicación.
Esto no funciona para todo, por supuesto. No funcionará para botones de radio o casillas de verificación, por lo que tendrá que inventar su propio mecanismo para esos. Los pequeños íconos de información i
funcionan bien al lado de una pregunta.
Trataré de responder algunas de sus otras preguntas ...
si (o cuándo) usar ventanas emergentes, divs o enlaces a páginas externas
A nadie le gustan las ventanas emergentes. Si es posible, trate de encontrar un lugar vacío junto a cada campo donde pueda aparecer la ayuda como se muestra arriba. De esta manera no está cubriendo nada. Mantenga todo (incluida su ayuda) lo más conciso posible sin dejar de transmitir el punto.
si la entrada de ayuda se carga a pedido con AJAX (un poco apesta, desea la información de inmediato) o precargue (causando toneladas de tráfico innecesario)
Tendrá que sopesar sus opciones aquí en función de la cantidad de texto de ayuda con el que está tratando. Si de todos modos está utilizando la compresión gzip, puede que no sea un gran problema mantenerlo todo en el HTML.
Soy partidario de las sugerencias de herramientas o de las áreas que siempre están visibles que dan instrucciones básicas, y luego enlazo a una ayuda contextual más avanzada. Las sugerencias sobre herramientas tienden a estar en signos de interrogación o algo similar, pero si se necesitan lotes, prefiera usar un área de llamada simple que esté en el diseño inicial para este propósito.
La información sobre herramientas o la llamada utilizan una ID para permitir la navegación al elemento de ayuda correcto. No abro una nueva ventana/pestaña/ventana emergente/div, pero si quieren ayuda avanzada, los llevo a esa página con un enlace prominente ATRÁS que usa la ID de pantalla y la ID de información sobre herramientas/llamadas para devolverlos a el lugar correcto, manteniendo las formas pobladas.
Como se trata de ayuda avanzada, todavía tiendo a recurrir al estilo de ayuda "RoboHelp", donde hay enlaces a elementos relacionados y navegación de ayuda completa. Dado que la mayoría de las aplicaciones en las que trabajo están autenticadas con diferentes niveles de acceso/tipos de usuario/atributos de rol, lo que está disponible para navegar en la ayuda examina el token de Usuarios para decidir qué información mostrar.
Espero que algo de esto sea útil y dirija la mayoría de sus puntos.
Cuando su aplicación se centra en un tema específico y está llena de acrónimos/términos extraños, los usuarios sabrán que es una aplicación enfocada (que puede darles algo de productividad si la aprenden) y querrán participar en una experiencia de aprendizaje. El problema es que esta voluntad es solo para el primer tercio de encuentro.
Para el primer uso, puede preguntar al usuario si desea un tutorial guiado. Puede hacer esto como un asistente, en pasos que presenten elementos resaltados, o puede escuchar en qué está haciendo clic/enfocado el usuario y proporcionar ayuda para el elemento actual. En mi opinión, esto es como una experiencia de juego tutorial, aprendes los controles, obtienes el objetivo. El usuario debe poder salir en cualquier momento de este tutorial, regresar si lo desea y verificar que no vuelva a ver la invitación del tutorial. Esta experiencia se debe proporcionar a un usuario principiante.
Para usuarios medios/avanzados, creo que los acrónimos y los elementos de título/información sobre herramientas son suficientes (es decir, si tiene una IA clara y elementos intuitivos/consistentes). La información sobre herramientas no se interpone en el camino del usuario, pero es allí donde el usuario necesita ayuda, sin molestar. Deben tener un estilo bastante discreto, pero aún observable.
Este es un enlace para usar el chat en vivo como una herramienta de ayuda en línea, espero que esto ayude https://www.experienceux.co.uk/ux-blog/2017/05/30/6-steps -to-delivery-first-class-live-chat-user-experience /
Resumen de la publicación:
Haga que la llamada a la acción de Live Chat sea fácilmente visible/accesible (por ejemplo, el área inferior derecha del sitio web).
Llame más la atención a la llamada a la acción cargándola después del resto del contenido de la página (por ejemplo, un par de segundos después).
Ayuda a superar la barrera "¿es esto un humano real?" Mostrando el nombre y la foto de la persona.
Facilite a los usuarios la navegación en paralelo cargando la ventana de chat in situ dentro de la ventana del navegador y permitiendo a los usuarios minimizarla.
Reduzca la necesidad de que los usuarios aprendan cosas nuevas siguiendo patrones de diseño de servicios de mensajería familiares como Facebook Messenger y WhatsApp.
Permita que la ventana de chat web se minimice mientras sigue mostrando notificaciones de nuevos mensajes.