Unreal Engine Experiments: Enemy Tagging System

I've been playing a fair bit of stealth & tactical action games of late and noticed that most of them have some form of enemy tagging systems to help the players form a better tactical awareness about the game world. I generally note down interesting gameplay systems that I come across, in order to study them in detail at a later time. But since this particular mechanic didn't seem like it would take up much time, I decided to jump into the process right away.

I started doing some research on the concept and various approaches taken by different games to implement it. And I took a particular liking to the Metal Gear Solid V's take on tagging systems, with its added support for range display as well as the highlighting of occluded objects. So I decided to go ahead and recreate it in Unreal Engine, and this post is basically a high-level retrospective overview of the implementation process. But before getting into the details, here is a super quick preview of what the end result is going to look like:



Alright, so without further ado, let's dive into the design process behind the experiment.

The first order of business here is to create a custom widget that can display the tag image as well as the distance to the player character. Since the tag needs to hover above the target at all times, we can use a widget component and leverage its inbuilt functionality to attach itself to actors. However, since highlighting of occluded targets is also part of the agenda here, it makes sense to render the widget on screen space.



However, if we try this out in the editor, we'll notice an issue once we start moving away from the tagged actors. The widget will start covering most of the actor until at very large distances, the actor becomes barely visible at all. This happens because the relative distance from the actor to the widget component remains the same, while the widget being rendered in screen space retains its default size. And that is not desirable.

Now there are two ways to resolve this. The first involves changing the widget size dynamically, while the other approach revolves around updating the relative location of the component at runtime. After taking another look at the workings of tagging systems from a few real games, I noticed that the second approach is generally favored, and that's the one that we're going to take here. While I tried out multiple types of alignment correction models, it finally came down to just using a simple linear multiplier based on the distance involved.




Here is a comparison of the tagging system with and without the distance-based alignment corrections (I also threw in some script to display the distance text):



Now that we have a working tag widget, we can throw in some player input driven logic for adding tags to actors manually. A simple line trace-driven check would suffice in this regard. We can take the hit result data and request activation of tag display if the hit actor has a tag widget component.



And that brings us to the final section: implementation of occluded object highlights. To this end, we can use a post-process material with custom stencils enabled. I'm not particularly good with materials, but fortunately, Rodrigo Villani has already created an awesome tutorial on how to create outlines in Unreal Engine. I took the basic material setup explained in the tutorial and threw in some additional script to add translucent filling within the outline area. And that's about it. Here is a preview video of the enemy tagging system in action:



With that, we have come to the end of another experiment. Eventually, I hope to use this space to write about all of my experiments, but it is probably going to be a while, given my trajectory so far. But I generally keep my Youtube channel updated with the latest projects. So if you like to see more cool experiments in Unreal Engine, you know where to find them. 😉

Comments