Anton Shmetelko's profile

Caliber PC. HUD Reticle Concept

Caliber PC. HUD Reticle Concept
Some time ago, I created a reticle design for the HUD of a game called Caliber as a test task for 1C game company. The focus of this task was on creating an effective user experience and an intuitive UI. The design was specifically made for PC, which required me to consider how the reticle would appear and function on a larger screen. Additionally, I created the reticle animation using 3ds Max to ensure a polished and dynamic effect.
Shotgun reticle within the gameplay
1. References and sketches
To start, I gathered references and sketched out multiple sight options on my tablet. The results of my work can be seen at the bottom of the picture, against a gray background.
References
Most of all, I worked on creating a futuristic assault rifle reticle, drawing inspiration from the details of a gray machine gun in the reference material. However, I found the initial designs to be too bulky and opted for a simpler, more lightweight triangle shape. Once I was satisfied with the design options, I proceeded to create a vector outline of the final reticle.
2. Outline
To start, I enlarged all the drawings by 2 times and traced them in vector format using Photoshop. I strive to ensure pixel-perfect precision in my work, unless instructed otherwise. As seen in the image below, all elements were drawn using rulers for accuracy.
First-hand drawings
Out of all the options, I prefer the simplest reticles as they minimize distractions from gameplay. In my opinion, reticles should primarily fulfill their main function of indicating, with additional functions such as displaying cartridges, overheating, distance, direction, and strength, only included if there is enough screen space. If designers have the urge to add more graphics, it should be done contextually and with caution. For example, a red cartridge can flash next to the target reticle when the machine only has 5 rounds left in the magazine.
3. Description of the selected reticles
For the selected reticles, I handpicked the three most functional options based on my opinion. Below, you will find a summary of my thoughts on each.
Reasoning on design
4. States
Next, I compiled all the states of the three reticles onto a single sheet to ensure consistency in style (angles, line thickness) and size.
Reticle states collection
To enhance the visibility of hitting the enemy, I utilized diagonal lines in white and red graphics. These visual elements help to improve the user's understanding and familiarity with the interface, thus enhancing usability. However, it's important to note that additional graphics are not always necessary. For instance, instead of using red lines to indicate the death of an enemy, a skull icon with the player's name can be placed between the central and lower parts of the screen. In case of a headshot, the skull icon can flash red.
I also created additional states for the reticles. An interesting point to note is the challenge of aiming when the player is very close to an obstacle. To address this, we kept the main shape of the reticle in place and placed a point on the obstacle in front of the player. However, in the game, the entire reticle would 'jump' on the screen, causing disorientation.
Reticle additional states
5. Usage examples
I placed the selected reticles onto a screenshot from the game and added a subtle stroke to some elements for better display.
Pistol reticle within the gameplay
Assault Rifle reticle within the gameplay
I specifically chose a picture with a lighter background to test its readability, and made adjustments to the transparency, color, stroke, and shadows as needed.
6. Animation
When it comes to reticle graphics and animations, I prefer simplicity. However, if something non-standard is required, I collect references, draw them out, and clearly explain to the engineer/animator what effect should be achieved. I create animations using 3ds Max.
Reticle animation
7. In Custody
In my opinion, reticles should be designed based on the intended behavior of the weapon in gameplay. For example, if game designers want to make all pistols in the game useless except for one specific colt, reticles can be used to make aiming more difficult for the other pistols, making the colt more desirable. When creating a model like this, adjustments must be made to the game balance, weapon behavior, and visual design of specific parts, including reticles. In my own design, I omitted dots on the pistol sights to emphasize their use as support weapons rather than accurate firearms.

Personally, I prefer concise UI and HUD designs over complex ones. Simple shapes for reticles are now in trend, even in futuristic games like Mass Effect: Andromeda and Anthem. If complex reticles do appear, they are usually made carefully and contextually. Adding personality to UI is important, not only through reticles, but also through fonts, typography, the palette and panels design, and illustrations such as weapons in menus and icons.
2020 @shmetelko
Caliber PC. HUD Reticle Concept
Published:

Caliber PC. HUD Reticle Concept

Published: