Tag Archives: tipografía

Proyecto nº 2

El proyecto fue realizado con mi compañero Adrián Mingarini. La consigna era representar graficamente un capítulo del libro ‘Es mi tipo’.  El capítulo era asignado por el jtp,  a nosotros no tocó el capítulo 18 ‘rompiendo las reglas’.

panel

Panel tipográfico

Avances realizados para la segunda corrección del tp nº3.

Mi intención es reflejar el concepto de (en)tramado no sólo a partir de las imágenes seleccionadas de mi trabajo realizado en el tp1 sino que también mediante la composición de los elementos dentro del panel.

Decidí trabajar con los colores rojo, amarillo, naranja y blanco que fueron los colores que usé para el modelado 3d en el tp1. Utilicé la tipografía bebas y trabajé con diferentes variables de peso (bold, regular, book y light). A su vez usé recuadros para destacar algunas cosas. Utilicé tanto imágenes a color como en blanco y negro.

2da. claseBIS-01

Primer panel realizado

Tipografía e imagen

Para realizar el trabajo práctico el jtp nos asignó una imagen que perteneciera a una vanguardia o movimiento y nosotros debíamos realizar una composición tipográfica que la refleje. La elección de la tipografía, los colores y la ubicación de la tipografía era una decisión que debíamos tomar nosotros a partir del análisis de la vanguardia.

El jtp me asignó la imagen “Explosión” de Roy Lichtenstein del movimiento Pop art

Explosion 1965-6 by Roy Lichtenstein 1923-1997

Imagen asignada: “Explosión” Roy Lichtenstein, 1965

explosion

Adaptación realizado por mi

Periódico ‘dsñ’

Proyecto realizado para la materia Tipografía II. Este trabajo fue realizado en grupos de a dos. En mi caso trabajé junto a Adrián Mingarini.

Es un periódico semanal que contiene información que va dirigida a los alumnos de las carreras de arquitectura, diseño en comunicación visual y diseño industrial.

El formato propuesto por la cátedra era de 28 x 41 cm. Para acomodar la información realizamos una grilla de 4 columnas.

2-02

Tapa del periódico dsñ

1-01

Interior del periódico dsñ

3-01

Interior del periódico dsñ

4-01

Interior del periódico dsñ: nota central

6-01

Interior del periódico dsñ: entrevista y otras noticias

7-02

Contratapa del periódico dsñ, contiene una agenda cultural

detalles-03

Detalles

Revista de interés general

Esta revista fue el proyecto final de la materia Taller de Diseño III de la cátedra de Gorodischer.

“Proyectar es, en principio, una intención de alcanzar un mundo mejor, un mundo idealizado, utópico, un mundo que lamentablemente hoy no tenemos pero que tenemos la convicción de alcanzar. Será a partir de buenas acciones y esfuerzo que intentaremos construir un nuevo mundo ideal. Es posible ver la realidad con positivismo porque estamos a tiempo de cambiar y porque hay muchas cosas buenas que se hacen y que se pueden hacer para mejorar, para vivir mejor. Es nuestra intención proyectar un mundo idealizado que se presenta como alternativo al mundo realmente existente para trabajar con ese objetivo en mente. Proyectar se sustenta sobre todo en un rechazo de la realidad que nos rodea porque basicamente estamos descontentos con el mundo actual, con la realidad que nos circunda y, fundamentalmente, porque soñamos y confiamos en que se puede proyectar un futuro, trabajar para alcanzarlo y disfrutar de la satisfacción de haberlo conseguido, aunque para lograrlo se requiera romper con algunos esquemas.”

1

Tapa de la revista

rev1-01

Editorial de la revista 

rev2-01

Sumario de la revista

rev3-01

Variedades de la revista

image-0004

Contratapa de la revista 

revista-01

Desarrollo de alguna de las notas 

Experimentación con las tipografías

Trabajo práctico realizado para la materia Tipografía II. La consigna fue realizar una experimentación con las tipografías, mezclando una de palo seco y una con serif.  El contenido que se presentaba en estos soportes cuadrado debía ser una presentación de nosotros y ademas de esto diseñar una carta de presentación para cada tipografía elegida. En mi caso decidí trabajar con las tipografías Helvetica y Minion.

cuadrados tipo-01

Cuadrados contenedores de mi descripción 

006

007

Cartas de presentación de las tipografías: Helvética y Minion

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