Task: Reskin & update provided wireframe with UI art and design
Art Direction Provided: Game of Thrones
Tools I Used: Figma, Illustrator, Procreate, Photoshop

What I learned/What I’d do Differently: Gosh, I would simplify so much of this. I feel like there’s a lot of conflicting textures. I’d also simplify the navigation. I loved making all the UI assets, though. It’s such a huge challenge to learn a new art style in such a compressed period of time.

Final Screen

I documented my steps as a presentation to show the studio. I always try to iterate a lot, try to learn an art style quickly and experiment, and try to look at as many references as possible. I also try to make as many elements of the UI myself.

First Alternate

References

Icon Exploration & Item Treatment

Create inputs and borders, brocades, and other signature elements to help ground the treatement of UI elements in a style.

I really loved making the lion icon. It’s my favourite thing that I did in this art test.

Process Elaboration

My first step is always to recreate the wireframe in Figma. This allows me to orient myself with the established direction, get a sense of placement, and and iterate rapidly.

I try to block out and try new fonts, put in temp images, explore position and style, and get the character that I’m imagining players have chosen into the UI so they can really see the story. In the gallery below, you can look through a lot of my different iterations!