Animations for Online Casino Game Flow
My task was to create micro animations for all viewports. On this page, I'm going to show you some examples of the animations I prepared for desktop and mobile (portrait). I worked on this project as a solo Product Designer, collaborating closely with a product owner.
Timeline
6 weeks
This category details the step-by-step approach taken during the project, including research, planning, design, development, testing, and optimization phases.
Reusable Animated Components
I created set of reusable components in ProtoPie. For instance, a chip selector or a game timer. To ensure the countdown worked properly, I created a variable assigned with a number decrementing by one second. I then used masks that would change their colours and shadows under certain conditions that reflected the time remaining on the countdown.
Specific Game Features
The multi-table feature was designed and animated by me. Here you can see how this component is supposed to work allowing players to switch between Baccarat tables and change their order based on different categories. The red notification shows the current amount of the good roads.
The outcome of this work - fully animated game round that starts at the end of the previous one and finishes when the results are revealed. In this case - Banker wins. On the video below you can see animated chips, timer, No-Commision toggle, the Undo button, and the winning message.