> For the complete documentation index, see [llms.txt](https://handtracking.lightbuzz.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://handtracking.lightbuzz.com/examples/no-code-detect-and-visualize-hands-from-a-sprite.md).

# No Code: Detect and visualize hands from a Sprite

This example demonstrates how to detect and visualize fingers in an image sprite using an [ImageView](/ui-reference/imageview.md),  a [SpriteSource](/ui-reference/streamsource/spritesource.md), a [HandManager](/ui-reference/handmanager.md) and a [HandViewer](/ui-reference/handviewer.md). No code is needed for this example!

{% hint style="warning" %}
All Hand Tracking Unity plugin samples are no-code! You can find the code versions in the `Examples` section of this documentation.
{% endhint %}

{% hint style="info" %}
This is a walkthrough of the `LightBuzz_Hand_Tracking_Picture` Hand Tracking Unity plugin sample.&#x20;
{% endhint %}

#### Step 1: Create a Unity scene

Open the Unity Project you created in the [Installation](/hand-tracking-unity-plugin/installation.md) section.

Right-click on the `Assets` folder and select `Create > Scene`.

<figure><img src="/files/AWAZBZqNkgh8mdgwr3hv" alt=""><figcaption><p>Create new scene</p></figcaption></figure>

Type the scene's name. In this example, we'll use the name `PictureDemoNC`.

After the scene is created, right-click on the scene and select `GameObject > UI > Canvas`.

<figure><img src="/files/SOVl2RObo6YAMFPnsd5J" alt=""><figcaption><p>Add a Canvas</p></figcaption></figure>

#### Step 2: Add hand tracking prefabs

Navigate to the LightBuzz `Prefabs` folder at `Assets\LightBuzz Hand Tracking\Runtime\Prefabs`.

<figure><img src="/files/aLOxlnZxIBjwQFtfkzwZ" alt=""><figcaption><p>LightBuzz Prefabs</p></figcaption></figure>

For this example, drag and drop the [ImageView](/ui-reference/imageview.md), [SpriteSource](/ui-reference/streamsource/spritesource.md), [HandViewer](/ui-reference/handviewer.md) and [HandManager](/ui-reference/handmanager.md) prefabs into the Canvas.

<figure><img src="/files/EcALmttcB1gbOreRV2tg" alt=""><figcaption><p>Add prefabs</p></figcaption></figure>

Select the [SpriteSource](/ui-reference/streamsource/spritesource.md) prefab and connect the `Sprite` field to an image sprite. You can either use the demo image sprite `lightbuzz-hand-tracking.png` included in the `Assets/LightBuzz Hand Tracking/Runtime/Media` folder or create your own image sprite.

<figure><img src="/files/GlIOHE0ryaagjza8xtQD" alt=""><figcaption><p>Connect field to SpriteSource</p></figcaption></figure>

#### Step 3: Set render options

After connecting all the fields, navigate to the `Canvas` to set the render options.

Change the `Render Mode` to `Screen Space - Camera`.

<figure><img src="/files/8xapwQLfkO58oNi2gJhH" alt=""><figcaption><p>Change Render Mode</p></figcaption></figure>

Then, set the `Main Camera,` from the Scene tab, as the `Render Camera`.

<figure><img src="/files/FKcxZ5Eyq9JlM0GAFHZu" alt=""><figcaption><p>Select Render Camera</p></figcaption></figure>

When all the render options are set, the result should look like the following image.

<figure><img src="/files/bVxgPsw5dk4FXW0xcKXy" alt=""><figcaption><p>Render settings</p></figcaption></figure>

By following these steps, you will be able to detect and visualize fingers in an image sprite without a single line of code.
