J'ai acheté un outil permettant de faire des jeux de courses. Cet outil contient une démo et j'ai pris pour mission d'améliorer son UI. L'outil a été créé à l'aide de l'engin de jeu Unity.
La démo contient 2 modes (course et drift) où le joueur peut compétitionner contre plusieurs IAs.
--
I bought a tool for making racing games. This tool contains a demo and I took on the mission to improve its UI. The tool was created using the Unity game engine.
The demo contains 2 modes (race and drift) where the player can compete against several AIs.
Mon conjoint est un programmeur et il m'a aidé à intégrer techniquement mes changements. Vous pouvez essayer la version finale ici (utilisez les touches W,A,S,D pour bouger le véhicule sur PC):
--
My husband is a programmer and he helped me technically integrate my changes. You can try the final version here (use the W,A,S,D keys to move the car on PC):
Étant dans un contexte d'automobile, j'ai décidé de recréer l'effet des capots en fibre de carbone à l'aide de lignes diagonales sur un fond gris. Cet effet est mis en contraste par rapport au reste du cadre bleu tout comme les automobiles ayant un capot en fibre de carbone.
--
Being in a car context, I decided to recreate the effect of carbon fiber hoods using diagonal lines on a gray background. This effect is contrasted with the rest of the blue frame just like cars with a carbon fiber hood.
Au niveau des boutons, je me suis inspiré du côté plastique/chrome souvent intégré à l'intérieur des automobiles. Lorsqu'ils sont appuyés, ils s'allument afin de donner une rétroaction à l'utilisateur.
--
For the buttons, I was inspired by the plastic / chrome side often integrated into the cars interior. When pressed, they light up to give feedback to the user.
Avant | Après
L'indicateur de vitesse était imposant et prenait beaucoup de place à l'écran. J'ai modifié son affichage pour le rendre plus naturel. Plus le joueur force son moteur, plus il monte vers le rouge. J'ai également mis en évidence la vitesse en cours du véhicule.
--
The speedometer was large and took up a lot of screen space. I changed its display to make it more natural. The more the player forces his engine, the more he goes red. I also highlighted the current speed of the vehicle.
avant | arpès
L'écran de choix de piste a été retravaillé également. J'ai créé une présentation plus épurée de l'information en plus de mettre en évidence les deux types de course (course dans un cadre bleu et drift dans un cadre jaune). De plus, la sélection s'effectue plus naturellement en touchant l'image en tant que telle.
--
The race track selection screen has also been reworked. I created a more refined presentation of the information in addition to highlighting the two types of race types (race in a blue frame and drift in a yellow frame). In addition, the selection is made more natural by directly touching the whole image.
Au niveau des fenêtres popup, j'ai réutilisé le concept fibre de carbone. J'y ai également créé un effet creusé où se trouve le contenu de la fenêtre.
--
For popup windows, I reused the carbon fiber concept. I also created some depth where the content of the window is located.
Si vous voulez comparer à l'aide de la version originale, vous la trouverez ici:
--
If you want to compare with the original version, you can find it here:
