In tro _
Estructuralismo_
En los ultimos años el entorno físico ha evolucionado de manera vertiginosa, produciendo
ñador a la reacción del observador frente al mensaje visual.
cambios drásticos en las tecnologías, estilos de vida,
Como propuestas metodológicas inhe-
comportamientos individuales y colectivos, entre otros.
rentes a las explicaciones teóricas de cada uno, auto
La visión de lo actual directamente influenciada por
reflejan una forma distinta de percibir la realidad en
dichos cambios nos plantea una interesante postura
las personas.
ante la novedad.
Los productos de la cultura posmoderna tienden a
El estudio de diseño K/os es el resultado de la mezcla
distinguirse por características como la fragmenta-
entre experimentación visual con este entorno, ruptura
ción, la impureza de la forma, la falta de profundidad,
de lo convencional, amalgama de lo estructural en
la indeterminación, la intertextualidad, el pluralismo, el
contraste con la disyuntiva de los conceptos gráficos
eclecticismo y un retorno a lo irracional.
tradicionales con el objetivo de una creación visual interesante basada en el empirismo(ACCIÓN/REACCIÓN_CAUSA/EFECTO)
Estructura_
Concepto_
mentos con un orden específico. La definición literal
Distribución de las partes, objetos u elede estructura evoca las partes del cuerpo, edificios,
Para comprender mejor nuestros diseños
poemas, historias, una armadura la cual es empleada,
plateamos algunos conceptos que se deben tener
en nuestro contexto como “sustentación gráfica”.
en cuenta desde un punto de vista creativo, el caos,
Caos_
por ejemplo, como una serie de sistemas dinámicos muy sensibles a las variaciones en las condiciones iniciales. Estas variaciones pueden implicar grandes
Es el estado amorfo e indefinido del que
diferencias en el comportamiento futuro.
parte una idea que se supone anterior a la ordena-
La idea misma es un conflicto por ordenar, es allí
ción, un comportamiento aparentemente errático e
donde entra la siguiente fase en el planteamiento de
impredecible en algunos sistemas dinámicos. Es en
nuestros diseños, la aplicación del estructuralismo y
este punto donde ponemos de manifiesto el carácter
la estructura.
empírico del estudio, como una preposición del dise-
4
//José Leal_2011
Intro_
5
[018] [032]
[014] [08] [015] [012]
[013]
I
Contenido_
Sistema K
[0044]
/os
-I
[040]
[061]
Stu di o /
K/os plantea una visión diferente del medio, la indagación en el panorama caótico de las tendencias contemporáneas, demostrando destreza creativa para alumbrar una estética autónoma. Parte de una situación indeterminada, nuestra historia empieza como un proyecto personal que se ha consolidado en una masa de experiencias visuales/sensoriales. Si hemos de colocar punto de partida la ruptura con el medio nace a finales de 2010, en un contexto de cambios radicales ligado a los comportamientos humanos precedidos por experiencias empíricas, esta es la base de nuestros diseños, la expectativa a la reacción del usuario. Nuestros gustos van ligados al contexto general del día a día. ¿Cuál es la relevancia funcionalidad/ estética del diseño cuando su objetivo es comunicar una idea objetiva/subjetiva a un usuario?. Más aun, tomando en cuenta lo que un diseño puede influir en nuestra vida diaria ¿Qué mensaje realmente se ha de transmitir?. Para la teología el “caos” es el estado en el cual se encontraban los elementos en el momento de la creación... Nosotros creemos y creamos comunicación visual...
8
Studio/_
9
Pu bl i ci d ad //
Basada en la expresión visual de la filosofía del estudio, ofrece la representación de imágenes polisémicas,como la diversidad de significados que plantea el mensaje. La idea es crear por medio de la multiplicación un mensaje reticente y pregnante. Otorgando al observador el beneficio de la interpretación personal a medida que se asocian los conceptos de arte/mirada y que la visión de la manifestación sobrepasa toda forma predefinida.
Interacción visual con el usuario_ Cada quien tiene formas diferentes de ver e interpretar un mensaje, nuestra visión es plasmarlo y otorgar la libertad de su interpretación. La propuesta publicitaria (cuyo fin primordial es la propagación visual de la existencia y oferta del estudio de diseño) ofrece la interacción desde diversos puntos de vista (ya sea físico o metafórico) con el observador.
12
Slogan//_/
Sl ogan //_/
Muchos son los factores que giran en torno al eslogan [caos+creación+bigbang+explosión+deconstrucción/construcción+orden +universo+diseño+dimensión+ visión] impulsándonos a la compleja labor del diseño gráfico. Nuestro deber es creer en el diseño, es así como creamos el mensaje que finalmente cumplirá su finalidad, comunicar!.
C 3= C re e r _ C re a r _ C o m u n i c a r
Creer_/en el diseño gráfico. Crear_/como instrumento de invención. Comunicar_/para la transmisión o divulgación de una idea.
13
Ca r tel e s //_//
Fusionando los conceptos de nuestro estudio, la publicidad impresa fue uno de los medios de expresión para la creación visual del mensaje publicitario del Estudio K/os. Se han elaborado cuatro propuestas, vinculadas por la filosofía y que exponen de manera sutil, pero atractiva nuestro trabajo. Con el aprovechamiento del soporte y la luz los carteles pretenden iluminar a quien los observa, comunicar la idea de la creación como concepto divino, celestial, creativo... Pero sobre todo directo. Estos carteles han sido pensados para ser expuestos en vallas retro iluminadas (opis comúnmente usados en la publicidad de las vías públicas, estaciones de metro, paradas de autobús,etc), por lo tanto nuestra concepción de la idea fue la de explotar al máximo dicho soporte, la luz, como elemento esencial de la comunicación gráfica. K/os mezcla para esta publicidad la imagen digital con el entorno cotidiano. Trabajamos con recursos digitales y vivimos en una era rodeada de estos medios. Para el ciudadano común la utilización del ordenador, teléfonos móviles, televisores, cámaras, y otros medios que giran en el entorno de lo digital es parte de su día a día, ese ciudadano busca moverse en el entorno digital y nosotros ofrecemos la conexión gráfica y publicitaria con los potenciales clientes que buscan originalidad unido a la actualidad tecnológica. Unimos las diferentes áreas que maneja el estudio en cada cartel, la ilustración, la fotografía y la tipografía. Junto a estas integramos la estructuralidad, la simplicidad de la comunicación (en cuanto a la divulgación del estudio K/os como tal) vinculada a la capacidad polisémica de la imagen (percepción de nuestro trabajo en el tratamiento gráfico de la imagen).
14
Carteles//_//
_Carteles impresos//_/// La versatilidad que ofrece la impresión y la calidad de colores proporciona al cartel impreso la cualidad del mensaje directo, atractivo y en masa. Nos centramos en estas cualidades para la toma de decisión de los elementos visuales que incluirían los carteles y su respectivo tratamiento gráfico.
15
Recursos Gráficos.
Las tipografía empleada para el eslogan y la dirección Web es la Quicksand Book. En el caso del Logotipo se empleó las
Hay elementos gráfico constantes, estos se han dispuesto de tal forma para vincular los
tipografías corporativas, las mismas empleadas para
carteles entre sí, manteniendo así una retórica visual
la elaboración del presente dossier, Bodoni MT, Helve-
uniforme.
tica LT Std. La imagen es una representación semán-
tica/metafórica que guarda relación con el eslogan en y sus atributos connotativos. Maneja el concepto de creación divina, mística, poderosa. Se fusionan las imágenes figurativas con las abstractas, lo real, lo imaginario, lo geométrico, motivando al observador a sacar sus propias interpretaciones, establecer un criterio propio en torno a nuestro trabajo. Se juega también con el color como elemento de vida, atracción, pureza, y transgresión, De un modo muy sugerente las ilustraciones ,en contraste con el fondo, y los diferentes elementos que las rodean invitan a la observación, el análisis, hacen una llamada al observador queriendo salir del soporte e interactuar. Los elementos tipográficos empleados se han dispuesto debidamente reticulados, de color negro para evitar una lectura inapropiada. Una de las características que define al estudio K/os es la experimentación, en estos carteles hemos mantenido una tipografía sencilla, a base de conceptos básicos para facilitar la pregnancia del mensaje. 16
Carteles//_//
C3 es la simplificación del eslogan, la filosofía del estudio expresada en una ecuación que sintetiza nuestro modo de hacer diseño y comunicación.
17
_Carteles digitales//_//// El avance en las tecnologías y los soportes publicitarios ofrece actualmente una amplia gama de posibilidades, actualmente la tecnología LED, pantallas en diferentes formatos, proyectores, entre otros, se encuentran dispuestos en espacios públicos. Nuestra publicidad también va dirigida a su integración en estos soportes, la propuesta de carteles digitales pretende incorporar animación a la publicidad, otorgándole más dinamismo y vida a la vez que invita al usuario a detenerse por un instante y observar...
18
Carteles//_//
Valla retro iluminada creada a base de materiales de deshecho recolectados en Barcelona.
19
Carteles//_//_K1
Carteles//_//_K2
Carteles//_//_K3
3
C
Carteles//_//_K4
We b ///
Como parte de la propuesta gráfica para el estudio K/os, se plantea una Web con características particulares y la cual pretende interactuar dinámicamente con el usuario. Como una experiencia sensorial, la página mezcla videos de fondo que interactúan con el usuario mediante su avance por la Web, cada apartado tiene un video de fondo diferente, asociándose metafóricamente con el contenido.
Index La página inicial muestra la marca K/os en su estado puro de creación, posteriormente se dispersa por la ventana como un big-bang para invitar al usuario a reunificarla y así acceder a la Web. Creamos en base a piezas dispersas, con esto comunicamos nuestra intención de unir esas piezas para dar forma al producto final deseado.
32
Web///_
Mapa Web. La guia de navegaci贸n de la pagina funciona como una brujula para el usuario.
33
Desarrollo Web Desde el index hasta el contenido que desee ver el usuario hay una distancia aproximada de cuatro clics. Esto hace que no sea una navegación tediosa. El fondo del menú se ha dispuesto de color blanco inicialmente para no crear conflictos de lectura entre los diversos elementos. El fondo de la página inicial es un video, el cual se super pone al fondo original blanco de toda Web, de esta manera es mas pregnante y sigue un concepto minimalista. El video inicial lo conforman la superposición de un video grabado con una cámara Canon casera y una animación swf la cual presenta unas antenas telefónicas y antenas de TV análogas invertidas, el mensaje metafórico de la comunicación y su evolución a lo digital. La idea es que, a medida que se va accediendo a la cada apartado un nuevo el fondo cambia de video y aparece un mensaje semántico relacionado con el apartado.
34
Intro_
Evolución. Continuando con la retórica visual de la creación por medio de la fragmentación y fusión entre diversas imágenes. 35
Apartado Foto. Una vez accede el usuario al menú principal/WORKS, elige la opción que desea mirar. El logotipo y el menú principal se mantienen en la esquina superior izquierda, mientras que los sub_menús van desapareciendo.
36
Intro_
Fragmentación estructural Planteamiento gráfico del desarrollo de la Web. http://www.k-os.com
Menú Principal. El usuario siempre podra retornar al menú principal hacie clic sobre el logotipo, y a los sub_menús con un clic sobre el apartado que desee.
37
Ag radecim ient os / / / /
Inicialmente me gustaría agradecer a todas las personas, personal docente y estudiantil que integran l’Escola Superior de Disseny i d’Art Llotja, los cuales han aportado los fundamentos y las bases educativas necesarias para el desarrollo de este proyecto, con la enseñanza en el correcto manejo de la comunicación visual, la utilización de los diferentes medios para su creación y los elementos que conforman el lenguaje del diseño gráfico. Un agradecimiento especial al tutor de este proyecto Nelson Grassot por sus aportaciones en la búsqueda de información y conocimientos necesarios para el desarrollo del proyecto K/os. ...Y al entorno físico y temporal que me rodeó durante la fase de creación, amigos, familiares, la ciudad, el ruido visual, etc. Gracias a los cuales se fundamento esta idea. ...A todos aquellos en fase de K/os Gracias!
40
41
P roceso / Creaci贸n
P ro ceso / Creación
El proyecto surge inicialmente de la idea de realizar spots audiovisuales para un estudio de diseño gráfico hipotético, ese estudio debía ser algo distintivo y transgresor como las ideas preconcebidas de distorsiones audiovisuales y mensajes gráficos directos y sugerentes, de allí nace el Estudio/Diseño K/ os.
. Una vez gestada la idea procedí a la crea-
ción de la marca, la cual debía de ser sencilla pero directa e igualmente transgresora, seleccionando una de diversas tipografías como base para la creación del logotipo y procediendo a la modificación de las misma. Debido a la falta de recursos para dicha idea (esencialmente recursos audiovisuales) se adaptó a la creación de una propuesta gráfica impresa por medio de carteles publicitarios, estos debían reflejar la linea gráfica de transgresión y mensaje directo, exponiendo el trabajo gráfico del estudio. Así mismo me plateé la creación de una Web con videos de fondo y el diseño de sus contenidos (tan solo como propuesta gráfica).
46
Proceso/Creaci贸n_
47
R eferent es
el entorno diario que transitamos, menciono algunos como la revista Étapes, New Graphic Design In China,
La investigación de material literal, gráfico, Web y audiovisual referente a la idea inicial fue un punto de partida clave en la elaboración. Los conceptos teóricos del caos y la transgresión aplicados en el diseño gráfico, han estado muy presentes a lo largo de su historia, pero se han hecho realmente notables a partir de los años 80’s y 90’s con trabajos como los de Peter Saville y David Carson (mencionó particularmente estos dos diseñadores ya que han sido una
ensayos de Josef Albers, Eric Gill, revistas independientes como Plátano Verde, Go, Lamono, entre otras. Páginas de búsqueda y biblioteca de imágenes en general como Google, Tumblr, Adsoftheworld, Danmountford, y muchas más! En general todo ese amplio y mayoritario porcentaje de información visual que entra por nuestros ojos y es procesado por nuestros cerebro y sus capacidades cognitivas.
fuente de influencia personal), y que a lo largo de la primera década del 2000 se ha ido perfeccionando y ampliando con el desarrollo de los medios tecnológicos y programas de edición. Dentro de las referencias analizadas se encuentran estudios de diseño como FM Milano, VASAVA, AlexTrochut, MASA, Resn, entre otros que poseen retóricas muy particulares e interesantes. También debo destacar la influencia de páginas web relacionadas con el mundo de la música, en particular Rodríguez Lopez Productions y todo el entorno musical, audiovisual y gráfico en general que gira en torno a estas. Ilustraciones de y diseños de Sonny Kay, etc, etc, etc... Otros referentes destacables son los libros de diseño, revistas y articulos que se encuentran no solo en ediciones relacionadas con el tema sino en 48
Referentes_
Registro visual. Imágenes de los diferentes elementos gráficos de investigación, influencias gráficas, audiovisuales, musicales, literarias, etc... 49
Ca r act e r í s t i c a s
A r tí s ti c a s
Destacan la variedad de técnicas artísticas empleadas en la creación del proyecto, esencialmente el collage, la ilustración digital, la manipulación de la imagen y el mensaje polisémico. Connotar por medio de imágenes el caos visto desde otra perspectiva, diferente, adaptable, y sugerente.. Formamos parte de la era digital y a la vez de una etapa crítica, la cual debe de ser tomada como un surgimiento, la idea no es un cambio radical, sino, una adaptación a las circunstancias del entorno, el momento por el cual atravesamos, las diferentes posibilidades comunicativas y visuales que nos ofrece con los recursos necesarios.
50
Características Artísticas_
Registro visual,Libros, revistas y medios impresos en general usados como fuente de inspiración gráfica...
51
T é c nicas /Carteles_Ilustraciones
la capa inicial con la imagen original (negativo), posteriormente aplico las diferentes opciones de fusión, en
En el caso de la comunicación visual impresa he tomado como punto de partida la selección de diversas imágenes fotográficas de revistas en desuso,para su reutilización y posterior edición en empleando Adobe Photoshop e Illustrator. Por otra parte seleccioné fotografías tomadas en el transcurso de experiencias personales las cuales también fueron modificadas en los mencionados programas de manipulación fotográfica.
Aberraciones visuales_Photo/Illustraciones
este punto me encontré con la aberración, al seleccionar la opción Subexponer color. Hay otros valores que influyen en la “pixelación” de la imagen y favorecen a verla mas o menos distorsionada, las sombras/luz, / brillo/contraste, filtros de color, tamaño de la imagen, etc. Se puede seguir probando con las opciones de fusión para conseguir el resultado deseado. Aplicando diversos tipos de desenfoque a la imagen y distorsionando con la herramienta dedo, procedí a la aplicación de colores y la reutilización de los mismos colores de la imagen para conseguir otra apariencia. Con el Illustrator realizo los trazados
He denominado Aberraciones visuales al
e ilustraciones más detalladas en los cuales creo
proceso de ilustración, ya que he llegado a este por
conveniente resaltar el uso de la linea por medio de la
medio como resultado un error visual de imagen que
herramienta pincel. De esta manera sigo combinando
se produce al superponer una imagen duplicada y
los programas hasta conseguir la apariencia final de
aplicarle un estilo de fusión en el Photoshop el cual
la Photo/Illustración. [pág. 38-39]
distorsiona la imagen original dando por resultado una imagen más fragmentada, diferente y menos icónica. En el caso de Photoshop las herramientas más usadas fueron los ajustes de imagen (de la Barra de Menú/Imagen) Para explicar el proceso tomo como punto de partida la imagen fotográfica, la duplico he invierto 52
Técnicas_
53
Retícula base/Carteles. Cada elemento ha sido dispuesto y estructurado según la retícula.
/Retícula_cartel La distribución de los elementos gráficos (tipografía, imágenes, etc.), se ha realizado por medio de una retícula, la cual parte del trazado de dos lineas oblicuas, estas van de una esquina a su opuesta. A partir del punto de intersección de ambas lineas tracé una circunferencia cuyo radio es la distancia del centro hasta el extremo lateral de la mesa de trabajo. El punto donde se intersecan las lineas oblicuas y la circunferencia es la distancia de la altura del cuadrado con el cual he conseguido los márgenes. En el centro de la mensa de trabajo también se encuentra una pequeña circunferencia y un rectángulo, los cuales han sido dispuestos de esa manera como guías de limite de reducción de imagen, punto céntrico, entre otros.
54
Técnicas_
Dispocición de los Elementos según capas en ilustrator, de izquierda a derecha las capas superiores e inferiores respectivamente. 55
/Web_Videos
En la creación de la página web tuve la idea inicial de su realización a partir de videos como fondo web. La interacción de los videos con el usuario fue una de las principales caracteristicas que pensé, pero al no tener los conocimientos necesarios en programación esta característica queda tan solo como un planteamiento y la web en el presente proyecto como una propuesta inicial. El menú y desarrollo de los componentes de texto es más simple (forma/contenido), pero mantienen el dinamismo (en cuanto a interacción). Se mantienen las tipografías corporativas, aunque esto puede verse afectado por la programación web y el sistema operativo en el cual se desarrolle la página, en tal caso se deberá aplicar la tipografía más adeVideos Fusiones. Los videos fueron editados en Adobe Premiere y After Effects para lconseguir la apariencia deseada.
cuada y parecida a la corporativa. El espacio de trabajo se distribuye básicamente en dos áreas. El área estática, en la que se encuentra ubicado el menú principal y mapa web. La segunda área es la dinámica, en esta se desenvuelve el contenido, varía según sus necesidades. En general la web ha sido concebida con la idea del dinamismo y la interacción con el usuario en su conjunto (con la implementación de elementos como los video/fondos, animación del contenido, etc).
56
T茅cnicas_
Propuesta. Creaci贸n de la presentaci贸n web con Flash CS4.
57
Retícula creada para la distribución de las imagenes.
/El presente trabajo...
Indudablemente este dossier con toda la información acerca del Estudio/Diseño K/os forma parte del conjunto de materiales gráficos que componen el proyecto. Ha sido concebido bajo la filosofía anteriormente mencionada, posee las ilustraciones creadas exclusivamente para este trabajo como material gráfico y aplicando todos los conocimientos y técnicas adquiridas durante los años de estudio en l’Escola Llotja e investigaciones particulares autodidactas. Se ha realizado con una maquetación base de cuatro columnas por página, con tres tipografías diferentes (Bodoni MT, Helvetica LT Std, Quicksand). Los tamaños de la tipografía varían desde los 7pts para los textos bases y 24pts para los titulos. Las imágenes se han incorporado bajo otra retícula creada específicamente para estás y con la cualidad de ser combinada con la retícula base del texto.
58
Técnicas_
59
60
Creditos/////_
Cr é di to s / / / / /
Javin Mo. New Graphic Design in China. 3030press,
Web de referencia/_
Hon Kong_2008. FM Milano http://www.studiofmmilano.it/FM/
GoMag. Editorial Uniprensa S.A., Barcelona_2009.
Veerle’s Blog http://veerle.duoh.com/
Revista étapes nº8. Editorial Gustavo Gili, Barcelo-
ToDo http://www.todo.to.it/
na_2010.
Project - Projects http://projectprojects.com/ VASAVA http://vasava.es/ Alex Trochut http://www.alextrochut.com/ Joel Cocks http://www.joelcocks.com/ Aeri Form http://www.aeriform.co.uk/ Dan Mountford http://www.danmountford.com/ MASA http://www.masa.com.ve/website.html No-Domain http://www.no-domain.tv/ Resn http://www.resn.co.nz/#/home Sonido de referencia/_ http://rodriguezlopezproductions.com/ http://www.themarsvolta.com/ http://rodriguezlopezproductions.com/TSES/ Bibliografía de referencia/_ Diseño_Gráfico: José Leal Molina
Gill Eric. Un Ensayo Sobre tipografía. Campgráfic
Impresión:
Editors, SL 2004.
Copy Art.
Plátanoverde nº11. Editorial Pregoneros, Cara-
Publicado por K/os Estudio/Diseño - Barcelona
cas_2006.
2011 K/os - www.k-os.com
61