9 ways to practice videogame UI Design, from an art director
Want to become a videogame UI Artist and have no idea how to practice your craft? Try these 9 easy ideas.
I’ve been Mentoring video game UI UX Design for years and the most common anxiety is, “I don’t know how to get started.” — a perfectly reasonable question for an imperfectly opaque Industry. But what do you do after you “get started”? What should you read, design, study to continue your education? How can you possibly hone a craft that nobody teaches?
While I’ll always advise a Mentorship as the superior way to learn — personal projects are, without hyperbole, the only reason I have a career with the nerd-clout to write to you today. Personal Projects strengthen skills, nourish abilities, and add real-world grit under your fingernails. Beyond just blindly making portfolio stuff and hoping for the best, Here are a few ideas to build killer portfolio pieces in your Game UI Artist portfolio that an Art Director will love.
Change The Genre
Take an existing Intellectual Property and completely change the genre, then change the design: a Darksouls First Person Shooter, Halo the Isometric RPG, a Kirby Battle Royale. See if you can take the mood and Art Direction of the original game and keep as much in translation as possible for panels, icons and ornaments. As an added challenge, see if you can add genre-specific elements as well.
Reboot an Old/Obscure Game
Similarly, take an old classic (or an obscure deep cut) and redesign it with modern sensibilities. What if Bonk’s Adventure was an indie title on a Playstation 5? How would Commander Keen look remade from scratch on the Nintendo Switch? Atari’s ET with RTX turned on?!
Special Note: Obviously, real reboots happen all the time in games and movies — and it’s a fascinating subject to study. Marvel costume redesigns, how Nintendo branches its franchises, I can’t even begin to tell you how many species of Pacmen and Tetri there are in the world. Study how talented problem-solvers try to make things phoenix-fire new.
Devolve a game
Do the opposite of the above: take a modern game and see if you can transport it several gaming generations into the sepia-toned past. For example: take a Gears of War HUD and place it on a Gameboy. What about Apex Legends for the Playstation 1? Seikiro’s Inventory for the Turbo Grafix 16? No — it’s not just about making pixel art, it’s about working with the constraints and limited resources of the time (UI art through adversity, as it were).
Change the Platform
Take a game from any of the major platforms and switch the flags they’re flying. Can you make Halo’s twitch-based action work on a clunky mobile phone? Would an MMO even be possible in virtual reality? Can you wrap your head around a text adventure game for the PS5 controller? Have an awed respect for the strengths, quirks, and sandtraps of each Platform as you design.
Special Note: most entry-level Artists struggle with what to write for case studies (and write way too much anyway!). An easy win is writing about unique design challenges, for example, what specific obstacles there were in going from mobile to PC (tons of empty screen space) or challenges that required bespoke solutions (controller quality-of-life improvements for console games).
Change the Tone
The last variation on the theme: every game has a tone and mood that colors the experience. There’s a big difference in horror between Resident Evil and The Last of Us, despite being zombie themed. Fall Guys and Fortnite’s atmosphere feel distinct, even if you can easily label them both as colorful Royales. What happens if you flip the script on how these games feel? What if Uncharted interface was set in the Rick & Morty universe? A Michael Bay version of a Match-3? An open world RPG with David Lynchian undertones aaaaand GO!
Your own Spin.
Game marketing material like screenshots typically do not have visual elements to obscure the action. That makes them perfect as backdrops for your mockups. See if you can redesign an existing game’s Art Direction with your own: make it painterly instead of vector, or minimalist instead of grandly utilitarian. Sculpt the (re)design based on your intimate knowledge of the game not as a designer, but as a fan.
Special Note: Don’t ever lie on your Resume or Portfolio. Ever. However, embellishment, tall tales and innuendo are at the beating heart of self-promotion. If you do a mockup of an existing property, don’t say you were hired by that company to work on that property if you didn’t. That being said — the onus is on your audience to figure out whether you were on the payroll or not.
Go Small
Making full blown screens is pretty time-consuming, so why not go in the opposite direction? Make a collection of elemental icons, fantasy buttons, sci-fi targeting reticules — little things. Honing your craft can sometimes mean “low weights, high reps”.
Special Note: I always teach students a kind of Design Conservation of Momentum; every action should flow into the next without any wasted effort. If you make a collection of icons, sci-fi decals, panels, etc, there is nothing stopping you from selling them on Stock Imagery sites. Even your sawdust is worth its weight in gold.
Living Pro-Bono Work
Take a work in progress screen from Reddit channels like r/IndieDev or Unity/Unreal forums and see if you can shore up a real project under real conditions. Heck, you can even ask the developers if they wouldn’t mind some pro-bono work so you can design *in context* and under deadlines (those people will adore you, by the way). It might not be a particularly showy Portfolio piece, but real world experience is the towering pinnacle of learning — and there is so much to learn.
Thank you Mr. Skeletal
Sometimes practice isn’t about producing portfolio pieces, but rather a deep skillset, like wireframing. So why not get in some excellent practice… in reverse. Take an existing game’s UI and produce a high-fidelity wireframe from it. Deconstruct what you consider excellent UI UX Design work and see if you can figure out what makes it tick from the atomic-structure on out. Pay special attention to not just how screens are carved and configured, but why.
Special Note: finding professional game wireframes online is exceedingly difficult; albino peacock rare, if we’re being honest. You’ll find mostly app wireframes online — and while those are certainly better than nothing — a game wireframe is very unique and almost always bespoke, even within its own template-friendly genre.
-
Again, nothing will ever beat the over-the-shoulder confidence that career coaching can provide, but you should be making personal work, regardless. An abundance of it. A Dragon’s horde. When the dust settles and clears, you’ll be astounded at your personal growth and, best of all, you’ll have work to show for it.
