Miércoles, 11 Noviembre 2015 00:00

Diseño de Interfaces Web: Algunas pautas básicas

Valora este artículo
(3 votos)

Cabezal artículo diseño de interfaces web

Diseñando una interfaz de usuario (web)

El diseñador web debe entender las reglas básicas sobre cómo diseñar un interfaz de usuario (UI); principalmente, saber que las necesidades de éste deben ser las impulsoras de todas las decisiones del diseño, de forma que le permitan cumplir la tarea con eficiencia, y disfrutar de la experiencia (UX).

Dirigido a estudiantes que toman primer contacto con el diseño de interfaces gráficas, este artículo tiene como objetivo servir de guía básica al momento de crear o modificar una interfaz de usuario, especialmente, interfaces gráficas para sitios web, para lo cual debemos recordar siempre que, para que una interfaz de gráfica cumpla con sus funciones eficiente y consistentemente, debe responder rápida e intuitivamente a las exigencias de sus usuarios, sin olvidar con esto los aspectos gráficos de la misma.

Veamos entonces los siguientes puntos:

  1. La experiencia de usuario
      Antes de comenzar la tarea debemos preguntarnos detalladamente cuáles serán los objetivos de nuestro nuevo diseño de interfaz, identificando que características queremos conservar, cuáles eliminar, y cuáles corregir en el actual diseño, en función a parámetros estéticos, funcionales, comerciales, etc.
  2. El diseño sencillo
      Una vez identificados los parámetros mencionados más arriba, entendamos que el replanteo del diseño de interfaz de un sitio debe responder a características funcionales, lo que implica, además de los objetivos, conocer la información que será publicada en el mismo a fin de mejorar las estructuras de enlaces, íconos, barras de menú, y demás elementos de navegación que contendrá nuestra página. Para esto, debe considerarse la construcción de un esquema previo conteniendo los elementos y características absoluta y fundamentalmente necesarias. El agregado de nuevos elementos y características deben responder a motivos previamente justificados, en respuesta a preguntas tales como:
      1. ¿El nuevo elemento tiene un propósito definido?
      2. ¿Mejorará en algún sentido la experiencia del usuario?
      En el diseño de una UI exitosa habitualmente se cumple la regla de menos es más.
  3. Diseño familiar para el usuario
      Excepto que se quiera buscar un impacto directo en tal sentido, ofrecerle al usuario la sensación de haber usado antes la nueva interfaz, o una sensación de comodidad y familiaridad con la misma facilita en mucho su UX, facilitando su permanencia y retorno a nuestro sitio gracias a una experiencia de usuario positiva, evitándole grandes curvas de aprendizaje de uso con la misma. Nuestro diseño debe comportarse de forma intuitiva y predecible para cumplir cabalmente con los criterios de usabilidad.
  4. Colores, íconos y etiquetas
      Si bien los íconos y colores deberían responder a cuestiones semióticas en una interfaz gráfica bien desarrollada, no debemos asumir que el usuario entenderá el significado de éstos, a menos que se trate de códigos universalmente utilizados y conocidos, entendiendo como “universalmente”, por lo menos, al universo conformado por el público objetivo del sitio con el que estemos trabajando. La introducción de nuevos colores o imágenes con significados específicos pueden resultar confusos para el usuario sin el uso de etiquetas que apoyen estos significados.
  5. Jerarquías visuales y formales
      Todo nuevo diseño de una interfaz gráfica conlleva un análisis de jerarquías visuales, las que determinarán en gran parte la estructura gráfica de nuestro trabajo, en función de las cuales planificaremos y estructuraremos las diferentes páginas y secciones de nuestro sitio con el fin de mejorar la experiencia de usuario, facilitando el uso y accesibilidad a los datos de nuestro sitio; en éste último caso a través, por ejemplo, del uso correcto de etiquetas en nuestros códigos (web semántica). Visualmente, cualquier cambio en el color, iconografías, disposición de los elementos, etc. deben responder a una necesidad previamente analizada.
  6. La consistencia en el diseño
      Basados en cada uno de los puntos arriba mencionados, y varios más no incluidos en este artículo, debemos mantener la consistencia en el diseño de todo nuestro sitio (o cualquier otro diseño que implique el desarrollo de una interfaz de usuario), lo que le permitirá a nuestros visitantes un uso fácil e intuitivo que le permita centrarse en su propósito, sin distraerse en en nuestro trabajo, el cual no debe interferir con la experiencia de usuario. Los colores, barras de navegación, botones y otros enlaces, la disposición de los datos y demás elementos de nuestra UI deben permanecer constantes y coherentes con la función que se ha dado a cada uno, y si cambian, como dijimos en el punto anterior, debe tratarse de cambios que respondan a condiciones precisas que así lo requieran.
  7. Gráficamente atractivo
      Aunque el aspecto gráfico de un sitio, y de toda interfaz gráfica, debe responder a cuestiones funcionales, no significa que este aspecto deba descuidarse en ningún sentido, ya que no solo formará parte de la UX, sino que, en la mayoría de los casos será parte fundamental, al primera, de su conjuntos de experiencias con nuestro diseño.
  8. Conclusiones finales
      Cada caso tendrá una solución diferente y específica para la cual no existen reglas fijas ni sencillas necesariamente, sino que, además, en cada caso unas soluciones pueden interferir con otras, en cuyo caso la experiencia personal (o del equipo de trabajo) conjuntamente con evaluaciones junto a usuarios reales nos ayudarán a resolver esos conflictos. Una vez resueltos los problemas funcionales entran en marcha los factores estéticos de nuestro diseño (diseño gráfico), los cuales no deben ser descuidados en ningún sentido ya que serán los apoyos visuales que tendremos para mejorar la experiencia de quienes visiten, en este caso, nuestro sitio web.

Saludos para todos!
Plácido Luna

Nota importante: Este material forma parte de los contenidos de los cursos de diseño web en el Campus Virtual de Formación Gráfica (CVFG) donde se encuentra actualizado frecuentemente.

Inspirado en el artículo original
How To Design A Great User Interface

 

Visto 1822 veces Modificado por última vez en Sábado, 03 Junio 2017 11:43