# Building a MapCard

### Overview <a href="#overview" id="overview"></a>

This tutorial will effectively explore creating a MapCard Showcase in Experience Cloud using the Avonni Card and Avonni Map components. This combination is ideal for visually displaying the location of a current record, enriching the user interface with interactive and informative elements.

<details>

<summary>Why Use These Components?</summary>

*
*
*
*

</details>

<figure><img src="https://docs.avonnicomponents.com/~gitbook/image?url=https%3A%2F%2F2929066058-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FDL6JQuZArjJeQvX2ot4y%252Fuploads%252Fs6njbDNzNN8up2KP6qRJ%252F2023-11-22_19-19-45.png%3Falt%3Dmedia%26token%3D38733485-caf5-4634-b5cb-9681cc7ec011&#x26;width=768&#x26;dpr=4&#x26;quality=100&#x26;sign=c9b0e819&#x26;sv=2" alt=""><figcaption></figcaption></figure>

### Interactive Step-by-Step Configuration Guide <a href="#interactive-step-by-step-configuration-guide" id="interactive-step-by-step-configuration-guide"></a>

{% @arcade/embed flowId="F0VciPTA0t1l0UjNq00o" url="<https://app.arcade.software/share/F0VciPTA0t1l0UjNq00o>" %}
