Whiteboard Animator

• 

  Whiteboard Animator demo

Inspiration

Static images often feel flat and fail to capture attention in presentations, lessons, or creative projects. I wanted an easy way to add life and personality to any image without needing complex tools or extra steps, that’s why I built Whiteboard Animator: to make dynamic whiteboard-style sketch videos accessible in just a click.

What it does

Whiteboard Animator is an add-on that converts any image into a hand-drawn sketch animation directly inside your design workflow. It automatically previews the active page, lets you customize the animation style and speed, and generates a whiteboard video that can be instantly embedded back into your project.

How we built it

I built a prototype using a backend server that processes the image and renders it as an animated sketch video. The front-end is designed as an add-on that detects the current design page, provides user controls for customization, and handles embedding the final video back into the document.

Challenges we ran into

The biggest challenge was processing image-to-sketch rendering fast enough to feel smooth inside the design tool. Managing backend rendering, maintaining image quality, and embedding the video seamlessly were also tricky parts to prototype within hackathon time constraints.

Accomplishments that we're proud of

I’m proud that the prototype works end-to-end: it previews images automatically, lets users tweak animation details, and generates an engaging sketch video within seconds, all with minimal clicks.

What we learned

I learned how to integrate backend rendering with a real-time design plugin, how to streamline user interaction for speed and simplicity, and how small design choices can make creative tools feel fun and intuitive.

What's next for Whiteboard Animator

Next, I plan to migrate the rendering from a server to local processing using FFmpeg.wasm, removing server costs and delays. The goal is to make Whiteboard Animator 100% free, fast, and offline, so anyone, from teachers to designers, can add engaging whiteboard animations to their visuals instantly.

Built With

• amazon-web-services
• lambda
• react