> For the complete documentation index, see [llms.txt](https://digital-dungeon-assets.gitbook.io/digital-dungeon-assets-docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://digital-dungeon-assets.gitbook.io/digital-dungeon-assets-docs/getting-started/quick-start-integration-to-als.md).

# Quick Start integration to ALS

## Retarget all animations to the ALS Skeletal Mesh

### <mark style="color:red;">Make sure you have all animations retargeted to your character before continuing!</mark>

Under <mark style="color:orange;">ActionMagicSystem/Demo/Animations/Mage/Montages</mark> AND <mark style="color:orange;">ActionMagicSystem/Demo/Animations/Mage</mark> select the montages/AnimSequences and retarget them

<mark style="color:red;">**Not all animations may look like they support to be, make sure they are retargeted correctly and tweak them in the retargeter  if necessary!**</mark>

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2F7Er3gs4i2D9PwWl9m9aL%2FScreenshot%202024-09-07%20160149.png?alt=media&amp;token=f78107c9-290a-4390-b2ea-ccea6d7bdf0b" alt=""><figcaption></figcaption></figure>

## Add a gameplay Tag

Before continuing, make sure you add a gameplay Tag Called <mark style="color:orange;">MagicCombatMode</mark> under the <mark style="color:orange;">Overlay Mode</mark> Category in Project Settings Gamplay Tags

it will look like this

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2FDXL4GAgr7cCGV13HUHTW%2FScreenshot%202024-09-07%20170811.png?alt=media&amp;token=75edff32-8125-4168-b026-033ab566526f" alt=""><figcaption></figcaption></figure>

\
open your  ALS character\
Add the character interface

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2FkzOPdGStj5A0qMBTp71W%2FScreenshot%202024-09-07%20141230.png?alt=media&amp;token=11b585cf-6173-4d73-9221-70cc343f0ac6" alt=""><figcaption></figcaption></figure>

Add the components to your  ALS character

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2FbkCiQm1Rv4LCkK6fn1YC%2FScreenshot%202024-09-07%20141532.png?alt=media&amp;token=514f80af-a5ae-46a3-97cf-553cb5de7d62" alt=""><figcaption></figcaption></figure>

Check stats component and targeting component for its settings

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2F1kZlWElowBLkRMT2Of9v%2FScreenshot%202024-09-07%20142317.png?alt=media&amp;token=c0566e9f-2881-4644-8b90-f1e4c0e5724b" alt=""><figcaption></figcaption></figure>

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2F0xWmkR7VKAjspzIB1UgQ%2FScreenshot%202024-09-07%20142355.png?alt=media&amp;token=b352270d-5aae-40b5-b37a-d33915e57c81" alt=""><figcaption></figcaption></figure>

In your character, go to the interface functions and add these components

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2FhC2QgME62lV55dj3UZWM%2FScreenshot%202024-09-07%20142601.png?alt=media&amp;token=18c8b09f-a620-4a38-b047-a9f54e03967b" alt=""><figcaption></figcaption></figure>

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2FlhgjkwZT5kd52uyj2USL%2FScreenshot%202024-09-07%20142631.png?alt=media&amp;token=90495788-45a3-4c58-92aa-4bef81bd6eb7" alt=""><figcaption></figcaption></figure>

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2FDTSZxObvGhWQgs3eM3I2%2FScreenshot%202024-09-07%20142751.png?alt=media&amp;token=c1d7c6b3-bbc6-4dbf-a7c8-4ab2686822be" alt=""><figcaption></figcaption></figure>

Go to ActionMagicSystem/Blueprints/Interfaces and open Spell\_System\_Character\_Interface

Open the interface and open Get Camera Component function

In the output, add Minimal View info variable

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2F4FOSITWFz3jwadkfQHd4%2FScreenshot%202024-09-07%20161638.png?alt=media&amp;token=e7f66cbb-4de8-40a1-a0e2-bda35d707d9d" alt=""><figcaption></figcaption></figure>

Add Two more Functions to the interface called <mark style="color:orange;">Set Overlay Mode</mark> and <mark style="color:orange;">Set Rotation Mode</mark> with the input variable as <mark style="color:orange;">Gameplay Tag</mark>

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2F1WPyieSS1q6nVzGFAL4S%2FScreenshot%202024-09-07%20165322.png?alt=media&amp;token=464c2d21-902d-4cc6-a063-d320ff847607" alt=""><figcaption></figcaption></figure>

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2F1W2jb9tiu25znVo6se50%2FScreenshot%202024-09-07%20165501.png?alt=media&amp;token=f2e81223-27ae-4ea7-9d1c-775bb4fa7fbc" alt=""><figcaption></figcaption></figure>

In your character get the camera->Get View Info and connect the pin

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2FwpL0t559i13KVBKtlBjc%2FScreenshot%202024-09-07%20161831.png?alt=media&amp;token=b9bc49bc-94ab-424a-a14c-0664850296f2" alt=""><figcaption></figcaption></figure>

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2FWUjJ81ttCVFqPZg6HtxO%2FScreenshot%202024-09-07%20142909.png?alt=media&amp;token=1a8dfa0a-e166-4383-9a1e-f1bfc43163ed" alt=""><figcaption><p>Add the self node to the pin</p></figcaption></figure>

In your character, add these Events you just created

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2FfSPDkBUBnUicdebGDkF1%2FScreenshot%202024-09-07%20165604.png?alt=media&amp;token=45a96ea3-cfc2-41f2-9d20-db4070c72ee3" alt=""><figcaption></figcaption></figure>

Go to Plugins/Advanced Locomotion System/ALS/Character/AnimationInstances/Overlays

Duplicate Any overlay Animation Blueprint in my example <mark style="color:orange;">AB\_Als\_Torch</mark>

Rename the New Overlay <mark style="color:orange;">AB\_Als\_MagicCombatMode</mark>

Delete the aiming part and copy paste the not aiming part and connect it to the aiming pose

Replace all animation sequenes with the sequence called Anim\_Idle you retargeted for your als character

![](https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2F3NmP5WkKwIvb4tTVAZyf%2FScreenshot%202024-09-07%20170252.png?alt=media\&token=5f3f78de-523c-4e9c-9150-843771c6005c)

The result will look like the picture below

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2FCrCtsXHQXDPIphLQB2Ns%2FScreenshot%202024-09-07%20170111.png?alt=media&amp;token=4b21864a-e23d-46ef-b599-f9813389dc91" alt=""><figcaption></figcaption></figure>

Now go back to you ALS Character BP and find the function <mark style="color:orange;">RefreshOverlayLinkedAnimationLayer</mark>

Add your new overlay into the array <mark style="color:orange;">OverlayAnimationInstanceClasses</mark>&#x20;

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2FTKH9tkCsZFQYsTEK20KW%2FScreenshot%202024-09-07%20163653.png?alt=media&amp;token=8deb7f37-9ecd-486b-b227-e215a927bc17" alt=""><figcaption></figcaption></figure>

Open the Anim\_Idle your retargeted and open the animation data modifiers window add the Create Layering curves modifier and apply it

![](https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2F3NmP5WkKwIvb4tTVAZyf%2FScreenshot%202024-09-07%20170252.png?alt=media\&token=5f3f78de-523c-4e9c-9150-843771c6005c)

your animation looks like this now

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2FIxjqnoNeGnFJ6qlnzyK5%2FScreenshot%202024-09-07%20172021.png?alt=media&amp;token=43bc5639-95a3-4cf4-8cc0-740ba46d6f59" alt=""><figcaption></figcaption></figure>

Edit the Following curves with the following values<br>

1. LayerArmLeft Value: 1
2. LayerArmLeftAdditive Value: 1
3. LayerArmRight Value: 1
4. LayerArmRightLocalSpace Value: 1
5. LayerHandLeft Value: 1
6. LayerHandRight Value: 1
7. AllowAiming Value: 1

Save the animation

if all is correct, it looks like this

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2FyP2IO2a7dL3DuDSVrVbf%2FCombatMode.gif?alt=media&amp;token=e60678a1-eca6-4d2e-8ea7-66663a6480c9" alt=""><figcaption></figcaption></figure>

Open The Spell Function Library in <mark style="color:orange;">ActionMagicSystem/Blueprints/Function\_Library</mark>

Open the Function <mark style="color:orange;">Box Trace Forward</mark>

After the Get Camera Component call remove the valid node and break the view info node, connect the Location and rotation values like in the picture below

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2F9CeLndHICnO2Jx3vmvky%2FScreenshot%202024-09-07%20172856.png?alt=media&amp;token=93d0ee05-8866-42d2-848f-daed63f19d37" alt=""><figcaption></figcaption></figure>

Replace the world connect with the player

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2FtZSSlKaGvpY6LrOioNeH%2FScreenshot%202024-09-07%20173254.png?alt=media&amp;token=b2da0425-a5d4-4345-b6b2-18f0cd7c66e0" alt=""><figcaption></figcaption></figure>

Open the <mark style="color:orange;">Spell\_System\_Component</mark>

Get any Get Camera Component node and right-click it and select find references

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2Fl2F5ttdj0ghQec7on9Fj%2FScreenshot%202024-09-07%20174746.png?alt=media&amp;token=69084492-9ae2-41cb-92ef-15e88c578211" alt=""><figcaption></figcaption></figure>

Go through all references and remove the location and rotation pins from the camera and connect them to the view info&#x20;

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2F5N9c3dmOPyFmEADAFuzm%2FScreenshot%202024-09-07%20175027.png?alt=media&amp;token=cecd5535-012c-4a9f-bfd6-df9b7b38313a" alt=""><figcaption></figcaption></figure>

Open  the Targeting Component Spell\_System\_Targeting\_Component and open the Try Target&#x20;

Replace the location and rotation values from the get camera component node and connect them to the view info structure

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2FVLygRH7kt74sP8j32qty%2FScreenshot%202024-09-07%20175540.png?alt=media&amp;token=f2f42976-3627-49f1-9420-8ef55af6e679" alt=""><figcaption></figcaption></figure>

Remove the is valid node and just tick the bool in all select nodes

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2FYHhCxhpcKeqgmauOzje6%2FScreenshot%202024-09-07%20175618.png?alt=media&amp;token=78cb1de4-1d4b-45fb-b90b-5106296067cd" alt=""><figcaption></figcaption></figure>

If all is correct, it should look like this

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2FCJdY7m8WKplHShqXoiSQ%2FTargeting-ezgif.com-optimize.gif?alt=media&amp;token=9bb37a70-12cf-4303-aad3-1024ecafe774" alt=""><figcaption></figcaption></figure>

Open your ALS anim BP <mark style="color:orange;">AB\_Als</mark>

Cache the pose at the end and add a classic layer blend after the cached pose with the following settings like in the picture below

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2F8sVIaYODzN9hKxQIAx4M%2FScreenshot%202024-09-07%20181443.png?alt=media&amp;token=0e9bb30c-7b75-4a6d-8f32-aec7b287d768" alt=""><figcaption></figcaption></figure>

Add a default slot node at the end

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2FmqVCJ3z7Q7kfnFhcWVMq%2FScreenshot%202024-09-07%20183729.png?alt=media&amp;token=6b766123-01a3-4eaa-bbfe-9502bd453037" alt=""><figcaption></figcaption></figure>

## <mark style="color:red;">IMPORTANT</mark>

You have to go through all montages you retargeted and either Set the Group to <mark style="color:red;">Default</mark> or <mark style="color:red;">Upper Body</mark>

## Closing Words

This Component was not made with ALS in mind, but it was made so it can be added to many different game types with ALS comes  a powerful animation system, but this means it needs a lot of work to tweak the system and assets so they work hand in hand together, this Quick start integration was written so you can quickly get the system to work with ALS, but it may not look as good as with the normal animation system, please tweak the animations and blend them correctly within ALS to get the expected result

<figure><img src="https://603854490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIYpx8GDKCTy6DRbPD4HF%2Fuploads%2FiW0KCiMJbhCjVQPpAtTv%2FDemo.gif?alt=media&amp;token=96915e65-ff24-4737-987f-a7e11d2f03a2" alt=""><figcaption></figcaption></figure>
