Echoes of Somewhere

I was working on the Steam Deck compatibility of the game this week and the main pain point was the hotspots. As I was fixing the code, I decided to try to add animated hotspot icons!

3D modeling & animation

These icons were not originally created for this game. I reused the icons from my previous game project.

I am still quite happy with these icons, but I wanted to see if they would work animated as Adventure Creator supports using animated icons.

The icons were originally modelled in Modo, and I animated them in the same software. All of the animations are extremely simple, 8 or 12 frame loops. The 3D animations are always 8 frames, but sometimes I added 4 frames for cross fading the loop.

I spent easily around 3 to 4 hours animating all of the icons by hand. Maybe there could have been an AI tool that would have done something based on the still icons, but I really did not want to spend time figuring that out as these animations were extremely simple and very easy for me to make myself. And I would have full control over the final results this way.

Modo renders these animations into image sequences, These are not directly usable, but I need to turn them into texture atlases.

Turning the image sequences into atlas textures

I used After Effects to make atlases out of the image sequences. I have created an expression for doing this myself, but this time I decided to search online for a tutorial so I could post a full how-to on the blog as well.

The concept is very simple and effective. You can duplicate the atlas composition and re-use it for any animation files.

I added the stroke effect to the icons in After Effects. For some icons I also did some color grading, but mostly they are as rendered by Modo.

Most of the icons are simple FK transform animations, but the hand I animated using morphs. Mainly because I only have 8 frames and full hand rig would have been a bit overkill for this.

Set up in Unity

The animations worked pretty well without any custom scripting using the built in Adventure Creator cursor system. And normally, the hotspot icons are only displayed on mouseover which works great, but I have an accessibility mode that shows the icons all of the time and I did not want these icons to stay animated all of the time, so I had to figure out a way to create custom script for this.

Luckily it was a vey simple piece of code to write and I had the system up and running in no time! I have a habit of asking for help on the adventure creator forums, then coming up with the solution myself and answering my own question. I am very impatient!

//change the icon for the hotspot the mouse is hovering on
if (hotspot == _hoverSpot && hovering == true)
{
	icon.sprite = KickStarter.cursorManager.GetCursorIconFromID(0).GetAnimatedSprite(true);
	if (KickStarter.runtimeInventory.SelectedItem != null)
	{
		icon.sprite = KickStarter.cursorManager.GetCursorIconFromID(0).GetAnimatedSprite(0);
	}
	else
	{
		icon.sprite = hotspot.GetMainIcon().GetAnimatedSprite(true);
	}
}
//render icon of gears if hint mode is on and hovering on inv item with interaction with the hotspot
else if (hintMode == true && AC.GlobalVariables.GetVariable(9).BooleanValue == true && hotspot.HasInventoryInteraction(ActiveItem))
{
	icon.sprite = KickStarter.cursorManager.GetCursorIconFromID(0).GetAnimatedSprite(0);
}
//render gears icon if dragging an inv item and the hint mode is on
else if (KickStarter.runtimeInventory.SelectedItem != null && AC.GlobalVariables.GetVariable(9).BooleanValue == true && hotspot.HasInventoryInteraction(ActiveItem))
{
	icon.sprite = KickStarter.cursorManager.GetCursorIconFromID(0).GetAnimatedSprite(0);
}
//if hotspot accessibility mode is on, display all icons with the contextual icon at all times
else if (AC.GlobalVariables.GetVariable(8).BooleanValue == true)
{
	icon.sprite = hotspot.GetMainIcon().GetAnimatedSprite(0);
}
//make doors look like doors even when they are not hovered on
else if (hotspot.GetFirstUseIcon() == 3)
{
	icon.sprite = hotspot.GetMainIcon().GetAnimatedSprite(0);
}
//render the pyramid when mouse is not hovering on the hotspot when hotspot accessibility mode is off
else
{
	icon.sprite = _defaultSprite;
}

Overall setting this up was perfectly possible in under a day. I am a big fan of working without a plan like this, where I can get inspired about something weird and just do it. Naturally it is not a good recipe for finishing a game as I am in a constant state of feature creep, but as long as I am enjoying myself I do not care!