# FadeTo Action

## Overview

![The FadeTo Action Node.](https://2561100106-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Ff6JZovzOqBctA4C1o76u%2Fuploads%2Fgit-blob-72d5dc1e1ddd44ee77d4f26579a5ae61c6b67f36%2Ffadetoactionupdatedimage.png?alt=media)

The **FadeTo Action Node** continuously modifies the `Opacity` of an [**Object**](https://docs.incari.com/incari-studio/2023.2/objects-and-types/scene-objects) over a specified period of time, thus creating an **Animation**. The final value of the `Opacity` is set by the user. Find an [example](#example) of how to use this **Node** and its effect over an **Object** at the end of this page.

Furthermore, visit the [**Actions Nodes**](https://docs.incari.com/incari-studio/2023.2/toolbox/actions) page for a general introduction to these **Nodes**.

[**Scope**](https://docs.incari.com/incari-studio/2023.2/overview#scopes): **Scene**, **Function**, **Prefab**.

## Attributes

![The FadeTo Action Node Attributes.](https://2561100106-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Ff6JZovzOqBctA4C1o76u%2Fuploads%2Fgit-blob-9db984d0374d15b3699efd606076d90f897aaca2%2Ffadetoactionattributes.png?alt=media)

| Attribute        | Type          | Description                                                                                                                                                                                                                                                                                                                                |
| ---------------- | ------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| `Duration (sec)` | **Float**     | The total time of the **Action**, if none is received in the `Duration` **Input Socket**.                                                                                                                                                                                                                                                  |
| `To`             | **Float**     | The desired `Opacity` value at the end of the **Action**, if none is received in the `To` **Input Socket**.                                                                                                                                                                                                                                |
| `Interpolation`  | **Drop-down** | The `Interpolation` method to use for calculating the intermediate values of the `Opacity`. It can be [*Linear*](https://en.wikipedia.org/wiki/Linear_interpolation), [*Sine Ease In*](https://easings.net/#easeInSine), [*Sine Ease In Out*](https://easings.net/#easeInOutSine), or [*Sine Ease Out*](https://easings.net/#easeOutSine). |

## Inputs

| Input         | Type           | Description                                                                                                                                                                                               |
| ------------- | -------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `Instance ID` | **InstanceID** | The assigned [**Instance ID**](https://docs.incari.com/incari-studio/2023.2/toolbox/actions/..#instance-id) of the **Action**. If nothing is received, it automatically assigns 0 as the **Instance ID**. |
| (►) `Start`   | **Pulse**      | A standard **Input Pulse**, to trigger the execution of the **Node**.                                                                                                                                     |
| `Object ID`   | **ObjectID**   | The ID of the target **Object**.                                                                                                                                                                          |
| `Duration`    | **Float**      | The total time (in seconds).                                                                                                                                                                              |
| `To`          | **Float**      | The desired `Opacity` value at the end of the **Action**.                                                                                                                                                 |

## Outputs

| Output        | Type           | Description                                                                                                                    |
| ------------- | -------------- | ------------------------------------------------------------------------------------------------------------------------------ |
| `Instance ID` | **InstanceID** | The assigned [**Instance ID**](https://docs.incari.com/incari-studio/2023.2/toolbox/actions/..#instance-id) of the **Action**. |
| `OnStart` (►) | **Pulse**      | Flows to the next **Node** following **FadeTo Action** when the **Action** starts.                                             |
| `OnEnd` (►)   | **Pulse**      | Flows to the next **Node** following **FadeTo Action** when the **Action** stops.                                              |

## Example

This section shows a simple example of how to use the **FadeTo Action** **Node** and the effect it has on an **Object**. We start by [configuring the **Scene**](#scene-configuration), then [build the **Logic**](#logic), and finally show the [result](#final-result).

### Scene Configuration

We consider a [**Scene**](https://docs.incari.com/incari-studio/2023.2/objects-and-types/project-objects/scene) with two [**Objects**](https://docs.incari.com/incari-studio/2023.2/objects-and-types/scene-objects): a white arc over a black background, both of which can be easily created in the [**Scene Outliner**](https://docs.incari.com/incari-studio/2023.2/modules/scene-outliner). Then, we set the `Size` **Attribute** of the arc to $$(500, 500, 0)$$. See this configuration in the following image:

![Scene configuration.](https://2561100106-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Ff6JZovzOqBctA4C1o76u%2Fuploads%2Fgit-blob-a43624c1e024a8bd79b03e08fb0603af4ab21645%2FExampleFadeTo_1.png?alt=media)

### Logic

We then need to configure the **Logic**. This is done in the [**Logic Editor**](https://docs.incari.com/incari-studio/2023.2/modules/logic-editor).

We use the **FadeTo Action** **Node** with the following **Attributes**:

* `Duration (sec)`: $$2$$
* `To`: $$0.05$$
* `Interpolation`: `Linear`

And we connect to it the [**Object Node**](https://docs.incari.com/incari-studio/2023.2/objects-and-types/scene-objects#objects-in-the-logic) of the arc and a **Pulse** to the `Start` **Input Socket**. Thus, having the following **Logic** configuration:

![Logic configuration.](https://2561100106-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Ff6JZovzOqBctA4C1o76u%2Fuploads%2Fgit-blob-9b5d4842eae4306724f6c136b2b9b6f36b5bff9a%2FExampleFadeTo_2.png?alt=media)

### Final result

Finally, the effect of the **ScaleTo Action** **Node** when triggered is the following:

![Final result.](https://2561100106-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Ff6JZovzOqBctA4C1o76u%2Fuploads%2Fgit-blob-bd0a772547ab2a16bbf06677498df204b2a02f1f%2FExampleFadeTo_3.gif?alt=media)

## See Also

* [**FadeFromTo Action**](https://docs.incari.com/incari-studio/2023.2/toolbox/actions/fadefromtoaction)

## External Links

* [*Transparency (graphic)*](https://en.wikipedia.org/wiki/Transparency_\(graphic\)) on Wikipedia.