Tag Archives: colores

Evaluación teórica a libro abierto

SINOPSIS

La consigna de la evaluación teórica consiste en el análisis de espacios-interfaces en Internet. Para la realización de esta actividad escogí el sitio de internet NEO DG.  Esta página pertenece a un estudio de diseño gráfico argentino. Si bien realiza trabajos de diseño gráfico en general se especializa en motion graphic.

A  simple vista se puede percibir el uso de una retícula que cuenta con 18 módulos, todos del mismo tamaño. En cada uno de ellos hay una imagen que pertenece a trabajos realizados por el estudio. También cuenta con un menú en el sector superior derecho, que te dirige a diferentes secciones de la página. El hecho de que tenga una grilla tan marcada y perceptible hace que la página sea muy clara y simple de recorrer y navegar. Algo que a simple vista llama la atención es que a pesar de encontrarse ubicado en Buenos Aires todos los textos estan en español y también en inglés, ya que posee clientes del exterior.

ANÁLISIS DE DIMENSIONES INTERDEPENDIENTES SOCIAL Y COMUNICACIONAL

La importancia del desarrollo de una buena interfaz radica en el hecho de que hace posible la acción eficaz,  simplifica el uso del ordenador a partir de la utilización de metáforas visuales por medio de la interfaz gráfica de usuario. Es la encargada de permitir la conexión entre tres elementos tan heterogéneos como son: el usuario, el objetivo de una acción y un artefacto que es el que necesita el agente para llevar a cabo dicha acción. La interfaz no es un objeto sino un espacio en el que se da la interacción entre el cuerpo humano, la herramienta –  entendida como artefacto comunicativo- y el objeto de la acción. Es fundamental que el usuario comprenda la mecánica operativa que el sitio propone (sintaxis, órdenes, códigos, abreviaturas, iconos, etc.). El diseño de una buena interfaz demanda poco esfuerzo por parte del usuario, otrogando simplicidad y funcionalidad.

cuadro 1

Diagrama ontológico del diseño propuesto por Bonsiepe

Presentación de las diferentes secciones dentro de la página NEO DG 

-RELACIÓN CONTENIDO-MENSAJE

Si bien cualquier persona tiene acceso a este sitio, el mismo está especialmente dirigido tanto a personas interesadas en el diseño gráfico como también a posibles futuros clientes. En esta página se expone información del estudio,  de los trabajos realizados, de los directores creativos, de los clientes más importantes para los que trabajan y también sobre las posibilidades de contacto. No sólo aparece la dirección, el teléfono y el correo electrónico sino también la posibilidad de comunicarse a través de las redes sociales.

-INTERFAZ GRÁFICA

Cuenta con un alto valor expresivo y estético, no presenta datos irrelevantes así como tampoco elementos decorativos que puedan confundir al usuario. Se percibe como un sitio simple, claro y consistente cuyas jerarquías están claramente diferenciadas.

Esta página se organiza en una grilla modular que es limpia y sencilla, propone un orden sistematizado que ayuda a distinguir los diversos tipos de información y facilita la navegación del usuario a través de la página. Cuenta con 18 módulos, todos de las mismas dimensiones, que contienen imágenes de trabajos realizados por los diseñadores del estudio dispuesto a modo de mosaico. El texto aparece como apoyo de la imagen, colocándolo en una segunda jerarquía debido a que al ser un estudio de diseño prevalece lo visual por sobre lo escrito. Creo que es pertinente el uso de módulos ya que la página cuenta con gran cantidad de imágenes y ayuda a dar cuenta de la variedad y cantidad de trabajos realizados, otorgándole, desde lo visual, la misma importancia a todos sus trabajos.

1

Grilla modular de 18 módulos, utilizada para presentar los trabajos realizados por el estudio

Tanto el fondo como la barra contenedora del menú y el logotipo aparecen con valores tonales monocromáticos. El color se reserva para las imágenes que aparecen, los hipertextos del menú y el logotipo. Los colores son llamativos, atractivos y generan pregnancia en el usuario. Predominan los colores como magenta, cian y amarillo (estos colores aparecen en las imágenes de los trabajos realizados)

2

Barra contendora del logo y el menú

colores

Colores utilizados en las imágenes de sus trabajos que se presentan en el sitio

Se eligió una tipografía de palo seco que resulta legible debido a que se utiliza en tamaños que se leen bien en el monitor y colores adecuados. Maneja bien los contrastes utilizando un fondo gris y textos en colores claros como el cian y el blanco. También hace uso de las variables que posee la fuente elegida, variables de peso utilizadas en títulos o partes de textos con el fin de destacarlos.

tipografia

Diseño tipográfico

La web es consistente y utiliza los mismos mecanismos para realizar acciones similares. Esto ayuda a que el usuario comprenda fácilmente el funcionamiento de este sitio. A su vez, las metáforas utilizadas son claras.

En conclusión, el uso de los colores, imágenes pregnantes, el buen manejo tipográfico y la estructura de la misma hacen de esta página una web que cuenta con gran impacto visual y un alto valor estético que llaman la atención del usuario pero que no sólo se queda en eso sino que plantea una buena usabilidad de la misma.

– ASPECTOS VINCULADO A LA NAVEGACIÓN Y ORIENTACIÓN ESPACIAL

El sitio posee una navegación clara, concisa y consistente que le permite al usuario navegarlo y recorrerlo fácilmente. El usuario puede tener una idea del contenido del sitio previamente a visitar las secciones. Otro acierto es que cuenta con la opción de volver a la página de inicio rápidamente, es sencillo ir a este punto desde cualquier parte del sitio, también cuenta con botones que nos permiten subir una vez que se llegó al final de la página evitándonos tener que desplazarnos nuevamente hacia arriba. Desde mi punto de vista la única cuestión que no es suficientemente clara y que puede resultar confusa para el usuario es el tratamiento y diseño exactamente igual de todas las secciones del sitio. Utilizando el mismo color de fondo, igual manejo tipográfico y la misma distribución de los elementos (ubicación de las imágenes, títulos y textos). Siendo el contenido de las imágenes lo único que presentan una modificación, ya que cada división va acompañada de imágenes que varían de acuerdo al tema que se está exponiendo. Pero, a mi entender, para lograr percibir qué sectores de la página ya han sido visitados no resulta suficiente sólo con el cambio de las imágenes. Esta elección presenta cuestiones a favor y otras en contra. Por un lado, puede tornarse un diseño demasiado repetitivo pero a su vez se plantea una coherencia del sitio que se respeta en todas las subdivisiones de la web.

navegabilidad

Navegabilidad del sitio

botones

Botones para cerrar, pasar, subir y volver al inicio

La página presenta un sistema de navegación de tipo lineal con jerarquías. En este tipo de estructura los temas y subtemas están organizados de una forma jerárquica, pero a su vez también se puede leer todo el contenido de una forma lineal, si así se desea. Esto permite organizar el contenido de manera jerárquica y también poder acceder a la información de una manera lineal.

 cuadro 2

Estructura del sistema de navegación lineal con jerarquía

BOSQUEJO DE LA ESTRUCTURA DEL SITIO

imagenes portada

Estructura que presenta la página web


SITIOS CONSULTADOS

http://www.hipertexto.info/documentos/interfaz.htm

https://mediostamayo.files.wordpress.com/2012/08/interfase-bonsiepe.pdf

http://www.iua.upf.es/formats/formats1/a01et.htm

http://www.webestilo.com/guia/estruct2.php3