Everyday resources for an everyday UI Artist

Left: What we think UIUX is Right: What it really is.

Between kickstarting, working out user flows, creating art, implementing, and polishing features in Mighty Bear, you slowly start to realise that as a UIUX Designer here that… you don’t really have a lot of time to hem and haw while trying to decide on the best solution. So to quickly kickstart development on different parts of our work, having references and resources on hand are just as important for us as it is getting the work done.

Here are some (but not all) of the resources we use almost everyday while on the job.

Game UI Database

This is one of the most comprehensive and updated archives of game user interfaces you can find on the internet. You can filter results based on the specific art styles, game genres, and type of interfaces.

Even though they only seem to have static images, it’s still an amazing reference for moodboarding and to get an idea of what sort of visual style you are aiming for.

Also, if you are making a game genre that you are not a familiar with, this is a good starting point to start collecting images of pre-existing HUDs and interfaces that already exist on the market so you won’t have to start from zero. This would give you an idea of what type of interfaces and interactions users have already used before, which would have implications on the overall experience if you need to make a visual or interaction change.

Interface in Game

Seriously, buy them a coffee yall.

Similar to Game UI Database, this is an archive of selected games and their user interfaces. Unlike Game UI Database, this archive also contains videos for some games that you can use as a reference for motion graphics and animations (which is its own role in UI Art!).

Interface in Game also has an article section with interviews and articles with lots of insights from folks who have worked in both AAA and smaller studios. It’s a good place to take a breather from reference collection and to refresh oneself with what the larger industry is doing.

Figma Community

Need some pretty templates for handoff? Look here! Looking for free design systems? Looking for icons! All here!

Need an icon fast? Check Community.

Need an example of a handover template? Check Community.

I don’t use this as often while doing mid to high fidelity mockups, but Figma Community is a nice place to start if you need flat icons or general website templates.

Youtube

Youtube is a treasure trove of videos and resources for UI artists. From UIUX talks and just random particle system or Text Mesh Pro tutorials by that random guy that only records in 240p, there is something useful for everyone. Also, if we don’t have time to play a game, the next best thing to experience it is to live vicariously through a streamer and watch playthroughs.

Some favourite videos from the team…

Game UX Summit ’19 — Lots of great talks in this playlist. The team really enjoyed most, if not all, of the talks here.

GDC — The de-facto place to go to if you want to check out developer talks in general.

Design Doc — Lots of little digestible videos on different parts of the game experience. Really useful if you are tackling specific features.

Dev Blogs/Twitters

I’m sure there are many more here, but these are just a few that I found the most useful in general.

Space Ape UX Blog — Hasn’t been updated in a while, but they have some pretty cool resources and articles specifically for mobile games.

Riot Games UX Design — Lots of in-depth processes and case studies that are super useful here. Also one of the few blogs that also cover case studies on the product as an entirety including supporting apps, not just the core game.

Capcom UXD — I don’t understand a word of Japanese but they have lots of images with little tips and tricks on visual shortcuts that we are so used to that we do not think about them anymore. Super useful resource to keep one grounded just in case we decide to go a bit surrealist with our interface and forget that the simplest solution might be the best, even if it isn’t necessarily the coolest. ALSO THEY POST SO MANY FOOD PICTURES AHJSGAS!!!!!

TAKEN FROM CAPCOM_UXD. HOW DARE THEY MAKE ME FEEL HUNGRY.

Other resources

Motion Periodic Table — This one was shared by our VFX artist Kirill but it’s a super quick reference for different types of animations. I’m not an animator by nature so having references like these are super helpful for me to experiment with different types of motion and transitions.

Laws of UX — feel like you’re forgetting your roots and basics. Come here to refresh yourself!

Hope this list has been useful to you and remember to have a good meal today! Follow Mighty Bear’s publication for more content like this, and drop me some claps if you found this article helpful!


Everyday resources for an everyday UI Artist was originally published in Mighty Bear Games on Medium, where people are continuing the conversation by highlighting and responding to this story.