> For the complete documentation index, see [llms.txt](https://octanta-studio.gitbook.io/automatic-tutorial-maker-for-unity-in-game-tips/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://octanta-studio.gitbook.io/automatic-tutorial-maker-for-unity-in-game-tips/usage-guide/advanced-creating-visual-prefab.md). # Advanced: Creating Visual Prefab Creating custom visuals from scratch. ## Custom UI Pointer or Hover * Create a GameObject on UI layer and add a pointer image to it. * Add UIPointerGraphAnimation component to the main GameObject. * In Settings field, assign settings. Create new ones via Create > Tutorial System > Pointer Graphic Settings. For full animation control, use UIPointerNone settings. * Optionally add a text element and assign it to Text Element field to display step text. * Add all pointer's images to Images To Lerp list for automatic raycast disable and fade animations possible. * For mouse-style pointers, add mouse parts to corresponding fields for animation. * Make it a prefab by dragging to your folder. You can now assign this prefab to the Pointer Prefab and Hover Prefab fields in the tutorial step. ## Custom UI Graphic

* Create a GameObject on UI layer and add required graphics to it - **main composition, popup window, animations, etc**. * Add UIGraphicAnimation component to the main GameObject. * In Settings field, assign settings. Create new ones via Create > Tutorial System > Graphic Settings. For full animation control, use UI Graphics None settings. * Optionally set **Background** color for graphics background dimming. * Choose positioning relative to canvas or use current anchors. * Optionally add text element and assign it to **Text** Element field to display step text. * Add all graphic's images to Images To Lerp list for automatic raycast disable and fade animations. * In **Confirm Button** field, assign a button that requires pressing before completing the step. Important: button click must trigger InitializeByConfirm method in UIGraphicAnimation. * In **Gesture Graphic** field, assign swipe animation object to reflect swipe direction without duplicating graphics. * Make it a prefab by dragging to your folder. You can now assign this prefab to the Graphic Prefab fields in the tutorial step.

Confirm Button should have a reference to the graphic script and activate InitializeByConfirm method

## Custom World Pointer or Hover * Create a GameObject in world coordinates and add a pointer sprite/mesh to it. * Add WorldPointerAnimation component to the main GameObject. * In Settings field, assign settings. Create new ones via Create > Tutorial System > World Pointer Settings. For full animation control, use WorldPointerNone settings. * Optionally add a world text element and assign it to Text Element field to display step text. * Add all pointer's sprites to Sprites To Lerp list and all pointer\`s meshes to Meshes To Lerp list for automatic raycast disable and fade animations possible. * For Frame-style pointers, add a Frame Corner Prefab of upper left corner. * Make it a prefab by dragging to your folder. You can now assign this prefab to the World Pointer Prefab and World Hover Prefab fields in the tutorial step. ## Custom World Graphic * Create a GameObject in world coordinates and add required graphics to it. * Add WorldGraphicAnimation component to the main GameObject. * In Settings field, assign settings. Create new ones via Create > Tutorial System > World Graphic Settings. For full animation control, use UI Graphics None settings. Choose positioning relative to Camera or use current position. * Optionally add text element and assign it to **Text** Element field to display step text. * Add all pointer's sprites to Sprites To Lerp list and all pointer\`s meshes to Meshes To Lerp list for automatic raycast disable and fade animations possible. * Make it a prefab by dragging to your folder. You can now assign this prefab to the World Graphic Prefab fields in the tutorial step.