Inicio

Auto animaciones con Adobe XD

Deja un comentario

Una de las prestaciones que se han añadido últimamente a Adobe XD, la aplicación para creación de interfaces y prototipos interactivos, es la función Auto-animate que permite crear animaciones de un modo muy sencillo obviando una línea de tiempo.

Este tipo de animación puede crear efectos dinámicos de interacción que permite al diseñador de UX conseguir increíbles efectos y transiciones que serían mucho más laboriosos de confeccionar de otro modo, como programación CSS por ejemplo.

El método de confeccionar este tipo de animaciones es tan simple como efectivo: Se colocan unos elementos en un artboard o mesa se trabajo de origen y se vinculan con un artboard o mesa de trabajo de destino. Los elementos que tengan el mismo nombre en ambas mesas adaptarán su forma, tamaño, posición, color y atributos desde el artboard de origen hasta el artboard de destino siguiendo una interpolación que puede ajustarse con diferentes curvas y suavizados de aceleración. Si el objeto de origen no existe en el artboard de destino, éste simplemente se funde a transparencia. Asimismo un objeto que exista en destino pero no tenga un equivalente en origen aparecerá con un fundido desde transparente al opacidad. Este método produce transiciones y animaciones suavizadas de forma muy rápida. El porque no se ha introducido una línea de tiempo que permitiría realizar efectos de animación aún más elaborados está muy bien explicado en el siguiente artículo de Oliver Lindberg https://theblog.adobe.com/auto-animate-how-to-create-automatic-animations-xd/ y que básicamente viene a decir que lo que se buscaba era el perfecto equilibrio entre sencillez de uso de la interfaz y obtención rápida de buenos resultados. En ese sentido hay que reconocer que el objetivo se ha conseguido. Siempre tienes herramientas más especializadas como Animate o After Effects si lo que quieres es conseguir animaciones más complejas.

Aún así no penséis que la función de auto-animación de XD se limita a transiciones básicas entre interacciones, se pueden llegar a conseguir resultados realmente interesantes y que podrían funcionar como animaciones autónomas tal y como se puede apreciar en este pequeño tutorial

Mi primer contacto con Adobe Fresco

Deja un comentario

Un primer boceto con la herramienta de lápiz

Tras el anunciado tiempo de espera por fin Adobe Fresco ya está disponible para iPad en la App Store.

Como no podía ser de otra manera, en seguida lo descargué y empecé a trabajar con él. En líneas generales estoy bastante contento con el resultado y eso que al principio no las tenía todas conmigo ya que las pruebas que puede realizar con las versiones beta de uso interno que se distribuyeron en Adobe me habían dejado algo de mal sabor de boca sobretodo en lo referente a rendimiento y uso de recursos del hardware del iPad. Cabe destacar que está pensada especialmente para aprovechar aquellos modelos que incluyen lápiz. Pienso que utilizar el Apple pencil es obligatorio para aprovechar al máximo la experiencia.

Por suerte la versión final que ha salido a la luz se ve y se siente mucho más rápida, dinámica y ágil que las pre-releases anteriores.

La app claramente se presenta como una fusión de Adobe Sketch y Adobe Draw a las que está llamada a sustituir. Frente a este hecho tan obvio como incontestables tengo sentimientos encontrados, porque si bien a nivel global se ha mejorado mucho en cuanto a solución hay algunas prestaciones de las apps en las que se basa que se echan peligorsamente de menos aquí. Paso a enumerar en que cosas creo que se ha salido ganando y en que cosas da la sensación de que hay una especie de paso hacia atrás.

Primera pruebas con los pinceles vivos de óleo

Lo que se ha mejorado

Lo mejor de los dos mundos

El hecho de tratarse de una fusión de Adobe Sketch (mapa bits) y Adobe Draw (Vectorial ) y poder tener lo mejor de ambos mundos en una sola aplicación es, sin lugar a dudas un gran acierto. Las capas bitmap y vectoriales se colocan en capas separadas y luego es posible exportar el documento como PDF para poder conservar toda la información en el mismo fichero.

Además cuantos te autentificas por primera vez en la app, esta importa automáticamente todos los proyectos que tenías en Adobe Sketch y Adobe Draw. Simplemente genial.

Pinceles heredados

Aparte de que la colección de pinceles por defecto es fantástica (debemos agradecerle el buen trabajo a Kyle Webster y al equipo de ingenieros de Adobe) podemos utilizar todos los pinceles de Photoshop y los que anteriormente hubiéramos importado en Adobe Sketch que son incorporados automáticamente a nuestra paleta de pinceles bitmap junto con los que tuviéramos definidos en nuestras bibliotecas de Creative Cloud a partir de Adobe Capture. Todos ellos aparecen disponibles desde el primer momento de una forma totalmente transparente. Esto es absolutamente fantástico. En mi caso, dentro de Adobe Sketch tenía importados todos los pinceles de Kyle Webster. La idea de volver a repetir la misma operación ahora en Fresco me causaba una mezcla vértigo y pereza, así que cuando vi que automáticamente aparecían allí sin haber hecho yo nada (aparta e de autentificarme con mi Adobe ID) fue todo un subidón de adrenalina.

Pinceles vivos

Es probablemente la adición más sorprendente de la aplicación. El trabajo de los ingenieros de Adobe aquí ha sido simplemente increÍble. Se han añadido pinceles de acuarela y Oleo que se comportan de firma casi idéntica a cómo lo hacen sus equivalentes en el mundo real.

La acuarela se mezcla con tal ductilidad que parece que vaya a mojar la pantalla de iPad, de hecho se puede apreciar la animación de los colores fundiéndose entre sí que es ya de por sí todo un espectáculo. La mezcla de colores de óleo también está muy bien conseguida. De hecho, cuando estaba intentando mezclar dos colores con uno de los pinceles las sensaciones que tuve me recordaron mucho a las que tenía cuando intentaba mezclar esos mismos colores con óleos reales en mis tiempos de estudiante. Es esa sensación de que crees que vas a aplicar un color y cuando lo colocas sobre el lienzo se mancha con el color que hay debajo obteniendo un tono muy diferente y que si intentas tapar añadiendo más color aún contamina más la mezcla hasta que te das cuenta que la forma de “dialogar” con el óleo es otra y que no puedes adoptar la misma estrategia que cuando aplicas los colores opacos directos típicos de la paleta digital.

Botón modificador

Otra de las adiciones que me han gustado ha sido el del botón modificador. Se trata de una mejora de interfaz muy acertada en mi opinión. Consiste en un botón circular que puedes arrastrar por el lienzo y que, si mantienes pulsado con la mano en la que no sujetas el lápiz, activa una acción alternativa para este último. Por defecto la acción seleccionada es sustituir la acción de pintar por la de borrar con el mismo pincel que haya seleccionado , lo cual es ideal para controlar los claro-oscuros, pero se puede configurar para que efectúe otro tipo de acción.

Suavizado de pincel

Aparte de los controles habituales de transparencia, tamaño hay un completo configurador de comportamiento respecto a la presión, velocidad o inclinación del lápìz. También se añade un control de suavidad del trazado del pincel que puede ajustarse de 0 a 100 y que permite armonizar el trazo que se va realizando con el pincel que se tenga escogido facilitando de esta manera la obtención de curvas orgánicas y precisas.

Herramientas de selección

Se ha hecho un muy buen trabajo con las herramientas de selección que permiten enmascara y transformar elementos de la imagen tanto de capas vectoriales como bitmap. Es especialmente útil y efectiva la herramienta de pincel de selección, que incluye sensibilidad a la presión y que permite crear una selección dibujándola sobre el lienzo lo que hace posible realizar selecciones de gran precisión.

Buzón de sugerencias

Adobe Fresco incorpora en su interface un formulario para lanzar sugerencias para próximas versiones. Yo ya estoy preparando mi lista de mejoras para hacerla llegar. Me parece un gran acierto por parte de Adobe, hace falta ver si desde product management hacen realmente caso y uso de la sugerencias o si se trata más bien de una función de cortesía. Y no… no por ser empleado de Adobe os penséis que me van a hacer a mí más caso que a cualquier otro usuario.

Lo que se echa de menos

Las guías geométricas

Una de las funciones que más me gustaban de las últimas versiones de Adobe Draw y Adobe Sketch era el conjunto de guías para trazar fácilmente líneas rectas, óvalos y otras formas geométricas. Ahora ya no tenemos estas guías (al menos de momento). Es cierto que pueden utilizarse las selecciones rectangular y elíptica con el mismo propósito pero, como se suele decir… no es lo mismo, ese procedimiento no es tan efectivo ni rápido

El relleno directo de Adobe Draw

Una de las grandes funciones de Adobe Draw es la capacidad de rellenar un espacio cerrado tan sólo manteniendo presionado el lápiz sobre el lienzo. El éxito de esta función fue tal que, con las diferentes versiones, se acabó eliminando de la paleta la herramienta de bote de pintura que estaba al inicio pero que casi nadie utilizaba. En Fresco se recupera la herramienta de bote de pintura porque la función de relleno manteniendo la presión se ha eliminado. En eso pienso que se ha dado un paso atrás.

El suavizado “después de dibujar” de Adobe Draw

Ya he mencionado antes la adición del nuevo control de suavizado de pincel para todos los pinceles de Fresco, sin embargo este tipo de suavizado se realiza mientras se dibuja el trazo, lo cual puede ser útil para un tipo de dibujo determinado, pero se echa de menos el segundo tipo de suavizado que incorporaba Adobe Draw que era el suavizado “después” de realizar el trazo, es decir Draw respeta tu trazo original mientras lo estás haciendo y , al levantar el lápiz, lo recalcula y lo estiliza para armonizarlo. Este tipo de suavizado permite conseguir muy buenos resultados trabajando de una forma rápida. Me gustaría mucho recuperarlo en Fresco para no tener que echar de menos a Draw y es algo que pienso sugerir en el apartado que incorpora la app para tal propósito.

Abrir directamente en Illustrator Photoshop

Aunque la app te deja exportar en multitud de formatos, incluido PDF que conserva la información vectorial, la verdad es que se echa de menos las funciones de abrir directamente el dibujo en Photoshop o Illustrator. Imagino que esto es algo que aún no se ha incorporado porque aún no deben haber resuelto algún punto técnico de como enlazar la app con Photoshop o Illustrator, pero me cuesta creer que esta función no se vaya a recuperar en próximas versiones.

Que me gustaría Ver

Hay algunas prestaciones que me gustaría ver incorporadas en la app y que pienso sugerir, en apartado creado especialmente para ello, aunque dudo bastante que alguna de ellas llegue a buen puerto, pero por intentarlo no va a ser

Rellenos degradados

Es algo que hace ya tiempo que me gustaría haber visto incorporado en Adobe Draw y es la posibilidad de seleccionar una forma vectorial y rellenarla de un degradado lineal o radial de forma similar a como se hace en Adobe Animate. Las posibilidades de acabado que se abren con ello son increibles.

Publicación directa en Adobe Stock

Para los que somos contribuidores de ilustraciones y vectores en Adobe Stock estaría muy bien poder publicar nuestras obras en el market de Adobe Stock directamente desde Adobe Fresco.

Boceto realizado en Adobe Fresco con pinceles de Photoshop

En definitiva Adobe Fresco es una gran aplicación. Pienso que Adobe ha hecho un gran trabajo aunque confío que se vayan añadiendo más mejoras en el futuro. A buen seguro será una de mis aplicaciones más utilizadas en el iPad a partir de ahora.

Preparando el Inktober 2019

1 comentario

Hace casi un año participé en mi primer Inktober, ya sabéis, ese reto ideado por Jake Parker en 2009 y que consiste en crear una ilustración a tinta cada día durante el mes de Octubre. En este link ya comenté cuales fueron mi impresiones.

Se puede dibujar lo que uno quiera pero siempre se edita una lista oficial con ideas por si te quedas en blanco o sencillamente quieres retar a tu imaginación a partir de los términos que sugieren.

Aquí os dejo la lista traducida al español que he obtenido del site notodoanimacion.es

Ya os adelanto que no voy a realizar el reto completo por razones que, en parte, ya explicaba en el artículo que he enlazado al inicio del post, pero básicamente se debe a la previsión de que, muy probablemnte, no voy a tener tiempo y ánimos para completar toda la lista. De hecho mi reto sería realizar al menos cinco ilustraciones. Veremos que sale al final.

Colgaré el resultado en este mismo blog.

Feliz Inktober a todos!!

Psicodelia digital

Deja un comentario

Los enteógenos son un tipo de drogas que se caracterizan por su carácter alucinatorio. Sustancia como el LSD, el DMT, las psilocibina o la mescalina tienen, según cuentan, la capacidad de abrir nuevas puertas a la percepción y hacernos visualizar nuevos mundos dentro (o fuera) de éste llenos de vicos colores y danzantes figuras geométricas. Además se puede aumentar nuestra compresión del tiempo, el espacio y la naturaleza de la existencia misma. Esto es lo que se conoce como el “viaje” o “trip”

Por lo visto son sustancias que no dejan secuelas o efectos secundarios y que sin embargo ayudan a expandir el nivel de conciencia y profundizar en la espiritualidad.

Si te interesa explorar el tipo de realidad al que abren estas sustancias pero no quieres correr el riesgo de tener un mal viaje (que también los hay, antención) siempre te queda la opción de probar este software en línea Deep Dream Generator. Se trata de una serie de algoritmos creados por el progamador Alex Mordvintsev, junto a Christopher Olah y Mike Tyka que permiten crear imágenes con un aspecto totalmente psicodélico a partir de cualquier tipo de fotografía.

Muchos psiconautas veteranos aseguran que las imágenes que se consiguen con algunas de las combinaciones de los ajustes son muy similares a las que han visto en sus viajes enteogénicos. No deja de ser curioso también que tal y como se comenta en este artículo, que cuando se intentó crear una algoritmo para tratar de interpretar y reconocer imágenes de la realidad el resultado fuera algo tan parecido a las imágenes que emergen en el cerebro tras la ingestas de piscodélicos.

Os dejo aquí algunos de los primeros experimentos que he realizado con este software y la imagen de la cual partí para que vosotros mismos podáis comparar. Aunque, lógicamente, lo mejor es que probéis por vosotros mismos con vuestras propias fotos. https://deepdreamgenerator.com/

PSYOne.jpg

PSYTwo.jpg

PSYThree.jpg

20 Aniversario de InDesign

Deja un comentario

ID20y.jpg

Hoy toca día de celebración. InDesign la herramienta de  creación de publicaciones multi-página de Creative Cloud cumple 20 años.

Aún recuerdo cuando apareció en el mercado. Todo el mundo lo consideraba una apuesta arriesgada de Adobe frente al todopoderoso Quark Xpress que tenía el casi monopolio de facto del software de creación de publicaciones. En aquellos entonces la mayoría de la prensa especializada se mostraba escéptica respecto a aquel movimiento estratégico de la compañía y no le daban mucha esperanza de vida aquel David que aspiraba a competir con el Goliat que era Quark Xpress.

Sin embargo, por suerte para Adobe, hubo clientes que decidieron darle una oportunidad a este software. Hay que decir que las políticas comerciales, un tanto arrogantes, que por entonces tenía Quark, contribuyeron en gran medida al éxito inicial de In Design. Muchos clientes estaban cansados de tener que lidiar con unos precios de licencias que se aprovechaban claramente de la posición líder que Quark Xpress tenía entonces en el mercado y de un servicio técnico (sobre todo el relacionado con la sustitución de “dongles” de protección anti-copia del software que salían defectuosas) que a veces dejaba mucho que desear y que llegaba a provocar pérdidas en empresas que, impotentes, veían como sus productos no podían salir a tiempo mientras que la competencia desleal les pasaba por delante con copias piratas del software.

Esto, junto con el buen hacer de Adobe que, a pesar de una primera versión de InDesign un tanto irregular en cuanto a rendimiento y estabilidad, siguió apostando por la aplicación, escuchando a sus clientes y dando soluciones a todos los niveles versión tras versión, hizo que el guión que todo el mundo preveía cambiara drásticamente.

En la versión 2.0 se mejoró mucho el funcionamiento, empezó a correr el boca a oreja, los clientes empezaron a migrar, primero poco a poco y luego en masa de Quark Xpress a In Design. Cuando Quark quiso darse cuenta, InDesign les había adelantado por la derecha a toda velocidad y la reacción de Quark fue, en mi opinión, tardía, poco estudiada y demasiado confiada en una posición de liderazgo que demostró no ser tan sólida (nínguna lo es) como habían pensado. Adobe jugaba con la baza de su integración con el resto de herramientas de Creative Suite y Quark demostró no tener capacidad de reacción a la hora de sacar nuevas versiones. Estaban acostumbrados a actualizar la herramienta sin prisas y apenas aparecía una nueva versión de Quark Xpress, venía en seguida una nueva de InDesign que mejoraba con creces tanto a su anterior versión como al propio Quark Xpress.

El resultado fue que InDesign acabó dándole la vuelta al pastel del mercado en un tiempo record desbancando por completo a Quark Xpress de su liderazgo. Hoy día no son pocos los diseñadores jóvenes que ni siquiera han oído hablar de esta aplicación y casi ninguno le sigue la pista ni sabría decirte por que versión va (sigue existiendo, por si te lo estabas preguntando), a pesar de haber sido el líder absoluto de software de pre-impresión y publicación de finales del pasado siglo.

Adobe también aprendió la lección. Quedó claro que ser el líder del mercado no te da ninguna garantía de seguir siéndolo si abandonas la senda de la innovación y la mejora continua y…bueno, el resto de la historia ya la conocéis.

El caso,  es que Adobe ha preparado una serie de plantillas gratuitas en su blog para celebrar esta efeméride. Aquí está el enlace. Espero que las disfrutéis.

Gráfico de InDesign Secrets: https://indesignsecrets.com/indesign-turns-20-years-old.php