TENDENCIAS EN EL DISEÑO
DISEÑADORES MEXICANOS
Alejandro Magallanes Benito Cabañas Carlo Olivares Paganoni Domingo Noe Martínez Eric Olivares Eduardo Barrera Felipe Covarrubias Alvarez Gabriel Martínez Meave Gonzalo García Barcha Javier Martínez “El Cha” Luis Almeida Enrrique Olilervides Ricardio Luevanos Vicente Rojo
ALEJANDRO MAGALLANES Nace en México en 1971 Estudia en la Escuela Nacional de Artes Plásticas de la UNAM diseño gráfico Trabaja para instituciones sociales y culturales, Desarrolla proyectos editoriales, animaciones y carteles, Ha recibido varios premios, algunos son: Medalla Jozef Mozrack en la XV Bienal Internacional de Cartel en Varsovia // Premio Golden Bee (en diseño editorial) en la Bienal de diseño gráfico en Rusia // Mención en el New Horizons de la Feria del libro de Bologna
“una imágen sí vale más que mil palabras”
Utiliza para hacer sus imágenes tintas, acrílicos, fotos, collage, dibujo, objetos. Siempre hay un hay tanto procesos análogos como digitales en una misma proporción. Sus imágenes se caracterizan por tener siempre presente el juego y un sentido del humor. Dice que sus imágenes tienen que ser directas y parecer fresca y espontaneas.
BENITO CABAÑAS Es DISEÑADOR GRAFICO por la Universidad de las Américas Puebla. Trabajó con la agencia de ComunicaciónAnatome de las ciudades de Marsella y París, Fr (1999-2001). Actualmnte es Durector de la Agencia Abracadabra y Consultor Gráfico de la UNESCO en parís, Fr.
OBRAS
RECONICIMIENTOS ° Premio Quó (1999-2000) ° Obtuvo el Coup de Coeur, premio
especial en participación con Anatome (2000).
° Ganó una meción en la 8va. Trienal internacional del cartel Político en la ciudad de Mons, Be., (2000).
° Conmemorando los 6 años de la UNESCO, fue seleccionado para la exhibición 60 años-60 carteles, en París, Fr., (2005)
° Ganó una meción en la primera competencia
internacional del cartel ANTIAIDS-UKRANIE, en Ukrania, UA. Fue finalizta en el Proyecto Quanto en Venecia, it. (2006).
° Ganó uno de ls diez lugares dentro del proyecto
del cartel Good 50x60, celebrando en Milán, It. y una mención honorífica en el concurso internacional de cartel Latinoamerica Hoy (2009).
Ha impartido Conferencias y talleres en más de 16 ciudades dentro de: Republica Mexicana y también en Francia, Rumania, Chile, Argentinay Costa Rica.
CARLO OLIVARES PAGANONI DISEÑADOR GRAFICO Originario de Cuernavaca, México, estudió durante dos años la escritura de guiones en la UCLA... y más tarde asistió al Art Center College of Design, en Pasadena, se graduó con un Maestría en Cine. Su tesis cortometraje "cámara de cartón" ganó un Emmy de estudiantes. Carlo se trasladó a Estados Unidos para trabajar para Cartoon Network fue productor ejecutivo de: “Santo Contra Los Clones”,
Como creativo, su obra ha sido reconocida por Cannes Lions, The One Show, Art Directors Club, el Festival de New York, FIAP, los Premios Hispanos de Anuncios, el Círculo de Oro México, El Ojo de Iberoamérica, Premios de Licencias LIMA, Promax Ahora es escritor / productor de Disney XD, América Latina y Promax BDA. Como director, su y realiza campañas promocionales para trabajo ha sido reconocido por varios festivales de Star Wars Rebels, Las Nuevas Crónicas de cine incluyendo, LA Shorts Fest, Cortos Yahoo en "Yahoo en Español," y el Festival de Cine Latino de Yoda y Súper Chico durante el Mes de la San Diego.Carlo vive en Los Angeles, CA. Hispanidad.
DOMINGO NOÉ MARTIÍNEZ Diseñador Mexicano.
especializado en diseño de revistas, libros, ediciones especiales, web, pósters e identidad visual. Estudio en la universidda Autónoma Metropolitana/Azcapotzalco, con licenciatura en diseño de la comunicacióngráfica. En 1990 trabajó como director de Arte por la galería Metropolitana; después, trabajo en editorial Televisa como director de arte de la revista Harper´s Bazzar, edición México y latinoamérica y como coordinador general de diseño de revistas internacioales.
A partir de 1997 fundó junto con Alvaro Rego la revista Matiz. Junto con Yolanda Garibay fundó el estudio de la fe ciega y ambos participan en el diseño de la revista de rock LA MOSCA EN LA PARED.
POSTALES, REVISTAS, LIBROS Y PÓSTERS
ERIC OLIVARES DISEÑADOR, ILUSTRADOR, ARTISTA DE PERFORMANCE Y NEWMEDIA ART. ES LICENCIADO EN DISEÑO GRÁFICA Nació en la Ciudad de México en 1970, estudio en el Instituto Nacional de Bellas Artes, México D.F. y tiene una maestría de Artes Digitales/Universidad Pompeu Fabra Barcelona. Desde 1987 ha trabajado con isntitucioes y empresas nacionales e internacionales desarrollando proyecto de identidad corporativ, ilustración, cartel, editorial, espacios expositivos, museografía, esenografía, publicidad, multimedia, broadcast y como director de arte. Escribio el libro dibujo para diseñadpres gráfico y tiene experiencia como docente impartiendo alleres y conferenciasen diversos congresos internacionales, actualmente trabaja como inlightdesing, estudio que realiza proyectos de comunicación visual y multimedia
CARTELES
Su trabajo en arte y diseño cuenta con reconocimientos en América, Europa y Asia. Fue profesor de licenciatura y posgrado en la Escuela del Instituto de Bellas Artes y de la Universidad Iberoamericana, en México, D.F.
EDUARDO BARRERA Cursó la carrera de Diseño Gráfico en la facultadde artes y diseño de la UNAM. Trabajó como coordinador de publicaciones para la bienal internacional del cartel en México.
Realizo varios trabajos de diseño de cartel
FELIPE COVARRUBIAS ÁLVAREZ Nació en Guadalajara, Jalisco, México, en 1945. Realizó la licenciatura en Arquitectura y estudios de fotografía en Inglaterra, ha trabajado en el área de diseño grpafico y editorial. Fue director de diseño en el departamento de Bellas Artes de Jalisco. Director de la revista Magenta de diesño. Socio fundador de Trama visual, asociación organizadora de la Bienal Internacional de cartel en México.
- Vivir no es fácil, pero sí, muy divertido. PREMIOS
Fundador y director de la Galería Azul en Guadalajara.Actualmente, - AL final de los - Obtuvo en 1994 desde 1993, es coordinador del 90s, el premio el premio México salón del diseño en el centro en Artes de de Diseño. Moderno en México. Jalisco.
GABRIEL MARTÍNEZ MEAVE Es Diseñador Gráfico y tipográfo, ilustrador y calígraf. Nacido y radicado en la Ciudad de México. Su trabajo abarca el diseño editorial y de libros, identidad coorporativa, logotipos, obra gráfica, calígrafia y diseño de fuentes y familias tipográficas. Ha ilustrado libros de narrativa, fantasía y fucción, para autores como Gabriel García Márquez, Juan Vulloro y Cornelia Funke. Ha diseñado tipográfias especiales para empresas como Telcel, el diario financiero, El economista, Jumex y los almacenes del Palacio de Hierro, así como la fuente institucional del gobierno federal de México. Sus tipográfias originales Arcana y Orgánica son distribuidas nacionalmente por Adobe Systems. Ha realizado proyectos de diseño y marca para Mexicana de Aviación, Corona, PYG, McMillas , Pearson Educación, Fondo de Cultura Económica, Igu¿ilvy y Mather y diversas agencias, editorials y firmas de diseño. Su obra caligráfica y de ilustración ha sido exhibida en diversos foros y espacios, entre ellos la muestra individual << La mano que mece la pluma>> en el Museo Mural Diego Rivera en el centro Histórico de la Ciudad de México. Además, su trabajo ah sido publicado en las principales revistas Internacionales de diseño, tales como Communication Arts, Novum, Etapes, Tpo y How, Phaidon Books, en su libro Area_2, publicado en 2009, incluyó a emergentes más importantes hoy en el mundo.
GONZALO GARCÍA BARCHA Nacido en México en 1962, es hijo del escritorColombiano Gabriel García Márqu ez Márquez,es tipográfo y diseñador gráfico , conlarga expericneica ya en la imprenta y en los títulos de crpedito del cine. Estudio en la Parson School of Design. Su trabjo se ha desarrollado en Cuidades como París, Nueva York y la Ciudad de México. En la última fundó en equilibrista, casa editorialde libros de vanguardia sobre diseño gráfico,cine y artes visuales.
Además de los estudios sobre tipográfias antiguas, otra de sus especialidades es la creación de tipos adaptados para títulos y créditos de cine. S u pasión por la edición tamién lo llevo a fundar El equilibrista y Balacamán, editoriales que difunden el artes del disñeo en su contexto histórico. Pintor avtivo, en 2012 expusoPANORAMA, una serie de pinturas que primero deubujó en su ipad y después transladó al óleo, demostrando su versatilidad tanto manual como tecnológica.
JAVIER RAMÍREZ “EL CHA” MUSICO, DISEÑADOR, LOCUTOR Y EMPRESARIO
Nació en 1968 El comienzo de su carrera musical con Fobia fungió, también, como inicio de un proceso de aprndizaje en el diseño, ya que estuvo muy involucrado en la produción de los flyers para las presentaciones del grupo y en la imagen de sus primeros discos, sobre todo en el mundo feliz, logrando fusionar su amor por la música y el diseño. Se inscribio e la carrera de diseñador gráfico en la universidad continental, si que su padre supiera, y fue allí donde creó Hula Hula.
HULA HULA Es un estudio de diseño formado enla ciudad de México en 1996,el que está enfocado, principamente, a la industria del entretenimiento. Han trabajado para empresas comoSony, BMG, EMI, Warner, MTV,Doritos, Hard Rock Café,festival Morbido, Cartoon Network, Coca-cola, entre otras. Su trabajo se ha publicado encommunication Arts, Los logos,Latin American Graphic Designy diseño gráfico en México.
LUIS ALMEIDA Diseñador, ilustrador, foógrafo e ilustrador, un narrador por exelencia, que busca proponer las diferentes lecturas, la condición insólita.
La imagen es un proceso de lectura que atiende a la interpretación de un espectador, quien decodifica su significado.
Los sistemas de señales internacionales, que se manejan por encima de la diversaslenguas, son pruebas de que la humanidad,sin importar su raza o credo, puede comunicarse de manera icónica. Lo imagen es la manera más rápida y eficaz de conmunicar, de emocionar o de llamatr nuestra atención, y esa es la materia básica del lenguaje del cartel. Su manejo consistente hace al constructor de ella.
QUIQUE OLLERVIDES Diseñador con especialización endiseño tipográfico por Cooper Union. Nacio en la Ciudad de México en 1974. Es un egresado de la carrera Diseño Gráfico de la universidad Intercontinental. Co-fundó y dirigió el estido Hula-Hula (2006-2010) y la tienda galeria KONG, primera en México especializada en ilustracin y diseño.Desde 2010 trabaja de manera independiente en rpoyectos de branding,ilustración y tipográficos.
“Me gusta mucho hacer portadas de discos por que, a difrencia del diseñador que hace el envoltorio de los frijoles y su trabajo termina en la basura, el diseñador de la portada de un disco lo acompaña toda la vida. Llega a formas partes del artista, de la música y de ese disco n particular. Es un reto súper padre y una resposnsabilidad muy grande”.
RICARDO LUÉVANOS ES ilustrador, Diseñador Gráfico. Sus fuentes de Inspiración son la fantasía, los sueños, el romanticismo, los textos que lee, las personas cercanas a él, y especialemnte la música, que marca cada uno de sus proyectos. Estudio la Licenciatura de Diseño para la comunicación gráfica en la Universidad de Guadalajara, así como talleres de técnicas de ilustración y apreciación cinematográfica. Ha trabajdo con varias empresas locales y nacionales dedicadas a la moda, donde ha echo gráficos impresos sobre tela. Actualmente es el encargado de la imagen gráfica de Belanova. Ha trabajdo también con JesseyJoy en la creación del oficial de su gira Con quien se queda perro. Ha publicado en revistas como Nylon, Cream, posh, Blink y la Revista Francesa Pose. Tiene una exposición en Solitario.- Conservación de los recuerdos, en la Galería Jorge Mrtínez (2010) y tres colectivas: it´s Ok to Cry. En Humo Live Arts (2009). Olio, en casa Patrice (2010) y no puedo prometer nada, en la Galería Jorge Martínez (2011).
VICENTE ROJO 1932: Nacio en Barcelona (ESPAÑA) REalizó estudios de dibujo, cerámica y escultura. 1949: llegó a México ° Fue asistente en la oficina de ediciones del Instituto Nacional de Bellas Artes (INBA), Realiz estudios de pintura y sus primeros diseños gráficos. ° Trabajó como diseñador de la Dirección de difusión de la UNAM. ° Fue confundador y directos artístico del suplemento la cultura en México, de la revista siempre!. ° Fue director artístico de la revista Bellas artes (INBA) y la revista de la UNAM. Creo el diseño de la gaceta del fondo de cultura económica. ° Realizo el diseño de portadas para vuelta.
E X P O S I C I O N
L I B R O S
E S C U L T U R A
L O G O S
TENDENIAS DEL DISEÑO
EL DISEÑO WEB SE CONVIERTE EN EL DISEÑO MOVIL APLICACIONES WEB PROGRESIVAS DISEÑO EN ESQUELETO LAS MICROINTERACCIONES RETICULACIÓN DISEÑOS VERTICALES Y DIVIDIDOS IMAGENES SVG ANIMACIONES ACTIVADAS POR DESPLAZAMIENTO E IMÁGENES CINEMATICAS
BOTONES DE CALL TO ACTION ANIMADOS DEGRADADOS Y DOUTONOS RETRO DISEÑO TEXTIL MINIMALISMO EN BRANDING Y LOGOS COLORES VIVOS Y TIPOGRAFÍA TIPOGRAFÍA Y CALIGRAFÍA AI (INTELIGENCIA ARTIFICIAL) PARA EL DISEÑO GESTOS E INTERACCIÓN DE VOZ
EL DISEÑO WEB SE CONVIERTE EN EL DISEÑO MOVIL Mejores APPs de móvil de IPHONE (iOS) para diseñadores
Behance
Para comenzar, algo de inspiración no viene mal. Así, Behance ha llegado para dar ideas a todos en el mundo del diseño. Realmente, es una plataforma web gratuita que ha desembarcado en el mundo móvil. Los fanáticos del diseño están encantados con ella, ya que permiten disfrutar de cientos de miles de portafolios de otros tantos profesionales del sector Con Behance se pueden visualizar fotografías, diseños y todo lo que se le pueda a uno ocurrir. Por ello se ha instaurado como una de las mejores fuentes de inspiración en materia de contenidos visuales.
Adobe Shape una app que está disponible, tanto para iOS como para Android. Su función principal es convertir en un gráfico vectorial una imagen que, previamente, se haya capturado con la cámara del teléfono móvil. Es muy útil para modificar signos y diferentes tipografías y usarlas, posteriormente, en programas de diseño como Illustrator o Photoshop. Además, esta app cuenta con un respaldo en forma de almacenamiento en la nube. Con una capacidad máxima de 2 GB, todos los trabajos se sincronizan en Creative Cloud.
Moodboard
Esta aplicación recoge la tradición de plasmar ideas sobre un papel para mejorar la organización. Algo que todo profesor inculcó a sus alumnos. Ahora es posible a través de Moodboard, pero sin papel de por medio. Así, se basa en la misma idea, pero a través de imágenes que puedan incorporar notas que ayuden a una mejor planificación del resultado final. También incorpora la posibilidad de compartir directamente en redes sociales, por lo que el intercambio de ideas puede ser enriquecedor y altamente creativo
Sketchbook Mobilex Esta app ha sido creada por Autodesk específicamente para el sistema operativo iOS. Con ella se pueden realizar diseños y dibujos en el iPhone o iPad. Su versatilidad radica en que se puede trabajar hasta con tres capas simultáneas. Además, Sketchbook Mobilex cuenta con una función que permite importar fotografías hechas, previamente, con la cámara del smartphone. También se pueden sacar directamente para trabajar sobre ellas, ya que esta app se integra con la cámara del teléfono.
APLICACIONES WEB PROGRESIVAS PWA Una PWA utiliza las últimas tecnologías disponibles en los navegadores para ofrecer una experiencia en móviles lo más parecida a la de una aplicación nativa. La idea que transmite esta definición es que los objetivos que debemos buscar al crear una PWA son: Que tenga el mayor rendimiento posible en móviles y que cargue de manera casi instantánea Una buena interfaz que se parezca lo máximo posible a una nativa. La posibilidad de trabajar sin conexión Poder enviar notificaciones a los usuarios, como una app nativa Básicamente con estas cuatro premisas estaríamos cubiertos, así que detrás de ese nombre lo que hay es realmente una idea sencilla
Tecnologías que aprovechan las PWA Las PWAs se basan en unos conceptos bastante simples: Responsive Web Design, animaciones CSS y frameworks específicos para crear interfaces móviles con aspecto de nativas Service Workers App Shell Manifiesto de aplicación
DISEÑO EN ESQUELETO Adiós a los spinners! El año pasado dije que todo era sobre usabilidad. Esta tendencia sigue vigente. Los diseños en esqueleto no se refieren a la apariencia de un sitio web o aplicación. Son acerca de la forma en que se cargan. Dile hola a esta última tendencia en la experiencia del usuario (UX). Las pantallas de carga en esqueleto son un sistema que asegura que tu experiencia en la web o la aplicación sea lo más rápida posible, y esto se logra cargando la página en etapas: desde los elementos más simples hasta los más complejos, pero siempre proporcionando al menos el esqueleto de la pantalla sobre la cual estás navegando. De esta manera, los usuarios pueden predecir o anticipar lo que estás a punto de cargar (piensa en los marcadores de posición de imagen, siempre presentes), haciendo que el corto tiempo de espera sea más fluido. Esto es lo opuesto a lo que las espantosas barras de estatus o spinners trataron de lograr (sin éxito alguno). Las cargas en esqueleto dominarán la web en 2017, y con toda razón.
LAS MICROINTERACCIONES Usos específicos de las micro-interacciones En general, se puede decir que las micro-interacciones sirven para informar de forma visual al usuario sobre algún cambio de estado o alguna acción realizada exitosamente. Sin embargo, existen usos particulares que poseen las micro-interacciones, los cuales mencionaremos a continuación:
Destacar algún cambio en la interfaz Las micro-interacciones tienen el poder de guiar la atención del usuario a ciertos elementos o acciones específicas. Esto se logra usualmente mediante animaciones sutiles o divertidas que tienen un impacto en los usuarios. Un ejemplo común de este tipo de uso son las notificaciones.
Disminuir el esfuerzo de los usuarios Todo el diseño va dirigido a minimizar el esfuerzo de los usuarios y hacer el proceso de navegación más sencillo. Las micro-interacciones, a pesar de ser elementos mínimos, pueden contribuir con este propósito.
Notificar sobre las acciones realizadas con éxito Las micro-interacciones tienen el poder de reforzar las acciones que un usuario está realizando. No solo ofrecen información visual para indicar sobre el cambio de estado de ciertos elementos como botones, sino que también informan sobre ciertas acciones que están siendo realizadas en ese mismo momento por el sistema.
Informar sobre el estado de algún elemento las micro-interacciones van dirigidas a informar a los usuarios sobre el estado de ciertos elementos y que usualmente se emplean pistas visuales que, por supuesto, pueden ser reforzadas con información textual de ser necesarias.
En conclusión…. Incluso detalles mínimos como las micro-interacciones tienen el poder de mejorar la experiencia de usuario. Aunque en principio no hayas tenido una idea clara sobre el tema, al detallar sus usos principales has podido analizar y entender por qué las micro-interacciones son tan importantes en cualquier interfaz de usuario.
RETICULACIÓN Construcción reticula de una página web Todo diseñador debería conocer y entender los parámetros de una web antes de empezar a diseñarla. En este apartado aprenderéis los fundamentos necesarios para empezar a diseñar webs comerciales. Aunque esta información es útil si deseáis construir webs para otras personas, también puede servir como lista de comprobación para las webs que queráis crear para vosotros. Ésta es generalmente la fase que viene después de la arquitectura de la información; debéis recoger información sobre qué quiere al cliente en su web y cómo habría de estar estructurada, qué tipo de construcción de marca utiliza esta empresa y, entonces, utilizar esta información para crear un borrador de diseño visual que podáis acordar con el cliente antes de añadirle gráficos y combinaciones de colores. Concretamente, hablaremos de lo siguiente: Aunque el color y el diseño son importantes, debéis entender lo que el cliente quiere conseguir con su web. Esta información afectará de manera importante al aspecto y al tono de la web. Por lo tanto, habréis de gestionar una lista de comprobación de elementos para aprender cosas sobre la web del cliente antes de intentar empezar a diseñar. También necesitáis saber más sobre las acciones de marketing anteriores de la empresa, incluyendo la creación de marca. Esta información influirá en el diseño de la web. En función de toda la información recogida del cliente, crearéis el diseño visual de la web de manera que el cliente pueda visualizar los fundamentos de los gráficos y contenidos adicionales. Generalmente, antes de que se decida el diseño de una web, la persona o la empresa deberían tener ideado un plan sobre la finalidad de la web. Aunque el color y los gráficos son importantes, debería haber un plan que prevea un presupuesto, el mercado destinatario y los objetivos proyectados, y también los recursos para llevar a cabo estas tareas. ¿La web sólo dará información al usuario o también está pensada para vender productos o servicios? ¿La web se ampliará en el futuro o está pensada para ser una acción a corto plazo para conseguir una posición en el mercado (como la web de una campaña política o una web que intente aprovechar una tendencia actual)? ¿Incluirá la web un blog, páginas de aspectos legales y de información, galería de fotos, formulario de contacto por correo electrónico? ¿Qué más necesita? ¿Cómo se puede comparar esta web con la competencia?
DISEÑOS VERTICALES Y DIVIDIDOS Layouds Divididos Después de bastantes años donde los módulos horizontales eran la norma, especialmente en las landing pages, la disposición vertical y dividida finalmente ha surgido como una alternativa fuerte. Funcionan bien tanto en la sección de home como en las landing pages. La razón es que ofrecen dos o más opciones diferentes para el usuario, sin la necesidad de presentar uno como más importante que el otro. A menudo verás este diseño del sitio emparejado con un montón de espacio negativo y tipografía en negrita. Incluso puedes utilizar más de dos módulos verticales. Esto divide tu contenido en varias facetas, lo que las hace perfectas para la navegación del sitio, además de ser una solución de escaparate de contenido, mejor que los antiguos controles deslizadores. Para un concepto bastante similar, revise los grandes menús fotocéntricos, que pronto serán ampliamente adoptados por los sitios de comercio electrónico.
IMAGENES SVG Tendencia ne 2017 Los archivos del formato de Gráfico de Vector Escalable (Scalable Vector Graphics o SVG) son un formato de imagen vectorial que ha existido desde 1999. Entonces, ¿cómo es que son una tendencia importante en 2017? Dos grandes razones: la resolución y la velocidad de carga de la página. Dado que los archivos SVG son escalables, significa que son independientes de la resolución y se verán perfectos en cualquier pantalla, sin importar el dispositivo o el tamaño. Esto soluciona el problema en el que a veces se tenía que preparar dos archivos de imagen diferentes para cada objeto, uno para las pantallas de resolución normal y otro para las pantallas de retina. Esto es sin duda excelente para los logos y cualquier elemento de marca. Crea tu logo una vez, de la manera que lo desees, y siempre se verá genial, no importa en qué tamaño. Un ejemplo: el nuevo logotipo de TNW es un archivo SVG
En cuanto a la velocidad de página, los archivos SVG no realizan ninguna solicitud http. Esto se debe a que todo el contenido de un archivo SVG es sólo texto, lo que lo hace muy rápido para que los navegadores lo lean. Y como sabe, en una web cada vez más móvil, la velocidad de la página importa y mucho. Pero hay aún más razones para su reciente popularidad: pueden ser animados, y son perfectos para crear fondos geométricos sin añadir más tiempo de carga.
ANIMACIONES ACTIVADAS POR DESPLAZAMIENTO E IMÁGENES CINEMATICAS
Cinemagraphs Los elementos que se animan a medida que te desplazas hacia abajo no son exactamente nuevos. Pero en lugar de ser sólo un truco llamativo (¡mírame, soy una animación!), se han convertido en un elemento clave de la narración. Muy bien, cada animación que descubrimos a medida que nos desplazamos hacia abajo de la página debe contar una parte de nuestra historia. Apple lideró el camino con el increíble sitio de Mac Pro. Si todo esto suena difícil de implementar, sólo revisa Spark – la herramienta de narración visual de Adobe, gratuita y fácil de usar. Con ella puedes construir algunas páginas y gráficos magníficos, al mismo tiempo que estés contando tu historia. Pero eso no es todo sobre animaciones. Sabes que los GIF también han vuelto a nuestras pantallas, gracias a la locura de los memes. Pero ahora, los GIF vienen en una nueva forma: el cinemagraph o imagen cinética. Los cinemagraphs o imágenes cinéticas son todavía imágenes donde una pequeña parte tiene un movimi-ento repetitivo, creando un bucle animado. El ojo humano es inmediatamente arrastrado a la parte de con-traste, movimiento, a medida que el fondo se queda quieto. Debido a su capacidad para destacarse, se vuelven viral muy fácilmente, y pronto será ampliamente utilizado por sitios de comercio electrónico y para publicidad en banners.
BOTONES DE CALL TO ACTION ANIMADOS
Botones CTA Un Call to Action o CTA (también llamado llamada a la acción) es un botón o enlace situado en nuestro site que busca atraer clientes potenciales y convertirles en clientes finales, normalmente a través de un formulario en una página de destino o landing page. Un CTA es el vínculo entre el contenido regular que el usuario consume y una página (landing page) con una oferta más interesante para nuestro usuario, que es lo suficientemente relevante e interesante para persuadirle a completar nuestro formulario. ¿POR QUÉ NECESITAMOS CALL TO ACTION? El Call to Action es un elemento indispensable cuando lo que buscamos es hacer que el usuario conecte con nosotros. Es muy importante segmentar bien a nuestro público objetivo y conocerlo en profundidad para elegir el mejor Call to Action en función a nuestros objetivos. ¿CÓMO HA DE SER EL CALL TO ACTION PERFECTO? Conviene seguir una serie de consejos para que tus CTA acaben siendo atractivos para tu audiencia y consigas aumentar notablemente tu ratio de clic:
DEGRADADOS Y DOUTONOS Los gradientes (o degradés) y duotonos son de hecho el mismo efecto, que consiste en “imprimir” una ima-gen en dos tonos del mismo color, o negro y un tinte de color. Por lo general se denomina así cuando se aplica a un fondo plano, siguiendo un patrón establecido (horizontal, circular, etc). Mientras que el duotono se utiliza frecuentemente para describir el efecto de aplicar sólo dos colores a cualquier imagen dada. La técnica de superposición de dos colores proviene de la industria de la imprenta. Ahora, como parte de una tendencia general en la que todas las cosas no digitales están resurgiendo, es hora de adoptar de nue-vo el degradé y las superposiciones de dos colores. Es justo decir que Spotify fue el actor más grande que lideró el camino para los duotonos, en 2016. El hecho de que Pantone haya elegido un par de colores como el color del año 2016 no dolió tampoco. Como demuestran las campañas de Spotify, los duotonos son perfectos para proceso de branding y por eso están siendo tan rápidamente aceptados por las marcas y editores de todo el mundo.
RETRO Brutalismo El diseño retro nunca pasará de moda. A medida que nuestra dependencia de herramientas y dispo-sitivos en línea crece, toda una generación anhela cosas con las que sus padres o hermanos mayores jugaron, ya se trate de imágenes Polaroid, vinilos o videojuegos de los años 90. En este sentido, todo un movimiento llamado Retro Wave ha traído de vuelta el estilo gráfico de los años 80: colores de neón, fondos de palmeras y todo lo que te recuerda a la era de Miami Vice. Incluso hay una herramienta en línea gratuita para generar efectos de texto y fondos ochentosos, el impre-sionante Retro Wave Generator.
DISEÑO TEXTIL La textura y la profundidad eran algo que Material Design puso sobre la mesa, después de haber sido una especie de algo “prohibido” por el Flat Design. Pero el diseño material dejó suelta a una bestia peligrosa. El diseño textil trae una mezcla de diferentes me-táforas de diseño, en su mayoría con características 3D. El objetivo es comunicar cómo se sentirían los objetos si pudiéramos tocarlos en lugar de simplemente verlos. Es como un puente entre el diseño material y el diseño skeuomórfico (un estilo donde todo lucecomo su contraparte en el mundo real). Esto podría llevarnos a la forma en que la web lucía hace 15 años.
MINIMALISMO EN BRANDING Y LOGOS El símbolo da más libertad Lo visual hace que las marcas puedan probar más productos, porque hace que las marcas se encasillen menos, y también que tengan más potencial para lanzarse a nuevos mercados geográficos. La imagen no necesita ser traducida.
Para una explicación más técnica de por qué a veces “menos es más” Entre otras razones, esto puede ser explicado de nuevo por el hecho de que toda la web pronto lucirá como una aplicación. En la interfaz de una aplicación, el logotipo y otros elementos de marca no deberían competir por la atención a expensas de funciones importantes para el usuario. Esta es la razón por la que el minimalismo para las marcas tiene sentido y vas a ver más y más de él en el futuro. Las marcas han ido afinando sus logos para que estos se conviertan en su pasaporte al mundo y lo han hecho simplificándolos y jugando con nuevos elementos.
COLORES VIVOS Y TIPOGRAFÍA Esta es otra tendencia que comenzamos a ver en 2016, alimentada por las paletas de color vivas defendidas por Google Material Design. Si bien aún no se adoptan ampliamente, sólo se harán más fuerte en 2017. Espera ver un montón de home y vlanding pages donde el color audaz y la tipografía sean los elementos principales.
El espacio blanco ya no tiene que ser tan blanco. Todavía se utilizará como una forma de dejar que los elementos brillen y darles espacio para respirar, pero ahora bien puede estar lleno de colores ricos y hermosos. Sin embargo, un poco de precaución: No todos los diseños pueden o deben usar paletas audaces de colores. De hecho, como sucede con todo lo que se vuelve una corriente principal, habrá una reacción a la tendencia: bastantes rebeldes se mantendrán fieles a los colores suaves y pasteles. Algo que de hecho irá mejor con otras grandes tendencias del año, como la Tipografía a Mano y las Texturas.
TIPOGRAFÍA Y CALIGRAFÍA No todo pueden ser ángulos rectos y patrones racionales. Tómalo como una reacción necesaria al estilo geométrico del diseño material: las tipografías de caligrafía manual serán más populares que nunca, y vendrán en más formas y tamaños que nunca antes. Esa es la belleza de usar una tipografía similar a la caligrafía manual: es más fácil transmitir un estilo único y personal.
AI (INTELIGENCIA ARTIFICIAL) PARA EL DISEÑO La inteligencia artificial ha llegado, y está cambiando la forma en que interactuamos diariamente con la tecnología. La mayoría del tiempo, incluso no nos damos cuenta cuando eso ocurre. Como diseñadores web, será importante no solo entender las bases del AI, sino también adaptar nuestros procesos y nuestra mentalidad como corresponde.
seis cambios importantes que los diseñadores necesitarán considerar:
1. Es tiempo de aprender lo que es la AI. Si bien aún no
es necesario que los diseñadores creen su propio HAL 9000, ente-nder lo básico de la AI, sobre todo en áreas relacionadas a Machine Learning (aprendizaje automático) y Deep Learning, brindará una gran ventaja.
2. Una vez que aprendes algunas bases, es tiempo de r
eunirte con los científicos de datos de tu preferencia. Al igual que hoy en día los diseñadores digitales colaboran casi constantemente con desarrolladores front-end, la misma colaboración con especialistas AI y científicos de datos será las relaciones del futuro.
3. Los bucles de retroalimentación de diseño serán más cortos. A medida que los métodos como el aprendizaje automático comiencen a ofrecer a los diseñadores información profunda y más precisa, los diseños necesitarán responder y adaptarse más rápido. A largo plazo, esto ayudará también a acelerar el tiempo requerido.
4. Los diseñadores necesitarán enfocarse (incluso más) en el “por qué”. Las analíticas
cuantitativas e información que provengan de los algoritmos del aprendizaje automático ayudarán a posicionar a los diseñadores en la dirección correcta, pero rara vez se destaparán comportamientos o motivaciones humanas subyacentes.
5. El mundo del AI acaba de abrir nuevos modos de interacción, y como diseñadores, necesitamos estar al día con ellos. Siri, Cortana y Aleza son asistentes digitales basados en AI personificados. Con la reciente apertura de Siri API de Apple, los diseñadores de aplicaciones pueden ahora usar comandos de voz para interactuar con sus aplicaci-ones. Hasta el momento, para la mayoría de las aplicaciones, esto solo nos permite hacer las mismas cosas que podíamos con una interfaz táctil, usando nuestras voces. Sin embargo, en los próximos meses y años, los diseñadores comenzarán a encontrar nuevos modos de interacción de voz que les permita interactuar con sistemas digitales en formas completamente nuevas.
6. Finalmente, ningún artículo sobre AI será completo sin considerar la privacidad.
La privacidad por el diseño seguirá siendo más y más importante a medida que creamos sistemas digitales y aplicaciones más inmersas, dinámicas y personalizadas.
GESTOS E INTERACCIÓN DE VOZ
Todos los sistemas operativos proponen diferentes formas de interactuar con los elementos en pantalla. Conocer la diferencia entre ellos y utilizar elementos familiares para el usuario, asegura que se sienta cómodo y seguro usando la aplicación. las interfaces de gesto y voz no son algo nuevo. Pero están a punto de volverse muy populares. 2017 será el año en que la mayoría de los usuarios dejarán de sentirse “extraños” al hablar con Google, Alexa, Siri o cualquier otra aplicación. Del mismo modo, los gestos para la interacción del usuario se convertirán en menos de una rareza.