> ## Documentation Index
> Fetch the complete documentation index at: https://docs.pyne.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# User Click

Use the `User Click` step (also known as User Action) to **guide** the user through your product and encourage them to perform a specific action.

**Key Characteristics:**

* **Avatar Behaviour:** Once the step is executed, the avatar **pauses and waits** for the user to complete the required action (e.g., clicking a button).
* **Progression:** The guide proceeds only after the user performs the action.
* **Common Use Cases:** Guiding a user to create a new project or explore different sections of your product.

*Example: User Action in Scoro to guide the user through the platform (styling: Pulsing Border, Click)*

<video controls width="100%" src="https://base.pyne.ai/storage/v1/object/public/docs//Scoro_User_Click.mp4" title="User Click Example Video">
  Sorry, your browser doesn't support embedded videos.
</video>

***

### Styling Options

`User Click` steps involve pointer actions which can have different animations, depending on the design of your product, storyline and your needs. The design is set up in the ***right side-bar of the step. →***

<img src="https://mintcdn.com/pynegmbh/kQ-U5xvcWyOX7gqR/assets/images/styling-options-sidebar.png?fit=max&auto=format&n=kQ-U5xvcWyOX7gqR&q=85&s=65d503a142ff6d536618f2585434dffc" alt="Styling Options Sidebar" width="774" height="978" data-path="assets/images/styling-options-sidebar.png" />

There are 4 designs for **Pointer Action** animations:

<ol className="styling-gif-list">
  <li>
    <strong>Click</strong>

    <img src="https://mintcdn.com/pynegmbh/kQ-U5xvcWyOX7gqR/gifs/click-pointer.gif?s=d9ad0e259556d655cab9e35856deb075" alt="Click Pointer GIF" width="472" height="296" data-path="gifs/click-pointer.gif" />

    Shows an animated cursor performing a click action on the target element.
  </li>

  <li>
    <strong>Type</strong>

    <img src="https://mintcdn.com/pynegmbh/kQ-U5xvcWyOX7gqR/gifs/type-pointer.gif?s=0d1b2be3a837d17966022ab44480a11a" alt="Type Pointer GIF" width="700" height="456" data-path="gifs/type-pointer.gif" />

    Displays an animated cursor with a blinking caret, simulating typing within
    the target field.
  </li>

  <li>
    <strong>Point</strong>

    <img src="https://mintcdn.com/pynegmbh/kQ-U5xvcWyOX7gqR/gifs/point-pointer.gif?s=8a314c058844c4b504389db96451defc" alt="Point Pointer GIF" width="191" height="118" data-path="gifs/point-pointer.gif" />

    An animated cursor points directly at the target element without clicking.
  </li>

  <li>
    <strong>Hidden Pointer</strong>

    <img src="https://mintcdn.com/pynegmbh/kQ-U5xvcWyOX7gqR/gifs/hidden-pointer-or-backdrop.gif?s=f4e8d6b544e65ffb34caab2911f41dbd" alt="Hidden Pointer GIF" width="472" height="296" data-path="gifs/hidden-pointer-or-backdrop.gif" />

    No pointer animation is shown; the element is simply highlighted or targeted
    for the action.
  </li>
</ol>
