Rolling Dices Animation 🎲🎲

Have you ever used a dating app that features only fun 3D avatars. Did you notice those small, cute dices that are rolling when you refresh your matches?

Well, I haven't either, because it never existed—until now! 😚

When I saw those stunning animations they created for iOS 17, I felt inspired to try something experimental yet fun.

Despite my current profession in UI design, I have a background in 3D visualization. Therefore, I decided to include a 3D element.

Several years ago, when I was creating concept designs to get my first job, I remembered that I had used a dice animation in one of those designs.

So, I decided to use a dice once again in a 3D avatar based dating app.

After I finished modeling, it was time to color it up.

Since the latest version of Photoshop has discontinued 3D mode, I needed to find an alternative method to create texture maps. I exported the UV layout and used it as a reference to draw the rest.

As you can see, I also made a normal map to create small inner bumps on the dice.

It might not be a big deal, but it's good to pay attention to details.

Animating in a three-dimensional space has always been challenging. After recalling my forgotten knowledge of 3D animation, I created a rolling dice animation.

I brought all the UI elements and 3D renders together in After Effects and made color adjustments.

It was great to use After Effects, even though I had never delved deep into it before. Now, I'm eager to learn more about this amazing software.

I want to appreciate Vova Kras to provide all those amazing 3D avatars for free that is used in this project.

Thank you for reading!