Para empezar a hablar de diseño web, lo primero que tienes que saber es que le llamamos web a una variabilidad enorme de proyectos. Me parece importante situar el rango de tipologías de “webs” para que puedas entender de qué va esto de hacer o tener una web.

Web personal o de portafolio

Eres un profesional liberal con o sin portafolio visual que, simplemente, quiere enseñar su oferta de servicios a un público concreto. Esta tipología de web es bastante unidireccional, se indica una serie de información o servicios de una manera más o menos agraciada. Esta web es un imprescindible en la comunicación visual hoy día, va junto con la tarjeta personal y el diseño de tu hoja de presupuesto.

E.commerce

Los e.commerce son también plataformas web que tienen las funcionalidades de compra, de agregar productos al carrito, de pago online. Sus características son un poco diferentes porque tienen unos requisitos técnicos bastante más complejos que la web personal o de portafolio. Así mismo, tienen bastante mantenimiento detrás para que este e.commerce funcione como tal, ya que deberá encastrarse a la estructura logística de una empresa o emprendimiento.

Redes sociales

Las redes sociales (los Facebook, los Instagram, los Tumblr, los Linkedin, etc) también son webs técnicamente hablando. Su estructura funciona basada en código html que se sube a la red y en cuanto a estructura visual responden a las mismas directrices que una web personal o que una web e.commerce, esto es, cuentan con encabezado y pie que constituye la estructura básica fundamental de todo el site.

Sin embargo, como te podrás imaginar, tienen algunas diferencias que las hacen bastante particulares.

• Tienen siempre un acceso de usuario (sin tener cuenta no puedes entrar ni navegar)
• Los usuarios crean el contenido y lo comparten entre ellos (no viene dado por la plataforma, más que la información legal o similar)
• Cuentan con aplicaciones que les agregan funcionalidades
• Están plagadas de anuncios
• Parecen más canales de noticias (y de cotilleos) que otra cosa.

Acepto expresamente que apuntándome y enviando mi email, los datos personales facilitados pasarán a formar parte de un tratamiento de datos del que es responsable RUIZ STINGA STUDIO de acuerdo con el Reglamento General de Protección de Datos, con el fin de suscribirse a nuestra newsletter. La base jurídica para este tratamiento reside en su consentimiento. Los datos se mantendrán hasta que nos haga llegar su voluntad de darse de baja en cualquier momento. Le recordamos que puede ejercer los derechos de acceso, rectificación, supresión de sus datos, así como otros derechos y ampliar esta información en nuestra Política de Privacidad.

De estas tres tipologías de proyectos web podemos inferir una serie de conclusiones que nos sirven para entender de qué va la experiencia de usuario (UX: user experience, según sus siglas en inglés):

1. Marco del contenido siempre igual

Puedes observar que todas las webs tienen un encabezado y un pie que son el mismo a lo largo de todas las paginas. En este encabezado y en este pie se ubican los menús fundamentales desde donde podrás acceder al contenido. El estudio de la experiencia de usuario determinará la manera más lógica de ubicarlos, así como los nombres de los menús.

2. Funcionalidades destacadas por su importancia con la interacción

En el caso de webs en que se te requiere que entres a tu cuenta, esta funcionalidad está ubicada en un sitio fácil de encontrar, generalmente acompañada de un color que la haga llamativa o de un icono que permita que la veamos a primera vista.

3. Botones CTA (call to action)

Una parte importante de la experiencia de usuario consiste en que este haga aquello que queremos que haga. Para ello hoy contamos con las métricas de Google, que todo lo cuantifican, y nos permiten diseñar, probar, medir y rectificar si es necesario.

Los botones CTA son los botones que nos impulsan a la acción, los que dicen claramente toca aquí para (descargar, dejar tu email, acceder a contenido, participar en un sorteo, etcétera). Visualmente son elementos que destacan por encima del resto del contenido ya que son generalmente muy llamativos y bonitos. Su mensaje suele ser directo, claro y en la mayoría de casos, hay una gran recompensa por interactuar con ellos (una descarga, un contenido valioso, un tutorial, un whitepaper, un lead magnet).

4. Los iconos han venido para quedarse

Desde que la web es cada vez más líquida y responsive, los iconos han vivido su agosto. Hace ya un tiempo que han venido para quedarse y ya pueden descargarse gratuitos o de pago. Los iconos son esos atajos visuales que me indican qué puedo hacer allí donde hago click. Podemos decir que nacieron con Apple, y no estaríamos alejados de la verdad, pero el auge que han experimentado se explica por el propio sentido de la web en sí. Una web tiene una funcionalidad concreta, nadie mira una web para pasar el rato ni para leer algo. A un sitio web entro porque me interesa lo que ofrecen, porque me informo o porque estoy en medio de una decisión de compra. Las webs son elementos operativos, que tienen que tener un plus de utilidad para que sean visitadas con frecuencia. En este contexto es que los iconos han florecido, porque señalan el camino y aquello que voy a encontrar de manera intuitiva.

El diseño web ha evolucionado desde la versión inicial que consistía en pasar tu comunicación unilateral al mundo online hasta lo que hoy día encontramos. En su evolución ha tenido que refinarse y adaptarse al usuario. Así mismo, el usuario ha madurado y ya puede saber qué es un link y diferenciar un botón de un texto por el diseño visual que proponemos. La experiencia de usuario va de usuarios y está, por tanto, en contante evolución.

Este post forma parte de la serie Los 10 básicos en comunicación visual porque cuando tu profesión es tu vocación, como es mi caso, estás atado a ella porque ella te llama una y otra vez. Es mi forma de rendir homenaje al diseño, a la creación visual y a todos los diseñadores y creadores visuales que hacemos el mundo más alegre y más bonito.

Comunica para visibilizar tu proyecto

NUESTRO PORTAFOLIO