Saltar al contenido principal

Asistente

Descripción general​

Un asistente es un formulario de varias páginas que guía a los usuarios a través de un flujo complejo o una serie de tareas interrelacionadas, por ejemplo, cotización, cambio de póliza y renovación. Los asistentes deben tener suficiente flexibilidad para que los clientes los adapten a sus necesidades. Esto incluye cambiar la composición y disposición, el tema, los componentes y los componentes personalizados.

Cuándo se debe utilizar​

  • Para dividir tareas largas y complejas en pasos más breves y manejables.
  • Para transacciones de cotización y pago.

Cuándo no se debe utilizar​

  • Si una tarea se puede llevar a cabo en un solo paso sin causar confusión ni abrumar al usuario. En casos como estos, es posible que no se necesite un asistente y quizás introduzca una complejidad innecesaria.
  • Para tareas sencillas de ingreso de datos. Evalúe la posibilidad de usar el patrón de formularios en su lugar.

Anatomía​

Imagen que representa la anatomía del patrón del asistente en el escritorio Ejemplo del patrón del asistente que aparece en un flujo de cotización y compra para asegurados (versión para computadoras de escritorio).

La composición y disposición, el tema y los componentes pueden variar según la aplicación y el caso de uso.

En este ejemplo, el patrón del asistente consta de los siguientes elementos:

  1. Composición y disposición de los pasos: Comunica el progreso del usuario a medida que avanza en la tarea.
  2. Área de contenido principal: Muestra contenedores, campos y controles de formularios.
  3. Pie de página con botón: Incluye un conjunto estándar de acciones para controlar el flujo del asistente.

Pautas generales​

  • Utilice el asistente cuando una tarea requiera que los usuarios completen varios pasos secuenciales. El asistente puede simplificar tareas complejas dividiéndolas en una secuencia de fragmentos. Para los formularios que requieran validación o verificación de las entradas del usuario, el asistente guía a los usuarios a través del proceso y proporciona retroalimentación en tiempo real.
  • Para orientar a los usuarios, rotule con claridad cada uno de los pasos y resalte el paso actual.
  • Reduzca al mínimo la toma de decisiones y simplifique la interacción mediante la aplicación de un orden secuencial claro de los pasos.
  • Permita a los usuarios salir del asistente a mitad del proceso y guardar su progreso. Si bien los usuarios incurrirán en el costo cognitivo de recuperar el contexto y recordar sus objetivos, al menos no tendrán que volver a ingresar la misma información.
  • Asegúrese de que los pasos del asistente sean suficientes por sí solos y no requieran información que esté disponible en otra parte de la aplicación o en un paso anterior.
  • Optimice el flujo del asistente para varios tamaños de pantalla y dispositivos (computadoras de escritorio, tablets, dispositivos móviles), a fin de garantizar una experiencia coherente.

Fuente: Nielsen Norman Group

Contenido​

Pautas generales de redacción​

  • En todos los aspectos del diseño de las interfaces de productos de Guidewire, utilice mayúsculas como se usan en las oraciones. No use mayúsculas en todas las palabras.
  • Use verbos en tiempo presente y voz activa en la mayoría de las situaciones.
  • Use contracciones comunes para darle al texto un tono más natural e informal (pauta correspondiente al inglés).
  • Use un lenguaje sencillo. Evite la jerga innecesaria y el lenguaje complejo.
  • Las palabras y las oraciones deben ser breves.

Rótulos de pasos​

Use un rótulo breve y descriptivo para cada paso. El título en la parte superior de cada pantalla puede explicar con mayor detalle el rótulo del paso. Sin embargo, en todos los casos, debe haber una relación directa entre el rótulo del paso y el título de la pantalla.

Rótulos de botones​

Los rótulos de botones predeterminados para la navegación del asistente son Atrás, Siguiente y Finalizar. Cuando reemplace los rótulos de botones predeterminados, asegúrese de que sean cortos y estén orientados a la acción, como Agregar conductor.

Accesibilidad​

Asegúrese de que el flujo esté diseñado de manera que resulte accesible para los usuarios con discapacidades, incluida la compatibilidad con lectores de pantalla y navegación por teclado.

Interacciones​

  • Los asistentes incluyen los botones Atrás y Siguiente que permiten a los usuarios avanzar o retroceder en los pasos. Además, los usuarios tienen la opción de navegar directamente a pasos específicos utilizando una barra de progreso visible.
  • Por lo general, cada paso contiene campos en los que los usuarios introducen información o seleccionan algo. Dependiendo de las entradas del usuario, ciertos pasos o campos pueden mostrarse u ocultarse dinámicamente.
  • Los datos ingresados en los pasos anteriores se guardan o almacenan, lo que permite a los usuarios navegar libremente sin perder su progreso.
  • El paso final proporciona un resumen de la información ingresada.

Capacidad de ser responsive​

El patrón del asistente está diseñado de tal manera que se requieren cambios mínimos cuando se usa en una tablet o un dispositivo móvil. El apilamiento de algunos de los campos de entrada y otros componentes puede producirse a medida que el tamaño de la pantalla se reduce. Los indicadores de progreso pueden cambiar para adaptarse a espacios de pantalla más pequeños.

Tematización​

De forma predeterminada, los temas y la marca coinciden con los de la aplicación, a menos que se invaliden.

Los patrones pueden adoptar ciertos temas para cumplir con los requisitos específicos de la marca y las necesidades del cliente. Esto incluye elementos visuales como colores, tipografía, íconos, botones y otros componentes o elementos gráficos.

Más información sobre la tematización con tokens de diseño

Investigación que lo avala​

La investigación para este patrón consistió en un análisis competitivo. El análisis competitivo es una técnica de investigación que se utiliza para comparar y entender en qué están trabajando otros en el mismo campo. Los diseñadores de UX analizaron más de diez de las aseguradoras más grandes de EE. UU., Reino Unido y la UE, y revisaron las composiciones y disposiciones, estilos, elementos y comportamientos de los asistentes. Buscaron fortalezas y debilidades relativas, tendencias y diferencias. Los diseñadores utilizaron esa información, encontraron puntos en común y crearon un patrón basado en esas prácticas.

Se llevaron a cabo pruebas de uso en los asistentes de agentes y asegurados cuyos resultados fueron satisfactorios.

Componentes​

Patrones​

Formularios

Recursos​

Descargue un archivo ZIP con los patrones más recientes de Jutro y comience a diseñar experiencias.

Biblioteca de patrones de Jutro (19.6 MB)