Experiencia de usuario: Siete mejores prácticas de estado vacío para el diseño de UX

Al igual que en un mapa, los estados vacíos (dirección de instrucción en una página web o en el software) guían al usuario en un viaje a través de su sitio web o software. Imagínese intentar planificar un viaje por carretera a un lugar en el que nunca ha estado utilizando un mapa al que le faltan grandes cantidades de información. Los estados vacíos son las pantallas que llenan esos espacios en blanco. Con un diseño y una ubicación cuidadosos, estas pantallas pueden marcar la diferencia entre un usuario feliz y uno frustrado que abandona su sitio a la mitad.

Según IBM, cada dólar invertido en facilidad de uso devuelve entre $ 10 y $ 100, afirma Megan Hartman, aprendiz de UXbeginner. Este ROI es solo una razón para dedicar más tiempo a decidir qué plataforma de comercio electrónico es la adecuada para su empresa y sus clientes. La experiencia del usuario (UX) es cada vez más importante para la satisfacción, el compromiso, la adquisición y la retención del cliente. Dependiendo de qué tan fácil de usar sea su plataforma o sus productos, UX puede hacer o deshacer su lista de clientes.

Los estados vacíos son un concepto importante para quienes apoyan a las empresas locales en la transición hacia el comercio electrónico y las soluciones digitales. Una gran experiencia de usuario es sinónimo de una gran primera impresión; es parte integral de la relación entre una empresa local y un experto local de confianza. Los estados vacíos bien diseñados garantizan que sus soluciones y su sitio web comercial se vean profesionales. Esto ayuda a dar a los posibles clientes una primera impresión positiva de su negocio, lo que fomenta la confianza en su capacidad para guiarlos.

El uso apropiado de los estados vacíos puede ayudarlo a retener más clientes al brindar una experiencia de usuario fluida.

“Sin estados vacíos, el usuario no sabe qué hacer a continuación y puede perderse fácilmente en el software o en un sitio web. Cuando no sepan qué hacer, es probable que abandonen su sitio web y vayan a otro. Los estados vacíos mitigan esa caída y permiten que el usuario continúe en el viaje que espera que realice ”, dice Loni Goff, diseñadora de Vendasta .

Este elemento de diseño puede tener un impacto crítico en la forma en que un usuario interactúa con su sitio. Al reconocer la importancia de la experiencia del usuario, los diseñadores de Vendasta UX están agregando continuamente más estados vacíos en puntos críticos en toda la plataforma de comercio electrónico de un extremo a otro. Las plataformas de redes sociales como Facebook y Snapchat usan pantallas de estado vacías para solicitar la adición de "amigos" a su red social. Los avisos promueven la satisfacción y la retención del cliente porque mantienen a los usuarios activos y comprometidos.

Estados vacíos y la experiencia del usuario

Los estados vacíos ayudan a los usuarios a alcanzar sus objetivos dentro del software o en un sitio web. Pueden incluir dirigir a los nuevos usuarios a las plantillas que les ayudarán a comenzar con el software que están utilizando. Los estados vacíos pueden ocurrir cuando hay un error, se busca una URL incorrecta o se usa una URL antigua.

Se pueden utilizar para recopilar inteligencia de marketing al solicitar que se complete un formulario antes de que se complete la página siguiente. Empresas como Hubspot usan este estado vacío de llenado de formulario cuando los usuarios desean acceder a cierto contenido.

Estas pantallas se utilizan para aumentar el compromiso, lo que incita a los usuarios a participar en el siguiente paso que el diseñador quiere que tomen. También se pueden utilizar como explicación de por qué algo en un sitio web no responde. Yelp utiliza una pantalla de estado vacía que tiene una construcción visual combinada inteligentemente con texto divertido que agrega humor a una circunstancia frustrante.

Mejores prácticas de estado vacío

1. Guíe la experiencia del usuario

Aproveche esta oportunidad para transmitir información al usuario. Esto puede incluir el siguiente paso que deben tomar, una advertencia de un enlace roto o cualquier cosa para evitar una mala experiencia del usuario. Esta interacción guiada con el usuario realmente puede influir en su decisión final sobre si permanecer en un sitio web.

Vea el siguiente ejemplo de Skyscanner.

Fuente de imagen

2. Elija sus palabras con cuidado

Expresar el mensaje correcto es extremadamente importante en el software de estado vacío. El mensaje debe ser claro para que no se malinterprete fácilmente. La explicación escrita debe ayudar al usuario a comprender lo que debe hacer a continuación. Esto podría ser cualquier cosa, desde crear un perfil hasta agregar otros usuarios a una red. Esta guía escrita debe ser concisa para que el usuario pueda dar fácilmente el siguiente paso apropiado.

3. Utilice contenido visual

Interactúe con el usuario más allá de las palabras con contenido visual bien diseñado. Esta oportunidad de marca debe incluir una imagen que coincida con el texto. Asegúrese de que la creatividad no sea demasiado llamativa o grande y que sea una representación visual del texto en estado vacío. La adición de una imagen hace que el estado vacío parezca más profesional y atractivo.

4. Incluir un botón

Los botones son una indicación clara para guiar al usuario hacia donde el diseñador quiere llevarlos. Esta experiencia de ingeniería puede llevar a los usuarios a cualquier parte del sitio. Puede indicarles que agreguen contactos a una lista de clientes o que agreguen una plataforma social al software, como en el Informe instantáneo de Vendasta . Este informe es una herramienta de inteligencia de ventas automatizada que extrae una evaluación de las necesidades de marketing de los clientes potenciales a partir de la información disponible en línea.

Vea la progresión del estado vacío de Dropbox a continuación, que incluye texto reflexivo, una imagen coincidente y un botón.

Fuente de imagen

5. Indique al usuario que haga clic en algún lugar de la página.

Esto podría resultar útil cuando el usuario recién esté comenzando en su sitio web o dentro del software. Incluya una breve descripción y flechas que apunten a algunos de los botones importantes ubicados en la pantalla.

Fuente de imagen

6. Vínculo de retroceso al contenido

Agregue un vínculo de retroceso en un estado vacío que se vincule a una pieza de contenido de actualidad. Esta práctica recomendada es buena para seguir si hay una biblioteca de contenido disponible en el sitio web, cualquier cosa que proporcione información sobre su sitio web que pueda ser útil para un usuario. Esto podría incluir un enlace a una demostración, un blog de alto nivel o un artículo instructivo informativo.

7. Asegurarse de que los diseñadores y desarrolladores tengan una buena relación de trabajo.

En el caso de que un estado vacío aborde un problema técnico, como el clásico "Error 404", esto generalmente significa que hay una gran desconexión en la comunicación entre desarrolladores y diseñadores. Es probable que estos mensajes inútiles no hayan sido examinados por un diseñador y confundan la experiencia del usuario.

La comida para llevar

Estados vacíos:

• Incrementar la captación de clientes
• Incrementar la retención de clientes
• Reducir las tasas de rebote del sitio web
• Incrementar el compromiso del cliente

Los estados vacíos no solo son una hoja de ruta dentro de los sitios web y el software, sino que también le dicen al usuario el beneficio de seguir los siguientes pasos.

Herramientas como el Informe instantáneo utilizan estados vacíos para ayudarlo a aumentar la adquisición de clientes mediante la evaluación de las necesidades de marketing digital de los clientes potenciales. Por ejemplo, podrá ver su rendimiento en listados, reseñas, redes sociales, sitios web, publicidad digital, SEO y comercio electrónico, y los estados vacíos le indicarán los siguientes pasos.