# Using Your Own HUD

This page serves as a guide on how to get Quest Map Pro working within your own HUD widget. The steps here should be followed closely to ensure all functionality works as intended, but may need to be adjusted slightly on a project-by-project basis.

{% hint style="info" %}
This tutorial assumes you have already completed the [Integration tutorial](https://dapper-raptor.gitbook.io/quest-map-pro/getting-started/integration) and have Quest Map Pro successfully working within your project.
{% endhint %}

## YouTube Tutorial

The video version of this tutorial is quite similar to the written version.  However, the video version may be outdated with small alterations that have happened as a result of the ongoing development of features for Quest Map Pro. With all video tutorials, any alterations to the process will be left as a pinned comment on the video, or just below the embedded video on this page.

{% embed url="<https://www.youtube.com/watch?v=vsADccEymCc>" %}

<details>

<summary>Changes to Using Your Own HUD video</summary>

As of version 1.2.1 there is an additional small step that is not covered in this video. If you do not complete it the system will still work, but you will get an error and the full screen mode won't work either. The new step is covered in this video: <https://www.youtube.com/watch?v=inUpWgB-YPI>

</details>

## Written Tutorial

The written version of this tutorial is broken down into steps for easier readability.

Step 1: [Place the Compass Element](https://dapper-raptor.gitbook.io/quest-map-pro/getting-started/using-your-own-hud/place-the-compass-element)

Step 2: [Place the World Map Element](https://dapper-raptor.gitbook.io/quest-map-pro/getting-started/using-your-own-hud/place-the-world-map-element)

Step 3: [Place the Mini Map Element](https://dapper-raptor.gitbook.io/quest-map-pro/getting-started/using-your-own-hud/place-the-mini-map-element)

Step 4: [Name the Elements](https://dapper-raptor.gitbook.io/quest-map-pro/getting-started/using-your-own-hud/name-the-elements)

Step 5: [Add Interface to your HUD](https://dapper-raptor.gitbook.io/quest-map-pro/getting-started/using-your-own-hud/add-interface-to-your-hud)

Step 6: [Set Up Interface Functions (HUD)](https://dapper-raptor.gitbook.io/quest-map-pro/getting-started/using-your-own-hud/set-up-interface-functions-hud)

Step 7: [Set Up Interface Functions (Controller)](https://dapper-raptor.gitbook.io/quest-map-pro/getting-started/using-your-own-hud/set-up-interface-functions-controller)

Step 8: [Disable the Example UI](https://dapper-raptor.gitbook.io/quest-map-pro/getting-started/using-your-own-hud/disable-the-example-ui)