Lleve UX al siguiente nivel agregando 'Delight'
Los sitios web están diseñados para realizar una función y comunicarse con sus usuarios. Pero más allá de esto, los sitios web también pueden ser atractivos, emocionantes e incluso divertidos de usar.
Agregar interés visual a un sitio ayuda a mantener nuestro compromiso con él, ya sea por tipografía, gráficos o fotografía. Pero creo que también existe el potencial de elementos de interacción para proporcionar estimulación visual y retroalimentación, incluso deleitar al usuario. En este artículo, argumentaré que agregar algunos efectos para divertir, sorprender y entusiasmar a los usuarios puede mejorar sus sitios web y aplicaciones y hacer que los usuarios regresen.
Deleite
El diseño del sitio web suele ser un tema seco, cargado de jerga UX y viajes de usuario de la Arquitectura de la información. ¿Pero por qué no debería haber algo de diversión en el camino? Agregar deleite a un sitio es una gran manera de hacer que un sitio no solo sea más humano sino que también haga que su sitio sea único.
Voy a limitar mi definición de deleite aquí diciendo que es la adición de la funcionalidad no requerida .
Con esto quiero decir que no es una parte esencial de la función del sitio. Sin embargo, puede tener un efecto poderoso en la percepción y experiencia del sitio. De hecho, iría tan lejos como para decir que la forma en que manejas los elementos estrictamente innecesarios de la interfaz de usuario es tan importante como la tipografía y otros elementos visuales, al establecer el tono de un sitio web.
Una interacción libre
En una artículo para Cooper Journal, Chris Noessel llama a 'One free interaction' un patrón de diseño "que da al software una sensación más humana".
Parte de ello es el reconocimiento de que los humanos son criaturas inquietas, a menudo propensas a repetir pequeñas acciones. Tradicionalmente, con bolígrafo y papel, garabateábamos o retractamos continuamente las plumas. Soy un pen-spinner inveterado, por ejemplo.
Las personas a menudo llevan esta inquietud a la navegación web, a menudo desplazándose hacia arriba y hacia abajo, seleccionando fragmentos de texto o repitiendo acciones.
El patrón One Free Interaction abarca esta necesidad humana innata de violín, mediante la creación de elementos interactivos que producen resultados inesperados o agradables. ¿Necesitas un ejemplo? Intente colocar el cursor sobre el logotipo 'W' de Web Designer Depot en la parte superior de esta página.
Como dice Noessel, las interacciones libres se sientan fuera del rendimiento de la tarea, y en su lugar se sientan en los espacios intermedios. Pero son poderosos en dar forma a nuestra respuesta emocional a los sitios que usamos.
Efectos de desplazamiento
Como se dijo anteriormente, uno de los 'agitadores' más comunes se desplaza hacia arriba y hacia abajo, por lo que los sitios que agregan interés visual al desplazarse a menudo son encantadores.
El sitio de una página para el Nizo La aplicación de fotografía de Image Mechanics presenta componentes de la cámara 'Knolled' que se mueven mientras se desplaza hacia abajo y hacia afuera a medida que se desplaza hacia abajo. Si eres como yo, pasarás bastante tiempo simplemente subiéndote y bajando, jugando con la magnífica interfaz. (No esperes hasta que la aplicación sea lanzada).
El uso de efectos de paralaje en el desplazamiento también agrega deleite, creando la ilusión de profundidad. Me encanta el chico-tímido página web, donde los efectos de desplazamiento coinciden perfectamente con el tono y el estilo visual del sitio.
Me sorprende que no haya más sitios web con efectos de desplazamiento horizontal, dado que el desplazamiento lateral es un tema tan común en el diseño de juegos. Pero un buen ejemplo es el Nintendo Mario Kart sitio que mira la historia del juego a través de 20 años de consolas de Nintendo.
El sitio polaco Triturar agrega capas de elementos gráficos que cambian a medida que se desplaza, una forma de alta tecnología de lograr una sensación de boceto de baja fidelidad.
El rey de los sitios de efectos de desplazamiento es probablemente Acko . Aquí, el elemento del encabezado del sitio es un objeto de graffiti 3D animado. Es el logotipo animado llevado al siguiente nivel: inmersivo, interactivo, lúdico. Incluso hay logros para 'desbloquear' en la interfaz de usuario, aunque la gamificación es otro tema en total.
Diseño para la emoción
Agregar deleite a su sitio ayuda a crear una conexión emocional con un usuario. El poder de la emoción en el diseño es algo que recién estamos empezando a comprender, pero ayuda a explicar por qué disfrutamos el uso de ciertos objetos y tenemos una conexión tan poderosa con ellos. Se aplica tanto al diseño físico del producto como al diseño interactivo.
Creo que una buena razón por la que los productos de Apple son tan apreciados es que los usuarios se apegan emocionalmente a ellos, y hay muchos ejemplos de deleite tanto en el hardware como en el software de Apple. Sé que a muchas personas les encanta el desplazamiento de la "banda elástica" en el Safari móvil iOS tanto que les distraerá haciendo ping hacia arriba y hacia abajo.
Está bien por "mucha gente", me refiero a mí, pero Steve Jobs amaba lo suficiente como para patentarlo, y ha formado parte del litigio de Apple contra Samsung.
Aaron Walter, en su libro Diseñando para la emoción, analiza la forma en que los sitios web exitosos captan las emociones de los usuarios al imbuirles de personalidad. Agregar elementos que hacen las delicias de un usuario es una forma muy poderosa de hacerlo. En pocas palabras, preferimos herramientas que nos deleitan, por lo que también es bueno para los negocios.
Delight no es un truco
Agregar placer no significa agregar efectos intencionales como un truco. Los efectos están ahí para ayudar a dar forma a la personalidad del sitio. No tienen que ser lúdicos o extravagantes (aunque pueden serlo si esa es la personalidad que quieres transmitir), pueden ser sutiles y restringidos si le conviene más al personaje. Echa un vistazo a pictet.com. Me encanta la forma en que se desvanece la barra de búsqueda cuando haces clic en el enlace de búsqueda; esto hace que el campo de texto de búsqueda no sea un elemento dominante, hasta que lo solicites. Es sutil y elegante, y se adapta perfectamente al tono del sitio, una compañía de servicios financieros suiza.
A veces los efectos son tan sutiles que es posible que ni siquiera los notes. ¿Sabías, por ejemplo, que el control de volumen en el BBC iPlayer sube a 11? Es un buen guiño a Spinal Tap.
No exageres
Agregar demasiadas interacciones inesperadas puede ser contraproducente, creando un exceso visual. A menos que estés tratando de crear un entorno hipercinético similar a un juego, demasiados efectos visuales, con volteos, ventanas emergentes, whizzbangs y bombas extravagantes en todo el lugar, te perjudicarán seriamente de cualquier compromiso significativo con el contenido. Eche un vistazo a la LEDbow sitio por ejemplo. Técnicamente es brillante, pero no creo que se comunique de manera efectiva. Simplemente están sucediendo demasiadas cosas.
Marque el deleite
Me encantan los sitios que tratan la pantalla como un visor o una superficie en lugar de un visor de páginas. Las capas que se mueven a diferentes velocidades crean profundidad e interés. Los elementos que se mueven hacia la posición les llaman la atención.
El movimiento hace que la experiencia sea más inmersiva, pero tenga en cuenta que este tipo de interactividad por sí misma no equivale a un mayor compromiso.
Agregar deleite hace que los sitios sean más humanos y también más táctiles, atrayendo nuestra mente de mono para jugar y jugar mientras pensamos y aprendemos. La próxima vez que cree un sitio, piense cómo puede crear algo único para deleitar a sus usuarios.
¿Diseñas para la emoción? ¿Cómo agregas deleite a un sitio? Háganos saber en los comentarios.