Como parte del proyecto de diseño integral que estamos llevando adelante para nuestro cliente Laboratorios Rapela, se encuentra el diseño de señalética de las instalaciones.

Para ello se partió del rediseño de los pictogramas que identificaron los diferentes departamentos de la firma, dándoles una reinterpretación y gráfica más limpia, acorde también al rediseño institucional y rediseño de web que estamos finalizando.

Los pictogramas resultantes, centran la propuesta en la interrelación de elementos en negativo, vinculados con formas en positivo que tienen que ver obviamente con la actividad puntual. El desafío fue poder establecer un complemento entre figura/fondo armónicos, con sentido y criterio estético acorde.

En la aplicación web, se agregó volumetría a los íconos, para que estos se vean más corpóreos y atractivos.

Estaremos publicando el sistema de señalética más completo en breve, que se desprende de la paleta cromática de éstos, y el repertorio formal que se exponen en este post.

Eduardo Cesario

El desafío del diseñador que entre al ring del diseño con estándares, no sólo será hacer algo de calidad visual única.

Una vez que está armado el prototipo donde se va a fundar el nuevo sitio web, viene la parte más odiosa y que algunos no llegan a soportar: el testeo cross-browser, o hablando en criollo, la prueba del prototipo en los navegadores más populares del mercado.

Lamentablemente, Microsoft sigue manteniendo entronizado al Internet Explorer. Por qué lamentablemente? Porque esta repleto de bugs e inconsistencias con los estándares.

Como si esto fuera poco, Safari y Chrome, son los nuevos contendientes que vienen siguiendo la línea de Firefox (el más confiable y fiel navegador web que conozco). 

De ahí que en mi caso, trabajando en Mac OSX, tengo virtualizado un Windows XP, donde utilizo alguna herramienta para previsualizar en varios Explorer al mismo tiempo, como por ejemplo, Multiple IE. Este es un dato no menor, ya que Windows no deja tener instaladas de manera nativa varias versiones del Internet Explorer.

Si bien cada browser reinterpreta las reglas de juego a su manera, en esta captura de pantalla recortada a manera de mosaico, les muestro como un diseño que se ajusta a estándares y se ha testeado extensivamente en diferentes browsers y plataformas, es consistente y sustentable, es decir, a prueba de browsers rebeldes. En el caso de Internet Explorer 6, es una buena práctica incorporar algun IF con ciertos estilos para arreglar algunas falencias, ya que el ideal que sostuve mucho tiempo de usar un solo stylesheet para todos los browsers, se va desintegrando lentamente, a medida que salen nuevos navegadores.

Como escribí en el post anterior , en lo personal creo que es una muy buena práctica, con el tiempo, poder escribir el código directamente, e ir testeando. Ahorra muchísimo tiempo de debugging en los diferentes navegadores.

El caso de estudio presentado aquí, es el sitio web de L.A.Y.D.E., Laboratorio de Análisis y Diagnóstico Etiológico, que estará online muy pronto.

Eduardo Cesario

Quien hubiera dicho que un diseñador gráfico se vería complacido en tipear, si, tipear, el código de un sitio en vez de usar alguna interface o software preparados para tal fin?

Sinceramente, yo nunca lo pensé. Ahora, si hoy en día me preguntan si lo hago, y si, la verdad es que me es mucho más práctico y ahorra problemas, a pesar de que siempre preferí usar interfases mucho más didácticas.

Cuando comencé a diseñar basándome en estándares y usabilidad, allá por el 2005, esa tarea me parecía monumental, inalcanzable, inaccesible… buscaba siempre aplicaciones que auxiliaran a mi ojo, entrenado esencialmente en lo visual. Conviví con el Dreamweaver (por aquella época Macromedia Dreamweaver), luchando con versiones viejas menos preparadas a la correcta pre-visualización de Cascade Style Sheets…

A mediados del año pasado, sin darme cuenta, estaba usando el Smultron (el mejor editor de texto para mac, a menos para su seguro servidor), y tipeando la mayoría del código de la plantilla que estaba desarrollando "a mano".

Llegué a este punto gracias a una gran virtud que nos da el trabajar con CCS y xhtml strict: el poder de abstracción. Usualmente, dibujo un layout modelo al cual quiero llegar, y armo un anteproyecto (lo más parecido a lo que pretendo diseñar en la realidad del código), y ahí distribuyo en divs y secciones las partes del diseño.

Luego voy abriendo y cerrando los tags, todo tipeado. Esto me permite aprovechar las siguentes ventajas:

1. Errores de validación casi nulos: es muy difícil que tipee algún tag incorrecto, o que complique mucho el código (esto en general es hecho por los distintos programas destinados a diseño web, ya que deducen donde incia y terminan los tags, y muchas veces por cerrar alguno que quedo abierto, lo hacen mal).
2. Simplificación de la estructura: al uno estar desarrollando palmo a palmo el código, tiende a que éste sea lo menos complejo posible (por comodidad, prolijidad, etc).
3. Orden en la estructuración del contenido y sus propiedades: voy asignando las clases y selectores a medida que voy ingresando el código, a pesar que estos aún no existen (la hoja de estilos es el siguiente paso).
4. Coherencia entre la hoja de estilos y el código: ya que baso todo el trabajo de CSS en el código previamente concebido. Esto deriva en no tener miles de clases y estilos que se han dejado de usar porque se cambió la estructura del código, pasando a ser inútiles, ya que es raro que éste cambie en su esencia una vez que ha sido estructurado.

Lógicamente, reconozco que para llegar a este nivel de geekeada (si se me permite el neologismo), se requiere un poco de experiencia en el tema. En mi caso, el mismo camino me fue llevando a adoptar esta modalidad de trabajo. No digo que sea la única, ni mucho menos la "correcta", pero me pareció interesante compartir la experiencia. Sería interesante conocer opiniones de colegas que por casualidad lleguen a este blog…

Saludos y feliz 2010!

Eduardo Cesario

PD: quédense tranquilos, si me copio el DOCTYPE con copy paste del Dreamweaver!

La tradición ya me lleva a tener que revivir este espacio, que según las demandas personales, creativas, laborales y otras yerbas, suele ser víctima de abandono. Se silencia un canal de comunicación que me gusta mucho poder usar, pero que las circunstancias suelen convertir en fusible, es lo que resigno.

Ahi empiezan a aparecer las señales de ese forzoso abandono…

Primer síntoma: las visitas al sitio del estudio bajan a la mitad.

Segundo síntoma: taponar una via de expresión que a veces es más que gratificante, si bien la mayoría de los que visitan este blog, no comentan (un mal generalizado, del cual soy víctima también).

Entonces la situación vuelve a cero, y acá es donde vienen los problemas de tener un blog:

1. tener algo que decir,
2. tener el tiempo para prepararlo,
3. herradicar la autocensura,
4. y por supuesto, tener las ganas de publicarlo.

Entonces, por hoy, cumplo con los pasos 3 y 4, el blog esta vivo nuevamente.

Saludos!

Eduardo Cesario

Como sabrán los que leen el blog, hace unos años comenzamos a diseñar distintas piezas para la Escuela de Fotografía Motivarte.

Desde un principio, los trabajos de diseño fueron coordinados directamente con Jonas Papier, Director de la institución.

Entre las piezas diseñadas a lo largo de este tiempo, se destacan algunas que comenzaron a dar una pauta sobre cual es la propuesta de diseño que el estudio planteó para la Escuela:

• El sistema de señalética que actualmente se usa en la escuela.
• La gigantografía [f6] (Diafragma Loco).
• Diplomas de cursos y carrera.
• Isologotipo de los 15 años de la Escuela.
• Diferentes diseños de afiches para vía pública y campañas.

Pero si hay un conjunto de piezas que redondea de manera inmejorable la nueva propuesta visual planteada por CCS, esas piezas son sin lugar a dudas, la folletería institucional que acaba de ver la luz hace pocos días, y después de un no menor proceso de diseño y selección de material a ser incluído en los folletos.

Sintetizando el concepto, se apostó a un color muy potente para cada departamento de la escuela: Cursos Básicos, Cursos Avanzados y Carrera de Fotógrafo Profesional. El lenguaje y técnica de representación, si bien se basa en trabajo vectorial sobre fotografías, excede al registro fotográfico para presentar un trabajo más dinámico y moderno. La apuesta cromática es fuerte, y también se ha desestructurado la tipografía del logotipo en 3 líneas, para darle más movimiento y juventud.

La selección del material fotográfico presente en el interior de los folletos, estuvo a cargo de Jonas Papier. Yo también pude seleccionar material producido por alumnos que tuve en el primer cuatrimestre del 2009, en la materia que dicto en la escuela, Diseño y Percepción de la imagen. Aprovecho este medio para agradecer a los alumnos Justina Luguercho Grobas, Karen Vinueza, Ana Maidana y Santiago García (ex alumno del 2008), por la buena predisposición para poder utilizar su obra fotográfica en el trabajo, ha sido un placer, realmente, contar con excelentes fotografías y trabajos de su creación.

Espero que disfruten los folletos, podrán verlos si pasan por la Escuela.

Saludos!

Eduardo Cesario

Algunas fotografías que tomamos en el estudio, sobre el diseño de imagen corporativa que creamos para CSW Solutions.

Eduardo Cesario

Estuve trabajando en estas piezas hace un tiempo ya, pero finalmente verán la luz! La Nueva Folletería para la Escuela de Fotografía Motivarte, consiste en un tríptico institucional, y 3 separatas o dípticos para cada gran área de enseñanza de la institución educativa.

De más está aclarar a estas alturas, que me han dejado trabajar con muchísima libertad, y podrán ver muchos de mis vicios plasmados en papel .

Para cada díptico se asignó un color identificatorio, y de esta forma poder abrir el sistema corporativo (muy atado a los colores naranja, blanco y negro) que la escuela viene usando hace años. La intención es dar una identidad propia a todos los departamentos educacionales de la escuela, para a futuro, construir una imagen más propia, coherente y no tan cerrada.

En breve estarán disponible en la Escuela, por ahora dejo un adelanto chiquito de mi neurosis gráfica.

Eduardo Cesario

Este proyecto fue apasionante desde el comienzo, ya que una de las más grandes satisfacciones personales, es cuando a uno lo dejan trabajar y diseñar con libertad. The Music Store , de Carlos Sterni, es una tienda especializada en música (hay de todo, pero sin dudas van a encontrar títulos pocos convencionales). El valor agregado de esta tienda es la calidad de atención, la personalización y la responsabilidad en la venta de música, rubro que ha quedado en manos de cadenas que no ofrecen casi ninguno de estos atributos.

Nosotros diseñamos la identidad de la marca hace unos años, y al tiempo lanzamos la primer versión del website, montada en SilverStripe. Pero dadas las limitaciones con las que nos topamos en cierto punto, propusimos a nuestro cliente cambiar la estructura del sitio, y a apoyarla en una base mucho más robusta en cuanto al manejo de títulos, productos y demás.

Para ello readaptamos (pulimos y mejoramos también) el diseño original. Luego de un período de prueba, oficializamos el relanzamiento de la web , con más de 1000 artículos que podrán consultar.

Espero sea de vuestro agrado.

Eduardo Cesario

Iba a comenzar estas breves líneas con la frase “Ayudándome del entorno para crear”, pero no quería que la frase suene pretenciosa. A veces, creo que “creo”, otras quizás sólo concreto ideas en algo gráficamente atractivo. Meterme en la filosófica tarea de desentrañar diferencias entre crear y diseñar, no es la idea de lo que quería compartir, y sin dudas requeriría de un estudio e investigación mucho más fundada que la simple experiencia de su seguro servidor.
La situación concreta que el diseñador enfrenta a la hora de diseñar, es justamente contar de ciertas musas inspiradoras, mas allá de conceptos que justifiquen o avalen la tarea. Es sabido que el diseño, como actividad proyectual (así enseñado en la Universidad de Buenos Aires), se sirve de conceptos e ideas que apoyan lo estético/gráfico/expresivo. De la profundidad de la idea, o su originalidad, se sustenta (con suerte) el diseño, y es el aliado ideal para poder exponer los por qué de lo que hacemos.
Si bien esta parte de la historia es importante, y conocida por cualquier persona que haya estudiado o esté estudiando una carrera de las denominadas “Proyectuales” (Arquitectura, y los diferentes sabores del diseño), hay más ingredientes que suelen ayudarme a la hora de abordar cualquier proyecto creativo.

• Sobre el entorno general: buscar que parte del día es la que genera mejor clima y predisposición para trabajar (durante el día, con luz de sol, de noche, etc.). Esto suele variar, muchas veces por las propias reflexiones internas.
• Luego la historia continua optando por un soporte más “sensible” para bocetar, yo suelo usar hojas 35×50 de dibujo, o algún block para dibujar. Esto descontractura la relación hombre-máquina. Muchos diseños terminan siendo basura por sentarse directamente en la computadora a diseñar.
• Instrumentos para realizar la puesta o el boceto: dependiendo el grado de libertad, tratar siempre de escapar al tradicional portaminas y buscar pinceles, plumas, etc.
• Buscar información sensorial que pueda nutrir el proyecto: si hay algún género musical que “ilustre” el concepto en cuanto a sensaciones, está bueno dejarse influenciar por el sentido del oído, aunque más no sea inconcientemente. Eso de alguna forma u otra se plasma en el trabajo.
• Si hay información sensorial “pertinente”, investigar sobre ella y tratar de aplicarla durante el proceso de bocetado y diseño.
• Por último, muchas veces ocurre que el pensar tanto en el fin, contractura el proceso creativo: el no ponerse un límite a la hora del boceto o la concepción de un original, suele ser más fructífero que el acotarse al fin mismo. Traducido, si hay que usar más hojas para pruebas y pruebas, hacerlo.

Estan han sido unas notas que espero sirvan a mejorar sus experiencias “creativas”.

Eduardo Cesario