Mad Skills Motocross 3

Mad Skills Motocross 3

mobile game
mobile game

User Interface

User Interface

Art Direction

Art Direction

Graphic Assets

Graphic Assets

User Experience

User Experience

my contributions

my contributions

When I first picked up the project, the interface was much different than it is today. Throughout the years I was able to solidify and iterate on the interface in Mad Skills Motocross 3, which resulted in:

  • Brighter colors: Because the game's graphics are a stylized realism, the initial Color Palette blended in with the graphics and was easily dismissible.

  • Less slanted shapes: Making the devs' lives easier, performance and implementation-wise.

  • Adding a standard in visual hierarchy and buttons: back in Beta, each screen had its own set of buttons, hierarchy and style. As I assumed the role of art director, I did the best within my power to make sure the visuals were round and consistent.

When I first picked up the project, the interface was much different than it is today. Throughout the years I was able to solidify and iterate on the interface in Mad Skills Motocross 3, which resulted in:

  • Brighter colors: Because the game's graphics are a stylized realism, the initial Color Palette blended in with the graphics and was easily dismissible.

  • Less slanted shapes: Making the devs' lives easier, performance and implementation-wise.

  • Adding a standard in visual hierarchy and buttons: back in Beta, each screen had its own set of buttons, hierarchy and style. As I assumed the role of art director, I did the best within my power to make sure the visuals were round and consistent.

Old and New "Daily Goals" Screens, after 3 years. The background and the art in general used some polishing before and after launch in 2021.

I also introduced Prototyping to Turborilla's Projects:

  • It helped developers visualize and experience the feature they were implementing, to have a better feel and understanding of how things were supposed to go. Prototyping also was something the QA team could rely upon when making sure the feature would be shipped as intended.

  • I collaborated with the game designers to come up with wireframes in Balsamiq and then implement them in Adobe XD.

Softwares used:

Adobe Photoshop, Adobe Illustrator, Adobe XD, Unity, Figma, Blender, Balsamiq

Visual guide

Color palette

Color palette

#07DEFF

#07DEFF

#003343

#F8C345

#FAFAFA

typography

ROBOTO


A B C D E F G H I J K L M N O P Q R S T U V W X Y Z


a b c d e f g h i j k l m n o p q r s t u v w x y z


1 2 3 4 5 6 7 8 9 0

ROBOTO


A B C D E F G H I J K L M N O P Q R S T U V W X Y Z


a b c d e f g h i j k l m n o p q r s t u v w x y z


1 2 3 4 5 6 7 8 9 0

Logo on Dark

Logo on Light

Icons

Rendered icons

in-game screenshots

in-game screenshots

Main Menu


The main menu is a great accomplishment.


Main Menu