Cuando empecé con esto del diseño web, allá por el año 1999, recuerdo bien la situación del diseño. Por aquel entonces, ya lo básico del lenguaje html había sido mostrado, y algunos se aventuraban a usar los, por entonces, poco compatilbes scripts en java para enriquecer la experiencia en los sitios (a mediados de los 90, en realidad).

A fines de dicha década, y con el boom de las .com en Argentina, cualquier empresa lanzaba su sitio web, por demás ambicioso, y con la tecnología en lo que hace a la funcionalidad y accesibilidad, ni por asomo comparable a lo que es hoy.

¿El resultado? muchas compañías invirtieron en una empresa que supusieron pagaría con ganancias muy pronto.

Error.

Sólo sobrevivieron las que realmente estaban dispuestas a soportar un mediano período de inversión a pérdida.

Es por ese tiempo, que el boom del diseño web era diseñar complejas interfases visuales diseñadas con Macromedia (snif) Flash.  Con la tecnología de banda ancha e internet a alta velocidad recien asomando (al menos en nuestro país), la mayoría de usuarios debían tolerar excesivos períodos de ´preload` de una introducción a un sitio web, que ni siquiera sabían si valía la pena navegar.

La paradoja termina siendo que hoy en día, ya entrados los 2000, este modelo de diseño complejo y demandante, ha dado paso a los sitios web centrados en contenidos, en la internet social, y en la usabilidad y accesibilidad al usuario final. Algo más impensado aún, es que el html vuelve con mucho más vigor que por aquel entonces, y la concientización sobre uso de estándares se hace mucho más presente en nuestros días. El javascript es mucho más estable y utilizado ampliamente. Los lenguajes de programación para web (php, ajax, ruby on rails) hacen al diseñador la vida más fácil, ya que podemos utilizar código que se obtiene libremente, para dar vida a nuestros sitios, ¡sin enloquecer!

Así, el escenario para nosotros los diseñadores, ha cambiado radicalmente, para mejor.

Continuará…

Eduardo Cesario

Me escribió Sigurd Magnusson, Chief Marketing Officer de SilverStripe , un atractivo CMS, para pedirme si podían realizar una adaptación de Organica Creativa para su producto.

"Realmente disfruto tu trabajo para  CSS Zen Garden (#188 Organica Creativa) y estaba pensando si nos darías permiso para adaptarlo a una plantilla (template) HTML código abierto, a ser usada con SilverStripe, un CMS código abierto, basado en PHP. Estamos buscando sólo templates de calidad sobresaliente, y el tuyo encaja perfectamente con nuestra busqueda, en mi opinión!"

Así es que tratándose de un proyecto open source, no dudé un segundo en dar el permiso para que el diseño siga expandiéndose por el mundo, nada más gratificante que a la gente le guste mi trabajo.  En breve habrá novedades sobre la adaptación a SilverStripe.

Eduardo Cesario

"La selección natural fue propuesta por Darwin como medio para explicar la evolución biológica. Esta explicación parte de dos premisas. La primera de ellas afirma que entre los descendientes de un organismo hay una variación aleatoria, no determinista, que es en parte heredable. La segunda premisa sostiene que esta variabilidad puede dar lugar a diferencias de supervivencia y de éxito reproductor, haciendo que algunas características de nueva aparición se puedan extender en la población. La acumulación de estos cambios a lo largo de las generaciones produciría todos los fenómenos evolutivos." (Wikipedia).

Quería escribir algo sobre el rediseño de logotipo que hicimos para CSW Solutions, y entonces me topé con la cantidad de variaciones y "adaptaciones" que sufrió la propuesta original del logotipo que había planteado en un principio.

Es así que tomé las numerosas versiones que fui preparando para mostrar a Ray Comas y Yoel Sommer, dueños de la firma. Cuando puse todas las muestras juntas, vino casi instantáneamente a mi memoria el concepto de "Seleccion Natural".

Recordé que Darwin había planteado esta idea para describir el proceso evolutivo en las especies. Y como podrán ver en la imagen superior, resulta un tanto análogo el proceso de creación de una marca:

Se puede ver como se partió de unos cuantos "individuos", principalmente 3 grupos. De esos grupos, al ir descendiendo, se ve como otros han "heredado" caracterísiticas de sus progenitores, siempre hablando en términos de diseño: tipografía, color, forma, configuración morfológica, para ser sintéticos.

A lo largo del proceso de diseño, adentrándonos en la "segunda generación", sobreviven básicamente dos subespecies. El color ha sido una constante (un gen) que se ha mantenido prácticamente inalterable a lo largo de la historia del diseño de la marca. Las formas orgánicas han primado por sobre otras estéticas más racionales, y es así que ya se va perfilando en el proceso evolutivo, la marca que será la identidad de la empresa.

En la tercera generación, vemos solamente los isologotipos que han sobrevivido a la evolución del logo: ya la carga genética ("diseñísitica") es muy clara: el color, tipogafía Futura, los rasgos formales y el concepto.

Me pareció particularmente interesante y didáctico, plantear como una analogía el proceso evolutivo de una especie, con el de un isologotipo. Y es que si prestamos atención y se nos permite llevar el proceso de diseño de manera ordenada, sin perder el toque de azar y ocurrencia que representa la creación de una marca, seguramente llegaremos a producir algo original y que preserve las mejores cualidades genéticas de sus ancestros.

Eduardo Cesario

El otro día repasaba un poco las cuestiones estéticas y de gráfica a la hora de diseñar. Inevitablemente (y también concientemente) el estilo que me identifica es el de colores saturados, contraste, mucho trabajo vectorial y orgánico sobre las formas.

Parecería que esta tendencia orgánica y saturada, sería irreconciliable con otras corrientes gráficas.

Es así que empecé a diseñar los isologotipos para KiteSpirit , un proyecto que pretende propulsar el Kitesurfing (un deporte relativamente nuevo, que hace convivir el surf, windsurf, wakeboard y demás deportes acuaticos) en el medio local.

Los conceptos o lineamientos generales fueron libertad, aire libre, naturaleza. Basándome en la idea de integridad, equilibrio con el medio ambiente y algunos rasgos de las otras palabras, arribe a un isologo globalizador de la propuesta.

A esta forma de diseñar, con formas claras, orgánicas y vectoriales, le faltaba algún aderezo gráfico para hacerlo convivir exactamente con la idea a comunicar, mejor dicho, con la estética que maneja el público surfer: estampados, fondos con texturas, tipografía rota, en síntesis, la famosa onda Grunge, impuesta en los 90's por el reconocido David Carson, en cuanto a lo visual, y un sinfín de bandas de rock (Nirvana, Pearl Jam, Soundgarden, etc).

Pese a que no es una de mis estéticas favoritas, me pareció más que pertinente incluirlo en el plan de diseño, con el fin de poder flexibilizar la propuesta gráfica con dos estéticas que suman desde dos lados completamente distintos.

Es así que decidí combinar los colores brillantes, formas planas y orgánicas, con suciedad, texturas y formas más anárquicas. El resultado: GRUNGE POP!

En principio, dos corrientes gráficas que me parecían completamente incompatibles, han sido puestas en común al servicio de un proyecto que requiere un toque novedoso sobre lo ya creado: si me hubiera limitado a seguir la tendencia existente en el mercado, hubiera decantado en un diseño prototípico, encasillado en lo ya existente.

Lo interesante en todo esto, es empezar a visualizar, que si bien uno no simpatiza con ciertas estéticas (como pasa con la música), eso no inhibe la posibilidad de integrarlas a trabajos que así lo requieran. 

Creemos como estudio que del fruto de la inspiración e investigación, se llegó a una identidad novedosa para este tipo de productos.

Eduardo Cesario

Cada vez que encaro un proyecto de diseño nuevo, es una oportunidad que se presenta para conocer las motivaciones y anhelos del cliente que tengo enfrente.

Soy un convencido (cada vez más) de que en la entrevista donde propongo y escucho a la otra parte, me visto un poco de Sigmund Freud (no literalmente, estoy lejos de tener un conocimiento profundo del psicoanálisis). Pero con los rudimentos que manejo sobre la teoría freudiana, la experiencia personal propia, y el camino recorrido como profesional, puedo permitirme el título de ¨psicoanalista de diseño gráfico¨.

Lo jugoso de la charla con el futuro comitente, es poder ir sondeando sus motivaciones, lo que más lo seduce e identifica, para así arribar a un ¨diagnóstico¨de la necesidad de diseño que es demandada.

Anoto primero detalles del proyecto, sigo buscando disparadores. Pregunto por color, sensaciones, ideas, conceptos, búsquedas, tipografías… Me permito asesorar, descartar cuestiones banales, orienar con la mejor predisposición, ser didáctico y explicar las cuestiones que tienen que ver con el diseño (y que muchas suelen ser dadas por sentadas). 

Las derivaciones son infinitas, y si uno tiene la capacidad de expadir la charla a lo más cotidiano, a la experiencia vivida, a ejemplificar y ser auténtico, y sobre todo, dejar primar la sinceridad profesional, el resultado puede ser sorprendente. Es que en el mercado en que nos movemos, no sólo es una ventaja competitiva el ser idóneo y profesional: saber escuchar al otro para ofrecerle una solución acorde, es uno de los pilares en los cuales se asienta la experiencia profesional.

La idea de compartir estas palabras es ni más ni menos que despertar nuestra conciencia profesional, pero de una forma más humana, y no tan circunscripta a nuestra actividad.

Eduardo Cesario

Siendo hoy el día 24 de Octubre, se celebra en Argentina el Día del Diseñador Gráfico. Un día como hoy, pero del año 1966, egresó el primer Diseñador Gráfico de la Universidad de Cuyo, en la querida Provincia de Mendoza.

Es así que se decidió institucionalizar esta fecha como el día destinando a honrar tan noble y sentida profesión

Saludos a todos los colegas

Eduardo Cesario 

Como todos los años, he recibido la cordial invitación de Bodegas Terras Gauda, para participar en el concurso anual de cartelismo ¨Francisco Mantecón¨ , que tiene lugar anualmente para honrar la obra que el artista produjo para esta bodega española.

Las veces anteriores no había podido dedicarle el tiempo que yo creo que merece este trabajo, donde deben primar la creatividad y calidad de la obra, es por eso que no había participado antes. Pero esta vez fue distinto, y me sedujo la idea, además de que el concurso por supuesto brinda un interesante premio y reconocimiento mundial.

Para producir la pieza:

1. Primero hice un relevamiento de la información correspondiente a las variedades de vinos a tener en cuenta como referencia para el afiche.
2. Tomé palabras o conceptos basado en la información: amplitud-equilibrio-ataque suave-envolvente.
3. Busqué elementos figurativos que complementen visualmente a esos conceptos: cristales, limón, lima, pomelo, azúcar, uvas.
4. Hice una lista de los colores que representaban las variedades de estos vinos: amarillo, naranja-rosado, verde, negro.

De esta etapa salieron numerosos bocetos, productos de la neurosis gráfica que me aqueja habitualmente.

Para plasmar la pieza final, me remití a mis recursos gráficos habituales: planos de color, formas orgánicas y colores saturados.

El toque final fue el adaptar elementos del lenguaje cubista al diseño, algo que terminó potenciando la pieza notablemente, y agregó además un dato de pertinencia en el lenguaje visual (y porque no, pertenencia) al cartel, ya que la bodega es española.

He aquí el resultado final: AMEBOGAUDAS.

Espero les haya gustado.

Eduardo Cesario 

La verdad es que estas últimas semanas fueron bastante movidas. Es por eso que este blog, paradójicamente, se ha mantenido en total quietud. Es así que se pasó el 1er aniversario de este modesto espacio de opinión, catarsis y deseo. Hace unos días vi en el blog de mi super-amiga Nani , un post que era una especie de "Grandes exitos" de sus posts (dicho sea de paso, el blog es una genialidad si quieren alegrar la rutina).

Inspirándome en su idea, como aún no pude redactar ningún contenido fresco, y mientras finalizo mi post sobre "Amebogaudas", he decidido refrescar algunos contenidos que fui incorporando a este espacio en el último año, y que me parece interesante recordar, para aquellos que quizás no leían el blog.

Para esta ocasión elegí artículos que se refieren a Filosofía del Diseño Gráfico, mejor dicho, la filosofía con que yo encaro la profesión y lo que la circunda. Espero leer muchísimas opiniones!

Emancipar el ego para disfrutar más diseñando

Larga discusión se produce casi a diario, sobre si el diseño es arte o no. Mi punto de vista es que el diseño gráfico ¨puro¨ no es arte, ya que hay un enfoque mucho más racional de un problema gráfico a comunicar, pretendiendo fines específicos (suministrados por nuestro cliente)….

La autocrítica irracional censura las ideas

Luego de algo más de un mes sin escribir nada, he decidido tocar un tema que viene rondando en mi mente hace unos cuantos días ya: el resultado de la autocrítica desmedida.

¿Cuál es el interés de hablar sobre esto, en un blog que trata temas más focalizados al diseño, artes o fotografía?

Para qué sirve una buena idea.

Siempre que se habla de ideas, particularmente en diseño gráfico, se busca llegar a lo inimitable y completamente original. Esos postulados nos llevan a una insondable búsqueda de "la idea", que le vuele la tapa de los cesos de los potenciales receptores.

Pensamientos mezclados sobre diseño gráfico: el estilo

Entre tanto parloteo, salió el tema del estilo: lo que nos define como profesionales y nos da cierta consistencia visual/conceptual en los trabajos. Yo le decía a Mik, que un "buen diseñador, es el que puede ponerse todos los trajes sin importar el proyecto a diseñar".

¿Podemos realmente ser esclavos de un estilo?

Eduardo Cesario

Larga discusión se produce casi a diario, sobre si el diseño es arte o no. Mi punto de vista es que el diseño gráfico ¨puro¨ no es arte, ya que hay un enfoque mucho más racional de un problema gráfico a comunicar, pretendiendo fines específicos (suministrados por nuestro cliente). Pero dado que el diseño suele, y debe nutrirse de muchas actividades y artes paralelas, lo que suele ocurrir es que de ese intercambio, nuestra actividad resulte impregnada de rasgos artísticos, entre ellos, el ego.

En general, la vida profesional ofrece al diseñador gráfico dedicado y creativo, el acceso a un ego importante. Muchas veces los mismos clientes nos ensalzan, diciéndonos cosas como ¨sos un artista¨ o ¨esto no es un afiche, sino una obra de arte¨. Esta experiencia es muy gratificante, siempre y cuando tengamos en consideración nuestro real lugar como profesionales.

Hay un lado de nuestra persona que definitivamente disfruta (lo cual no tiene nada de malo) del mote de artista. Sin embargo, ese costado hedonista y vanidoso, puede descontrolarse en situaciones donde no todo es color de rosa. Uno proyecta o concibe las ideas creativas en su mente, proceso que por lo general decanta en imágenes mentales. De allí, al boceto, del boceto al prototipo, y de ahí con suerte, a un producto terminado en un soporte digital que nos llena de orgullo.

El centro del problema se presenta de cuerpo entero cuando un cliente no gusta del trabajo, y eso nos hiere en lo más profundo de nuestro amor propio. Calma amigos, no se trata de vivir nuestra experiencia profesional como si fuésemos Salvador Dalí o Pablo Picasso. Somos comunicadores, que eventualmente en un futuro (o paralelamente) tengamos nuestra veta artística. Es fundamental poder aclarar el fin de nuestra actividad, y el tratar de complacer al comitente, siempre aportando puntos de vista profesionales en cuanto a la pieza que estamos creando.

Liberando la presión de envasar ego en packagings, logotipos o afiches, se consigue un poco más de paz mental, y lograr enfocarse en comunicar, si es con ¨arte¨, mucho mejor.

Eduardo Cesario 

Hoy en día en el universo de Internet, tener un blog no es novedad para nadie. Si bien hay muchos sitios o proveedores que brindan el servicio de blogs gratuitos, lo más interesante de la experiencia de tener uno, no es sólo poder compartir notas y artículos que me parecen interesantes, sino también hablar con su diseño. Para mi la experiencia de tener un blog es completa cuando más personal es el diseño de la interface de dicho sitio.

Claro está que todo este planeamiento es posible, siempre y cuando contemos con algunos conocimientos para llevar a cabo el diseño de la interfase:

1. Limitaciones Técnicas: es fundamental tener conocimiento en manejo de software para diseño web, tratamiento de imagen y armado de sitios. De esto surge la primer limitación, acaso la más fácil de resolver, que es la parte técnica y de aprendizaje de manejo de herramientas. Yo utilizo para armar un blog: Fireworks, Dreamweaver y algún programa de ftp.
2. Limitaciones Teórico/Conceptuales: a toda la cosmética y funcionalidad, es necesario sostenerla con una buena idea, que a su vez debe ser traducida a una buena idea gráfica. Este tipo de planteo es más teórico y supone conocimientos de diseño gráfico, interfases en la web y navegación

Cabe aclarar que este artículo presupone que el punto 1 está resuelto. Lo que propongo aquí es contarles como abordo el proceso de diseño de un blog, no en cuanto al detalle técnico, sino al proceso y la evolución de la idea, en torno a la plataforma Wordpress.

 1. Elegir la plataforma de publicación.

Elijo Wordpress porque es la mejor plataforma que conozco para llevar adelante un blog con muy poco esfuerzo, y es altamente personalizable. Es gratuito, y la instalación no nos llevará más de 5 minutos, y con conocimientos mínimos.

2. Entender y visualizar la estructura.

Hablando sintéticamente, la estructura de un típico blog de Wordpress está organizada en pocas y autodescriptivas partes:

• HEADER (Encabezado): que se repite en todas las páginas.
• CONTENT (Contenido): generalmente donde se ubicarán los posts. Es la sucesión de los mismos.
• SIDEBAR (Barra lateral): es la barra de navegación que se presenta en la homepage sobre el lado derecho, y que podemos configurar de manera que aparezca en todas las páginas.
• FOOTER (pie): una especie de colofón donde ubicaremos copyright y demás.

Entendiendo a grandes rasgos como se estructura un blog, se puede empezar el plenamiento del diseño con este simpole esquema, teniendo en cuenta que los contenidos (texto, imágenes, videos, etc) estarán "contenidos" en estos bloques. Si propongo un fondo que continúa en varias partes, hay que prestar particular atención a los empalmes del mismo, los colores, etc, para que la experiencia visual sea armónica.

3. Boceto, boceto, y más boceto…

Creo que en mi epitafio van a poner "Muerto bocetando…". Es fundamental para llegar a un buen diseño, plasmarlo antes en papel. Las primeras imágenes mentales aparecen siempre como deslumbrantes en nuestro cerebro, pero es un grave error ir de nuestra imaginación creadora directamente a la computadora. Seguramente el resultado será tosco y desalentador.

4. Dar vida al boceto en fireworks.

El paso siguiente es ubicar dentro del material creado en papel, el que más me guste y sienta que va con mi idea, y la imagen mental que tengo. Con el archivo original a un tamaño representativo de la realidad promedio de navegantes (digamos 1024 x 1024 píxeles), monto en una capa (layer) el boceto, y la bloqueo. Luego trabajo en capas adicionales, cada detalle, desde colores de fondo, texturas, tipografía y bullets.

En primera instancia, llevo el boceto scaneado a Fireworks, y lo "calco" 

A medida que incorporo elementos, voy probando distintas variantes sobre la marcha.

Sigo probando, pero voy agregando elementos reales de la estructura del blog: titulares, posts y sidebar, simulados. 

5. Dejar que el diseño crezca hasta el prototipo final.

Lo más probable es que la imagen mental y el resultado en pantalla difieran. Es bueno poder amalgamar elementos o recursos que provengan de otros bocetos. Muchas veces fluyen conceptos gráficos a través de la serie de dibujos y bocetos que se hicieron.

6. Codificar las hojas de estilo (CSS).

Para cada sección de la estructura que describí en el punto 2, así como para el documento en general, podemos definir tipografía, colores, fondos, espaciados, etc. Ponerme a detallar tags y modificadores de CCS, escapa a la idea de este artículo. Lo importante es entender que cada zonificación del diseño, tanto a grandes rasgos, como en el más mínimo detalle, puede ser personalizado y diseñado mediante Cascade Style Sheets.

7. Grabar, subir, testear.

Mi método se fundamentea en diseñar las hojas de estilo, subirlas al servidor e ir refrescando continuamente la página, al menos en Explorer y Mozilla, para ver "en vivo" los resultados del diseño. Dado que Wordpress reagrupa los "bloques" de la estructura, en principio puede resultar difícil editar cada pedacito de código (el header, content, sidebar y footer son "pedazos" de codigo, que se ensamblan al momento de mostrar el blog). Una técnica que uso es hacer el preview en el browser, y el documento HTML a la carpeta local donde estoy trabajando con el blog. Se puede editar esa hoja de estilos y aplicarla al archivo descargado, para ver el "todo" de la página del blog de forma más organizada.

El proceso de diseño descripto es el que uso habitualmente a la hora de diseñar un blog, aunque en general, puede ser trasladado a unas cuantas piezas más. En este caso particular, las imágenes que ilustran el artículo corresponden al diseño del blog de sobreexpuestos , completamente dedicado a la fotografía.

Espero encuentren este artículo de utilidad, me gustaría escuchar comentarios sobre que les pareció.

Eduardo Cesario