Lección 1 de 0
En Progreso

4.6 : Llamar la atención del usuario: Gestalt y diseño web

2 octubre, 2023

Ayude a sus usuarios llamando su atención sobre las partes más importantes de la pantalla cuando sea necesario. Esto se puede lograr con la conciencia y el conocimiento de los principios Gestalt de organización perceptiva.

Los beneficios de un enfoque impulsado por la Gestalt

Un sitio web puede ser un lugar confuso, especialmente para los nuevos visitantes. No están completamente seguros de qué hay disponible, qué pueden hacer o dónde pueden ir dentro del sitio web. Su objetivo debe ser ayudar al usuario a responder todas estas preguntas (‘¿Qué hay disponible?’, ‘¿Qué puedo hacer?’ Y ‘¿Dónde puedo ir?’) En cuestión de segundos después de que llegue el usuario. Para ello, debes llamar la atención del usuario sobre los aspectos más informativos de la pantalla, o los elementos que le ayuden a responder estas preguntas en el menor tiempo. Por ejemplo, los sitios web generalmente incluyen una barra de navegación de nivel superior en la parte superior (de ahí el nombre) de cada página, para ayudar al usuario a responder “¿dónde estoy?” y ‘¿a dónde puedo ir?’.

Dentro del cuerpo de cada página, al usuario se le muestra típicamente una serie de imágenes, historias, productos, elementos, etc. interesantes (dependiendo de la naturaleza del sitio) que le ayudan a establecer lo que puede hacer. Estos también sirven para establecer qué está disponible u ofrecido dentro del sitio. Por lo tanto, la pantalla se puede considerar como una serie de regiones distintas que ayudan al usuario a responder las preguntas más importantes y comunes a su llegada (Jeffrey Veen, autor de The Art and Science of Web Design ).

Si bien dividir la pantalla en compartimentos puede ayudar al usuario, si cada una de estas secciones está abarrotada de muchas imágenes, texto y otros elementos diferentes, entonces no sabrán a dónde dirigir su atención. Por tanto, es importante mantener la pantalla ordenada, organizada y estructurada para que el usuario pueda establecer cuál de los elementos requiere su atención y cuándo.

El sitio web de Graze es un ejemplo de diseño minimalista, que a menudo se considera una buena forma de ayudar a los usuarios a identificar elementos específicos y sin la necesidad de un escaneo que consume mucho tiempo. En la parte superior de la página de inicio, el usuario puede ver una imagen que consta de varios productos disponibles en el sitio, y dentro de esta imagen hay una serie de elementos que ayudan al usuario a determinar qué deben hacer. Por ejemplo, el botón ‘Comenzar’ proporciona al usuario un único punto de inicio, que le permite simplemente seguir el flujo predeterminado y está estratégicamente ubicado, por lo que se elimina la carga de escanear la pantalla en busca de este trampolín. Además, la descripción de ‘cómo funciona’ se coloca justo debajo del llamativo inicial, lo que satisface la necesidad del usuario de una breve explicación de lo que debe hacer en el proceso.

El minimalismo del diseño web Graze refleja, en parte, el número limitado de cosas que hacer; ofrecen efectivamente un solo servicio: entregar los bocadillos que elijas. Otros sitios web con muchos productos y servicios diferentes en oferta pueden tener dificultades para emplear ese minimalismo. Sin embargo, este ejemplo de diseño web sirve para resaltar algunas de las formas en que los diseñadores pueden utilizar los principios Gestalt de organización perceptiva para ayudar a llamar la atención del usuario sobre las partes más importantes de la pantalla, que pueden ser partes que son importantes para el usuario. objetivos y actividades o los propósitos e intenciones del diseñador. Por ejemplo, el usuario puede estar ingresando sus datos personales cuando realiza una compra en un sitio de comercio electrónico, por lo que es importante que los campos de entrada estén claros y haya la menor distracción posible.

Por el contrario, la intención del diseñador puede ser llamar la atención del usuario sobre los anuncios dentro de su sitio web, lo que normalmente no es algo que beneficie al usuario. El diseñador puede lograr esto mostrando el anuncio en el centro de la pantalla o evitando que el usuario haga cualquier otra cosa antes de hacer clic en la cruz del cuadro de anuncio. Ambos ejemplos requerirían una comprensión de cómo funciona el sistema visual y cómo explotar los sesgos perceptuales que subyacen a la percepción visual humana.

Uso de las leyes de la Gestalt: llamar la atención

En esta sección veremos algunas de las formas en que se han empleado las leyes de la Gestalt para llamar la atención del usuario sobre elementos importantes en la página de inicio de Graze.

  • Figura / Organización del terreno : hay muchos ejemplos de las partes más importantes o significativas de la pantalla que aparecen orgullosas del resto de la página. Por ejemplo, el botón verde “Empezar ahora” sobre un fondo blanco aparece como figura y el resto del cuadro como fondo, lo que ayuda al usuario a identificar el elemento interactivo (es decir, el botón). La oferta de la “1ª caja a mitad de precio” también se considera más destacada, ya que la “pegatina” de color amarillo claro se destaca en la imagen oscura del fondo. Todo texto es un ejemplo de organización de figura / fondo, ya que podemos extraer las letras / palabras del fondo y enfocarnos en ellas, en lugar de tener que determinar conscientemente qué parte (es decir, las palabras o el fondo) requiere nuestra atención.
  • La ley de la continuidad– Las imágenes en la sección ‘cómo funciona’ son dibujos de líneas simples que podrían verse como cualquier número de combinaciones diferentes de líneas, curvas y formas, pero gracias a la continuidad podemos identificar y enfocar nuestra atención en las partes significativas y formar objetos completos. Al utilizar estos dibujos lineales, los diseñadores han minimizado el potencial de confusión; explotar la naturaleza inconsciente y automática de la percepción de objetos para ayudar a los usuarios a identificar y formar representaciones mentales significativas. Las cifras ambiguas o más detalladas pueden ralentizar al usuario al intentar establecer qué significan las imágenes y cómo se relacionan con el texto que las acompaña. Por lo tanto, al reconocer la capacidad perceptiva de formar formas completas y significativas a partir de líneas simples, los diseñadores han apoyado la ley de la continuidad y han dibujado al usuario ‘ s atención a los elementos útiles de la pantalla. (ver también ‘Pragnanz’ y la ‘Ley de la significación’)

Se han explotado otros principios de la Gestalt en el diseño de Graze; Compruébelo usted mismo e intente averiguar cuáles son y cómo se han utilizado para llamar la atención del usuario sobre elementos específicos.