user's avatar
GUI design for racing mobile game
Bumper Cops logo is trademark of Tinybits LLC. Copyright © 2020 Tinybits LLC. All rights reserved
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.
One of the GUI designs for core play game mode. Copyright © 2020 Tinybits LLC. All rights reserved
First sketches
I sketches core gameplay to understand it. No menus or settings - just core.
Sketches all in Adobe Illustrator.
First sketches. Copyright © 2020 Tinybits LLC. All rights reserved
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.
Game wireframes. Copyright © 2020 Tinybits LLC. All rights reserved
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.
Game color sketches. Copyright © 2020 Tinybits LLC. All rights reserved
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.
Game color sketches with backgrounds. Copyright © 2020 Tinybits LLC. All rights reserved
GUI design
I did variants for main GUI elements. It's not simple task and I did redesigns after testing and getting feedback.
Game GUI design variants. Copyright © 2020 Tinybits LLC. All rights reserved
On this stage I was ready to create clean UI design for core play game mode.
GUI design for core game play mode screen. One of the variants. Copyright © 2020 Tinybits LLC. All rights reserved
GUI design for game screens
When main game screen (core play mode) is ready I can start creating other screens and GUI elements.
In-app screen designs with buttons to buy for coins and hard money. Copyright © 2020 Tinybits LLC. All rights reserved
Pause/Settings screen designs with different buttons. Copyright © 2020 Tinybits LLC. All rights reserved
Garage (shop) screen designs with buttons to buy upgrades for coins. Copyright © 2020 Tinybits LLC. All rights reserved
I designed pack in Unity3D with all GUI screens implemented. Sure I thought about different resolutions and screen proportions.
GUI design in Unity3D with Canvas. Copyright © 2020 Tinybits LLC. All rights reserved
Loading screen animations design​​​​​​​
Loading screen designs. Copyright © 2020 Tinybits LLC. All rights reserved
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 :)
Logo sketches. Copyright © 2020 Tinybits LLC. All rights reserved
Game icon design for Google Play store. Copyright © 2020 Tinybits LLC. All rights reserved
Thank you for watching! 
All comments appreciated :)
GUI design for racing mobile game
7
51
0
Published:

GUI design for racing mobile game

UI design for mobile game by Tiny Bits. I did overall game style design and UI design from sketches to final implementation in Unity3D.
7
51
0
Published:

Tools

Creative Fields