Bridezillas Bingo Game:
Animations
At Playtech, I had the exciting task of creating animations for "Bridezilla," a vibrant Video Bingo game. Here’s a glimpse into my process:
Graphic Preparation: Organised and layered the game graphics in Photoshop.
Asset Export: Converted these graphics to .json format to allow Spine import.
Animation Creation: Used Spine to craft dynamic and engaging animations.
Developer Handoff: Exported the final animated assets for seamless integration into the game.
This approach ensured "Bridezilla" was visually stunning and offered a smooth, enjoyable experience for players.
Animations in Spine
Below are my key animations for the game character Bridezilla, showcasing various dynamic transformations and actions:
Idle Animation: The character's default stance.
Bouquet Vanish: The bouquet disappears mysteriously.
Bridezilla Transformations:
Wild Hair: Hair becomes wild and untamed.
Claws: Hands morph into claws.
Talons: Feet transform into talons.
Tail: Emergence of a tail.
These animations highlight my expertise in creating expressive and engaging character movements using Spine.
Final Game: Screen Recording
Check out the screen recording below to see "Bridezillas" in action! This video showcases all the animations that bring the game to life. Here's what I did:
Drafted the Game Flow: Mapped out how the game plays out to ensure a smooth experience.
Scoped the Animations: Identified all the animations needed to make the game engaging.
Provided a Timeline: Created a timeline to keep everything on track and coordinated with the product team.
Completed the Animations: Brought every visual element to life, ensuring a fun and cohesive player experience.
This thorough process made sure that "Bridezillas" is not only visually stunning but also super engaging to play.
Bridezillas Bingo Game: Optimising Assets for Developers
In preparation for the development phase of the "Bridezilla" Video Bingo game, I undertook a detailed process to optimise all assets, ensuring they would integrate seamlessly and perform efficiently within the WebGL environment powered by PixiJS and Spine-Pixi runtime. Here’s how I approached the optimisation:
Texture Atlases:
To improve memory efficiency and reduce the number of draw calls during gameplay, I combined multiple images into texture atlases using TexturePacker. Each atlas was thoughtfully organised to maximise space, with rotation enabled to eliminate any unused areas.
Skeleton and Mesh Refinement:
In Spine, I optimised the character meshes by minimising the number of bones and vertices, focusing on the key points needed for smooth deformation. This approach significantly reduced the processing load without compromising animation quality. I ensured that each mesh was efficiently bound to its bones, avoiding any unnecessary complexity that could impact the game’s performance.
File Size and Format Optimisation:
I paid close attention to managing file sizes by adjusting the resolution and frame count for each animation. For repetitive sequences, I utilised frame looping and removed alternate frames, maintaining fluidity while significantly cutting down on data usage. All assets were exported in Spine’s .json format, making them easy for developers to integrate and work with in Spine-Pixi runtime.
Export to Spine-Pixi Runtime:
After finalising the animations, I exported them to the Spine-Pixi runtime, ensuring that shared particles and other assets were correctly linked to the corresponding bone names and hierarchies. This ensured consistent behaviour across various animations, contributing to a cohesive and polished gameplay experience. By optimising the texture size, format, and hierarchy structure, I was able to reduce memory usage, decrease load times, and ensure smoother performance within the game.
These careful optimisations were crucial in delivering a high-quality, visually appealing, and efficiently running game, while also simplifying the development process for the Dev team.
