To support the Team better I created a Figma Library anyone could use and plug into their file.
This made delivering concepts easier and faster, as well as more consistent and contextual.
UI/UX
Figma
Figma Prototypes
Almost every delivery milestone was full of UI exploration tasks for showing new content.
I got to be very creative with some of them and while certain ideas would be potentially costly to implement, they were still put together quickly in Figma as alternatives to more classic solutions.
UI/UX
Figma
Board Minis
Finding the Right Mini
it’s representative of the board
has a unique shape
it’s fast enough to make en masse both for the thumbnail and Unity implementation
Exploration + Context
These selected ideas represent the range covered with the explorations: from diegetic minis, to more metaphorical ideas, like the frames.
To make sure the ideas were presented contextually, they were mocked up both in the Store and Collection menus.
Concepts + Final Illustration
Figma, Photoshop
3D Model + Prefab
I moved on to create the 3D Model in Maya and a Unity prefab for the Board Mini.
3D Modeling, Texturing, Implementation
Maya, Unity
Final Look
The board underwent one last tweak before releasing – it was making its corners concave instead of convex. A move that made it a bit more similar to a number of previous explorations.
3D Modeling, Texturing, Implementation
Photoshop, Unity
Illustration & Vis Dev
Randomized Bartender Artwork
It was fun getting into Hearthstone’s signature art style and light set up for all of their digitally painted artifacts.
Concepts + Final Illustration
Photoshop
Emotes
Themed emotes were something everyone wanted more of. These are some of the concepts I created while working on the feature in Unity.
They made it easier for me to test on something tangible, without having to wait on artwork.
Concepts
Photoshop
Strikes a.k.a. Finishers
Astral Strike
Strikes were a new feature and they needed content.
The concepts are meant to capture FX in motion. Not an easy task, but a very rewarding one.
Concepts + Final Illustration
Photoshop
3D Model Prefab
Once the Strike container design was locked down, I moved on implement the 3D Model in as a Unity prefab.
The cylindrical shape of the Strike presented a problem with the page flip.
The Strike container was cut and presented as a top half only which maintained the illusion in front of the camera, but still worked with the standardized page flip height.
Implementation
Unity
Zapper Strike
The Zapper is a part of the custom Strike collectible effect in Hearthstone.
I worked closely with an FX Artist to make sure this zapper fit the original concept and looked right when displayed on top of the board.
Concepts + Final Illustration
Photoshop, Unity
Thank you
You’ve made it this far. Please enjoy this Tiny Hearthstone video recorded on my tiny Android phone.
