GUI design for racing mobile game

•

I created GUI design for racing mobile game by Tiny Bits. Game is still in development yet.

Client has overall game vision so I did try to catch his ideas and implement in design.

First sketches

I sketches core gameplay to understand it. No menus or settings - just core.

Sketches all in Adobe Illustrator.

Wireframes

I created wireframes for all screens (game modes). I need it to understand game flow and be sure that everything needed is on own place. Sure all key elements must be described in GDD by game designer or producer.

So I just blocked basic shapes to show all elements.

Created wireframes in Adobe XD.

Color sketches

After wireframes approval I can start sketching in color. Color sketches can show game mood and style.

Exported wireframes from Adobe XD and painted in Photoshop.

Here I just added some textures and background images. I have some reference images and did try to catch the mood.

I added different variant of fx on this stage also.

GUI design

I did variants for main GUI elements. It's not simple task and I did redesigns after testing and getting feedback.

On this stage I was ready to create clean UI design for core play game mode.

GUI design for game screens

When main game screen (core play mode) is ready I can start creating other screens and GUI elements.

I designed pack in Unity3D with all GUI screens implemented. Sure I thought about different resolutions and screen proportions.

Loading screen animations design

Game logo design

I don't do logo design usually but not this time :) It's absolutely not typical design for me but I like it, looks bumpy ))

Game logo/title design. Bumper Cops logo is trademark of Tinybits LLC

Game logo design can looks like something simple but it's not. It takes a lot of time and thinking to design this little piece of text. Sure it's faster if you know what to do :)