Accessible Real-Time Animation in the Game Creator Application

๐ŸŽฎ Bringing 2D Characters to Life: Advanced Animation Techniques! ๐Ÿš€

In this project, users can animate characters by pointing to any part of the character in the main animation scene and selecting an animation type from a button palette at the top of the screen.

๐Ÿ”น How It Works:
โœ… Users select a part of the character to animate ๐ŸŽญ
โœ… The system generates an underlying triangle mesh using the sprite as a texture ๐Ÿ–ผ๏ธ
โœ… Animations are applied using mesh deformations and vertex shader effects ๐ŸŽจ

๐Ÿ”ฌ Animation Process:
๐ŸŸข Step 1: The 2D image is imported into the system. Using the Marching Squares algorithm, the characterโ€™s outline is extracted.
๐ŸŸข Step 2: Using the ear-clipping method, a primary triangulation of the character is created.
๐ŸŸข Step 3: A final triangulation is applied to regularize the mesh.
๐ŸŸข Step 4: Weights are assigned to triangle vertices using breadth-first propagation. The nearest vertex to the userโ€™s selection gets weight 0, and other vertices receive values based on distance and neighboring connections.
๐ŸŸข Step 5: In the vertex shader, animation effects are applied using a Gaussian kernel function of weight and time. Users select animation styles via buttons in the UI.

๐ŸŽจ This method allows smooth and dynamic animation while maintaining a lightweight computational cost, bringing 2D characters to life!

๐Ÿ™ Special Thanks:
A huge thanks to ETH Game Technology Center for having me as an intern during Summer 2019! Your support and mentorship were invaluable.