DARVA - Asistente de eventos

DARVA es un simpático robot animado que nos ayudará en los eventos, charlando con la gente para que no tengamos que repetirnos demasiado.

Descripción general

• Introducción y video de presentación
• Robot analógico
• Robot digitalizado
• Asistente virtual
• Raspberry Pi 4
• DARVA

Video de presentación y presentación

DARVA es un simpático robot animado que nos ayudará en los eventos, charlando con la gente para que no tengamos que repetirnos demasiado.

Dato curioso:DARVA es el acrónimo de " D A igitizado nalog R obot V A virtual ssistant ”.

Robot analógico

El primer paso es crear un robot analógico, o lo que te apetezca animar, con fieltro. Dibujé un robot e hice partes de papel. Una vez que estuve satisfecho con el aspecto general, corté todo de fieltro.

Consejo:tome fotografías de las piezas de fieltro intactas antes de comenzar a cortar, ¡puede usarlas como fondo para sus animaciones!

Bien, ahora pasemos a la parte que consume más tiempo:¡coser! Cosí a lo largo de todos los bordes para darle a DARVA ese aspecto y tacto hechos a mano. Algunas partes son de doble capa de fieltro, para que sean un poco más resistentes. Asegúrese de mantener separadas todas las partes que desea animar, ¡eso le facilitará la vida más adelante!

Robot digitalizado

¡Es hora de digitalizar lo analógico que acaba de hacer! Extienda todas las partes sobre un fondo distintivo, ya que eso hará que sea más fácil cortar todo en partes. Es mejor tomar una foto con todos los elementos en ella, para que la escala de las partes permanezca igual.

Consejo:Gire todas las partes de la forma en que las organizaría en la animación, ya que esto mantendrá el mismo ángulo de iluminación en todas las partes y realmente unirá todo en la versión final.

Cargue la imagen en el software de edición de fotografías de su elección y recorte todas las partes. Guárdelos individualmente con un fondo transparente en un formato de archivo que admita transparencia, como PNG.

Para recortar las partes, utilicé la herramienta de selección rápida en Photoshop. En realidad, los resultados fueron mejores de lo que esperaba, y solo tuve que borrar cosas manualmente en un puñado de imágenes.

¡Ahora tiene una cosa analógica digitalizada que está lista para ser animada!

Asistente virtual

Para darle vida a DARVA, creé una página web con lienzo HTML y JavaScript, ya que funcionará en cualquier plataforma. Al descargar todas las bibliotecas, también funcionará sin conexión, lo cual es importante porque los eventos son notoriamente malos para proporcionar una conexión a Internet confiable ...

En resumen:con el elemento lienzo HTML puede agregar gráficos como imágenes, formas y textos a una página web usando JavaScript. Para facilitar este proceso y agregar animaciones fluidas, utilicé las bibliotecas Create.js y Tween.js que puede encontrar aquí.

El código se agrega en un archivo adjunto y hace lo siguiente:

• Cargue las imágenes
• Escale y gírelos
• Asignar una coordenada X e Y en la página
• Animar todas las cosas

Algunas de las animaciones tienen un poco de aleatoriedad agregado, para hacer que DARVA sea más realista. Bueno, tan realista como puede ser un robot, por supuesto. El medidor gira a una posición aleatoria, por ejemplo, y los ojos miran aleatoriamente hacia la izquierda o hacia la derecha durante un período de tiempo aleatorio.

Otras animaciones están más calculadas, como el texto en el bocadillo que cambia cada 5 segundos.

Por último, algunas animaciones se activan haciendo clic o tocando partes de la pantalla, en este caso la cabeza y el vientre de DARVA.

Raspberry Pi 4

Finalmente, ¡ejecutemos DARVA en la Raspberry Pi 4! ¿Por qué? ¿Bueno, por qué no? ¡Es increíble que algo tan pequeño pueda manejar ese tipo de animaciones!

Para mostrar DARVA usamos una pantalla táctil en modo retrato. Si bien puede configurar fácilmente la rotación de la pantalla en la Raspberry Pi, la pantalla táctil aún funcionaba a la inversa ... Después de muchas pruebas y errores, decidimos mantener la Pi funcionando en modo horizontal y simplemente rotar todas las animaciones.

Fue una pesadilla rotar y reposicionar todas las imágenes y rehacer las animaciones, por lo que es mejor resolver esta parte antes de comenzar a programar.

Aparte de eso, ejecutar la página web en Chromium tuvo algunos efectos alucinantes al principio. Cuando todo estuvo hecho, lo intentamos de nuevo y de alguna manera se resolvió el problema ??? ¿La magia de la programación ...?

Si bien las animaciones son las más fluidas en Chromium, también funciona bien en Firefox, pero es un poco más lento.

DARVA

¡Tadaaa! ¡Ahí lo tenemos, DARVA, un simpático robot animado que nos ayudará en los eventos!

Fuente:DARVA - The Event Assistant