Cómo crear fácilmente una fuente de texto propia

Para crear una fuente de texto con nuestras propias letras una página recomendable es MyScriptFont.

El funcionamiento de la página es muy sencillo. Se descarga la plantilla en formato PDF o PNG y se imprime o se abre con un editor de imágenes.

Una vez tengamos la plantilla impresa o abierta en un editor de imágenes escribiremos en cada casilla su carácter correspondiente (no es necesario cubrirlos todos) respetando los márgenes y preferiblemente con un trazo negro y medianamente grueso.

Cuando esté lista se guarda la imagen o se escanea con una resolución de entre 300 y 600 dpi y se sube a la página examinando la imagen.

En el apartado "Name your font:" escribimos el nombre que queramos que tenga la fuente.

Para generar la fuente le damos a "Start" y la página vectorizará y organizara todos los caracteres en un archivo TTF que podremos instalar.

Para comprobar que nuestra fuente funciona basta con ir a un editor de texto, buscarla, seleccionarla y probar a escribir algo con ella.

Cómo vectorizar un mapa de bits con Inkscape

La diferencia entre un mapa de bits y un gráfico vectorial es que el mapa de bits está formado por un conjunto de píxeles mientras que el gráfico vectorial está formado por formas geométricas definidas por ciertas instrucciones. Con Inkscape se pueden convertir imágenes de mapa de bits en gráficos vectoriales con distintos ajustes.

Una vez que se tenga la imagen en un documento de Inkscape se va a Trayecto > Vectorizar mapa de bits y se abrirá esta ventana.

 
En el caso de que lo que queramos sea obtener un gráfico vectorial con diferentes colores seleccionamos "Colores" y en el apartado "Pasadas" seleccionamos el numero de colores que queramos. Una vez ajustado se le da a "Aceptar" y nos generará el mapa vectorial

Este es el resultado

Otro caso distinto es si tenemos por ejemplo un escaneo de un dibujo que queremos pasar a trazos vectoriales.

En este caso se selecciona "Corte de luminosidad" y se ajusta el "Umbral" hasta encontrar uno que se adecue a nuestras necesidades.

  

Este es el resultado

Herramienta Cámara | Adobe Animate CC (Flash)

Anteriormente, si se quería hacer un efecto de movimiento de cámara en flash o en las primeras versiones de animate se tenia que recurrir a mover todos los símbolos del documento a la vez o utilizar un script. Pero ahora tenemos la herramienta "Cámara" que nos permite hacer movimientos, zooms y giros de la pantalla fácilmente.

Para aplicar una cámara a la linea de tiempo se selecciona la herramienta "Cámara" y automáticamente se añadirá una nueva capa a la linea de tiempo que contendrá la cámara.

 Mientras tengamos esa capa seleccionada aparecerá en la parte inferior del escenario un deslizable junto a unos botones.

 Con ese botón seleccionado el deslizable ajustará el zoom de la cámara.

  Con ese botón seleccionado el deslizable ajustará la rotación de la cámara.

La cámara funciona de forma similar a los símbolos, ya que se le puede poner interpolaciones de movimiento y algunos efectos de color.

Animación con Adobe Animate | Prinicipios adicionales de la animación | Smears

Además de los 12 principios de la animación originales existén algunos más que se han ido desarrollando con los años, en este caso comentaremos el "smear".

En la animación 2D se conoce como smear a un tipo especial de interpolación. En ellos se presenta una gran deformación del objeto (estirándolo o duplicándolo), pero al tener una duración muy corta no se llegan a apreciar directamente. El efecto es similar al desenfoque entre los fotogramas que graba una cámara de vídeo con poca velocidad de obturación (motion blur).

"Smear" en la vida real (motion blur). Tomado de Wikipedia.

Con este principio evitamos hacer varios fotogramas con la interpolación exacta entre los fotogramas, lo que nos puede ahorrar mucho tiempo. Por esa razón se suele incluir esté principio dentro de la animación limitada, sin embargo, no es extraño encontrarla dentro de animaciones completas.

Existen dos tipos básicos de smears:

Smear de estiramiento

Su realización depende mucho de la animación, pero básicamente se trata de activar el papel cebolla y entre el fotograma inicial y final hacer un dibujo que, en lugar de una posición intermedia, sea un alargamiento entre el dibujo inicial y final. Luego entre el fotograma del smear y los extremos se duplican los extremos y se mueven ligeramente hacia el smear.

Los extremos y el smear estirado

Smear de repetición

Su realización es igual a la del estiramiento, pero en lugar de un estiramiento es una fusión de todos los fotogramas intermedios que debería tener entremedias. Este es un poco más complicado de hacer que el anterior, pero suele dar mejores resultados.

Los extremos y el smear repetido

Animación con Adobe Animate | 12 principios de la animación | Índice

Los 12 principios de animación son unas reglas básicas que se deben de seguir para cear animaciones más realistas. Estos principios ayudan a crear una ilusión de que los personajes y los objetos obedezcan a leyes físicas.

Hemos recogido, explicado, y puesto ejemplos de cada uno de los principios en diferentes entradas del blog:

1. Estirar y encoger
2. Anticipación
3. Puesta en escena
4. Animación directa y pose a pose
5. Acción continuada y superposición
6. Entrada y salida lenta
7. Arcos
8. Acción secundaria
9. Ritmo
10. Exageración
11. Dibujos sólidos
12. Appeal 

Estos principios fueron descritos por los animadores de Disney Ollie Johnston y Frank Thomas en su libro The illusion of life.

Animación con Adobe Animate | 12 principios de la animación | Appeal 12/12

Mal appeal

El principio de appeal (lo que puede ser traducido como algo similar a atractivo o carisma) se refiere al diseño de los personajes, de como este comunica su personalidad, su simpleza y como resultan "interesantes" al espectador.

Aunque se pueda traducir como lo atrictivo o carismático que es un personaje, no tiene porque ser así. Un personaje malvado o un monstruo no suele ser atractivo o carismático, pero sí que pueden tener appeal, refiriendose a lo interesante que sea su diseño y las sensaciones que su apariencia transmita.

Animación con Adobe Animate | 12 principios de la animación | Dibujos sólidos 11/12

Este principio se refiere a que se debe de tener en cuenta que aunque sea una animación en 2D lo que está representando (en la mayoría de los casos) es un mundo tridimensional, por lo que se debe dar a las formas una sensación de profundidad, volumen y peso.

Si se tiene un dibujo sólido, aparte de verse mejor, la animación de las partes será más sencilla, ya que se sabe con mayor precisión que movimiento hará.

Ejemplo

Este efecto se aplica a los personajes. En lugar de dibujarlos pensando en ellos como una figura plana, se deben de dibujar pensando en ellos (y tomando como guía) figuras tridimensionales.

Animación con Adobe Animate | 12 principios de la animación | Exageración 10/12

El principio de exageración se refiere al hacer más brusca una acción para que no parezca estática y aburrida.

La exageración  puede darse en distintos grados, desde hacer que una cara asustada abra mucho la boca hasta hacer que a un personaje le salgan los globos oculares de las órbitas, todo ello depende del estilo de la animación.

No es recomendable abusar de la exageración en una misma escena, ya que puede causar confusión en el espectador, debe existir un equilibrio.

Ejemplo

Un ejemplo de exageración muy reconocible se da en las expresiones faciales de los personajes. Si está contento, en lugar de que tenga una pequeña sonrisa podemos hacer que enseñe todos los dientes y tenga las mejillas muy levantadas. Y si queremos hacer que un personaje esté enfadado, en lugar de hacer que frunza el ceño podemos hacer que las cejas estén muy diagonales, que se hagan arrugas en la frente o incluso dibujarle venas.

También depende mucho del estilo de la animación, pero generalmente esos detalles puedes hacer que la animación sea más atractiva visualmente y divertida de ver.

Animación con Adobe Animate | 12 principios de la animación | Ritmo 9/12

El principio de ritmo (timing en ingles) se refiera a la cantidad de celdas que se usan en una acción y la duración de cada uno. Este principio determina la velocidad de una acción y su fluidez.

Velocidad de una acción

https://www.dropbox.com/s/d47x9v7rfctjvf8/bolasrapidolento.swf La velocidad de una acción es determinada por la cantidad de fotogramas que tiene y la diferencia entre cada uno de ellos

Si una acción está compuesta de pocos fotogramas muy distanciados, esta será rápida y su duración será corta, mientras que si tiene muchos fotogramas poco distanciados, será lenta y de duración larga.

Fluidez de una acción

La fluidez de una acción está determinada por la duración de las celdas. Existen dos tipos de duración principales:

Animación en unos

En este tipo de animación las celdas duran un fotograma. Se ve más fluida que la "en doses" y es mucho más recomendable en acciones rápidas.

Animación en doses

En este tipo de animación las celdas duran dos fotogramas. Se tienen que dibujar menos que la "en unos" y en algunos casos la diferencia de fluidez no se aprecia. También es recomendable usarla en acciones lentas, ya que la "en unos" tiende a hacer que los bordes tiemblen.

Animación con Adobe Animate | 12 principios de la animación | Acción secundaria 8/12

Este principio se refiere a las acciones secundarias, acciones que complementan a la principal y surgen a partir de está. Sirven como apoyo de la acción principal, pero se debe evitar que éstas la eclipsen, desviando de ella la atención.

En los personajes, las acciones secundarias pueden ser por ejemplo mover las manos (acción secundaria) mientras habla (acción principal) o rascarse la cabeza (acción secundaria) mientras camina (acción principal).