Manual de animación de InVision: comunicar y emocionar a través del movimiento digital

Animation Handbook, InVision.

Acaba de estrenarse un pequeño manual gratuito de 72 páginas sobre animación digital producido por Design Better de InVision y escrito por Ryan McLeod (Animation Handbook). El manual se inspira en el tradicional lema de diseño ‘Muestra, no cuentes’ y su fin es dotar de emoción a las experiencias digitales.

Aprendiendo cómo puede usar la animación para demostrar conceptos abstractos y hacer que los productos se sientan más realistas.

Ryan McLeod, autor del manual residente en Amsterdam, ganó en 2017 el prestigioso Apple Design Award de accesibilidad, singularidad, juego e innovación de su aplicación para iOS Blackbox.

Dejaremos aquí algunas de las características del movimiento y la animación que se explican con detalle en el manual:

  • Comunica cambio y contexto.
  • Llama la atención.
  • Captura la emoción.
  • Invita a descubrir y a jugar.
  • Da vida a las aplicaciones.

A partir de estos conceptos, el autor explica con ejemplos los principales principios del movimiento, basados en aquellos postulados en el libro de la edad de oro de la animación de Frank Thomas y Ollie Johnston ‘Disney Animation: The Illusion of Life‘ .

The Illusion Of Life Disney Animation – Frank Thomas & Ollie Johnston
The Illusion Of Life Disney Animation es uno de los libros mas recomendados por cualquier animador profesional.

El tercer capítulo del manual está dedicado a explicar cómo la animación se ha convertido en una herramienta más del lenguaje del diseño, un elemento básico en la era digital que se debe tener en cuenta desde el inicio de cualquier proyecto.

Merece una mención la reserva de links y accesos a lecturas complementarias que encontramos al final de cada capítulo.

Las últimas páginas están dedicadas a las técnicas para llevar la animación un paso más allá con ‘fluidez, matices, consistencia y humanidad’.

Manual de vinilos exteriores, Señalética para centros de Quirón Salud

Iconografía Quirón Salud 2018

Señalización de exteriores
Iconografía y vinilos translúcidos, Clínicas Quirón Salud
2018
Prodigioso Volcán
Vinilos ácidos instalados sobre cristaleras.

Motivos conceptuales para representar disciplinas médicas.
Motivos conceptuales para representar disciplinas médicas.

Manual de señalización exterior, iconografía
Manual de señalización exterior, iconografía

Extracto del manual de señalización exterior, Quirón Salud
Extracto del manual de señalización exterior, Quirón Salud

Recreación del entorno de una fachada con los motivos instalados en las cristaleras.
Recreación del entorno de una fachada con los motivos instalados en las cristaleras.

Descripción de los paneles exteriores.
Descripción de los paneles exteriores.

Guía ilustrada de la composición de los paneles en cada cristalera.
Guía ilustrada de la composición de los paneles en cada cristalera.

Guía de producción de vinilos ácidos.
Guía de producción de vinilos ácidos.

Detalle de instalación real en un centro de Madrid.
Detalle de instalación real en el centro de Juan Hurtado de Mendoza, Madrid.

Vinilos al ácido, instalación en Juan Hurtado de Mendoza, Madrid, Clínicas Quirón Salud.
Vinilos al ácido, instalación en Juan Hurtado de Mendoza, Madrid, Clínicas Quirón Salud.

Vinilos en una cristalera
Vinilos en una cristalera

Fachada interior.
Fachada interior.

La cara oculta de los diagramas de relaciones

Visualizing graph Data
Visualizing graph Data

Corey L. Lanun

Manning Publications Co., 2017

208 pp $44

 

El experto en visualización Corey Lanum (Boston,  EEUU) nos acerca en este libro los conceptos principales de los diagramas de relaciones a través de una serie de introducciones prácticas y elementales a tecnologías como Gephy, Netlytic, Keylines y D3.

 

Apariencia de la aplicación Gephi para generar visualizaciones de relaciones.
Apariencia de la aplicación Gephi para generar visualizaciones de relaciones.

 

Gephy, Keylines y D3 aportan tres aproximaciones distintas al mundo de los ‘networks graphs’. Gephy es un software libre y gratuito que se descarga en el ordenador y permite, junto con la herramienta de análisis Netlytic, realizar este tipo de gráficos a través de un cuadro de mandos interactivo.

 

Apariencia de una visualización realizada con la librería de Keylines.
Apariencia de una visualización realizada con la librería de Keylines.

 

Keylines es una librería de javascript especializada en conectar miles de nodos a través de líneas para establecer relaciones y estudios sobre esa red. La desilusión: es una librería de pago y, por ello, no se podrán realizar los ejercicios incluidos en el libro. No preocuparse por ello.

 

Apariencia estática de una visualización realzada con la librería de javascript D3.
Apariencia estática de una visualización realzada con la librería de javascript D3.

D3 es la librería libre y gratuita de javascript más comentada en los  últimos años en los sitios de visualización y, por tanto, sólo añadiremos que el libro le dedica el último apéndice a modo de introducción breve en sus fórmulas para trabajar con nodos.

Corey Lanun (Cambridge Intelligence) nos enseña a organizar y construir una visualización de nodos a través de ejemplos sobre seguridad e inteligencia, seguridad en la red, lucha contra el fraude o infraestructuras sociales o tecnológicas.

El lector interesado puede seguir, en la segunda parte de este manual,  los elementos básicos de una base de datos, adentrase en el mundo de la interacción con la visualización y los mapas,  jugar con el factor tiempo y conocer los principales problemas de la navegación en los gráficos de nodos.

El contenido de este libro va mucho más allá que un sencillo manual técnico. Sus páginas contienen una buena guía sobre visualización y muy buenos ejemplos y consejos. Como muestra este último botón: ‘Los mejores diseños de visualizaciones llegan a través de conocer a los usuarios y las preguntas que se deben estar haciendo con los datos’. Lo dice Corey Lanun.

 

 

 

GRAPHICS: Fernando Rubio, Diario 16

En 1980, Pedro J. Ramírez metió a Fernando Rubio en Diario 16.
Con él estuvo hasta 1986, año en que pasó al ABC. Allí le tocó hacer de todo; lo más sonado: la victoria del PSOE en 1982, la guerra de las Malvinas y el 23F.

Todo ocurría en San Romualdo 26, muy cerca de Miguel Yuste, pegaditos a EL PAIS, en un descampado, junto a la rotativa. Algo que Fernando siempre recordaba: el papel prensa pasando por los pasillos, acercarse a ver el diario recién impreso…

La tienda de dibujo técnico SANCER (Fernando El Católico, Madrid) era (y es) un lugar común de los ilustradores madrileños para surtirse de todo tipo de dinamita.

José María Gallego aprendía a dibujar con la técnica de la plumilla del maestro Fernando (Güillot 303) asomado tras su hombro. En el mismo equipo estaba Julio Rey, Ángel Arribas (único en nómina, propietario del flexo, del teléfono, de las tramas y de la mesa de dibujo) y Ricardo Salvador, todos fusilando The Guardian y The Independent, periódicos de cabecera en aquella época de Pedro J.

Después, Diario 16 se mudaría a la calle Albasanz. Allí ilustraron y graficaron Gerardo Ametxazurra, Joaquín Leirado… Pero esa es otra historia.
Pasaron los años. Muchos.

Diario 16 cerró en 2001.
EL MUNDO adquirió entonces el archivo de Diario 16.
El archivo ha dado vueltas y más vueltas, de Diario 16 a un polígono industrial en las afueras de Madrid, de allí a la calle Pradillo. Sé que fue saqueado en varias ocaciones, en especial el archivo de fotografías.
Allí perdimos la pista.

Ayer se nos ocurrió preguntar.
Y, ¡sorpresa! Se encuentra en los sótanos de Avenida de San Luis, en una habitación que se inundó. Y resulta que ha sido digitalizado últimamente. Hay que buscar disco a disco.
Probamos con uno.
Eureka. Ahí está el trabajo de Fernando.

Van unas muestras. Todas realizadas a mano por el equipo de Diario 16.
Meses de abril y mayo de 1982. Como observaréis, la producción del reducido equipo era brutal.

Gracias por visitar el sitio de Juantxo Cruz

Su firma se reconoce en todos sus trabajos.
DIARIO 16
1982

Gracias por visitar el sitio de Juantxo Cruz

Analisis Militar
DIARIO 16
1982

Gracias por visitar el sitio de Juantxo Cruz

Como caza un torpedo
DIARIO 16
1982

Gracias por visitar el sitio de Juantxo Cruz

Al Cesar lo que es del Cesar
DIARIO 16
1982

Gracias por visitar el sitio de Juantxo Cruz

Grafico Sono-boyas
DIARIO 16
1982

Gracias por visitar el sitio de Juantxo Cruz

Portada del 5 mayo de 1982
Malvinas.
Portada del diario.
DIARIO 16

Gracias por visitar el sitio de Juantxo Cruz

Mapa de situación de la guerra. 1982.
Hundimiento del crucero ‘General Belgrano’.
DIARIO 16

Gracias por visitar el sitio de Juantxo Cruz

La fuerza Argentina.
Combates en 1982.
DIARIO 16

De estos hay un buen puñado (La fuerza británica…)

Gracias por visitar el sitio de Juantxo Cruz

Resistencia en las Islas Malvinas.
1982.
DIARIO 16

Gracias por visitar el sitio de Juantxo Cruz

Infografía sobre los ataques de los Sea Harrier.
Combates, 1982.
DIARIO 16

Gracias por visitar el sitio de Juantxo Cruz

Combate submarino.
1982
DIARIO 16

Gracias por visitar el sitio de Juantxo Cruz

Página completa.
Un ‘T-Bone’
1982
DIARIO 16

Gracias por visitar el sitio de Juantxo Cruz

Análisis militar, Infografia combates
1982
DIARIO 16

Gracias por visitar el sitio de Juantxo Cruz

Otra página completa.
Hombres y computadoras.
1982
DIARIO 16

Gracias por visitar el sitio de Juantxo Cruz

Juicio 23F 1982 General Prieto
1982
DIARIO 16

Gracias por visitar el sitio de Juantxo Cruz

Juicio 23 F Tejero y compañia
1982
DIARIO 16

Gracias por visitar el sitio de Juantxo Cruz

La Thatcher ordena los ataques
1982
DIARIO 16

Gracias por visitar el sitio de Juantxo Cruz

Lecciones Militares
1982
DIARIO 16

Gracias por visitar el sitio de Juantxo Cruz

Operaciones britanicas 1982
1982
DIARIO 16

Gracias por visitar el sitio de Juantxo Cruz

Portada Tejero
1982
DIARIO 16

Gracias por visitar el sitio de Juantxo Cruz

Gallego y Rey
Caricatura Thatcher
1982
DIARIO 16

Gracias por visitar el sitio de Juantxo Cruz

Infografía de Ángel Arribas
1982
DIARIO 16

Gracias a José María Gallego, a Emilio Amade y al diario EL MUNDO, sin los cuales este post no hubiera sido posible.

GRAPHICS: Sexual ToolKit, UNFPA

Adolescent Sexual and Reproductive Health Toolkit for Humanitarian Settings.
United Nations Population Fund y Save the Children USA, junto con ONGs y la Universidad de Columbia.
Diciembre de 2009.

Gracias por visitar el sitio de Juantxo Cruz

Diagrama de los Derechos Humanos que protegen los derechos sexuales y reproductivos de los adolescentes, Naciones Unidas.

Definición de adolescente:
What is adolescence? Adolescence is defined as the
period between 10 and 19 years of age. It is a continuum of
physical, cognitive, behavioral and psychosocial change that is
characterized by increasing levels of individual autonomy, a growing
sense of identity and self-esteem and progressive independence
from adults.

‘The Toolkit was created by Save the Children and UNFPA, under the guidance of a Technical Advisory Group comprised of WHO, UNICEF, UNHCR, Women’s Refugee Commission, IRC, RAISE, Pathfinder International, JSI, CDC and Columbia University’.

!Gracias por visitar mi sitio! | Copyright © 1992- 2024 juantxo_cruz. Todos los derechos reservados.