# How to make a 2D menu that displays 3D elements

**URL:** <https://forums.unrealengine.com/t/how-to-make-a-2d-menu-that-displays-3d-elements/463761>\
**Category:** UI\
**Tags:** menu-creation, unreal-engine, menu, Widget, Blueprint, question\
**Created:** [April 14, 2020, 12:34pm UTC](https://forums.unrealengine.com/t/how-to-make-a-2d-menu-that-displays-3d-elements/463761 "2020-04-14T12:34:37Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![dylanvgames](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@dylanvgames](https://forums.unrealengine.com/u/dylanvgames)\
**Post date:** [April 14, 2020, 12:34pm UTC](https://forums.unrealengine.com/t/how-to-make-a-2d-menu-that-displays-3d-elements/463761/1 "2020-04-14T12:34:37Z")

</div>

I’m wanting to make a UI screen somewhat like what super mario odyssey or pokemon sword/shield are accomplishing right now where they seem to have a 2D UI foreground, a 3D element and a 2D UI background  
somewhat like this

 ![299700-pokemon-sword-and-shield-9.jpg](https://d3kjluh73b9h9o.cloudfront.net/original/4X/9/b/e/9bed7b71c6753a35ec923bb837a428f83ca75229.jpeg)

where we have a 2D menu, a 3D element and a 2D background

I’m not asking for the logic of the menu or how to actually create the UI design, what I’m really asking is how can I have a 3D mesh, character or whatever mixed in with my widgets like that?

or maybe another approach is to ask, how can I impose a 3D element over a widget that is added to the screen?

I’ve thought of layering the elements, adding a foreground widget with all the menus, then a 3D mesh with a camera attached but then how would I add the background widget?

---

<div class="post-metadata">

**Author:** ![Everynone](https://d1ap1mz92jnks1.cloudfront.net/user_avatar/forums.unrealengine.com/everynone/32/1135017_2.png) [@Everynone](https://forums.unrealengine.com/u/Everynone)\
**Post date:** [April 14, 2020, 12:51pm UTC](https://forums.unrealengine.com/t/how-to-make-a-2d-menu-that-displays-3d-elements/463761/2 "2020-04-14T12:51:01Z")

</div>

Render Targets

You create a nicely lit room for the 3d creature, add a camera and then render what the camera sees to a texture. Use the texture in a material displayed by an UMG element. That’s the gist.

Docs:

> **[Render Targets](https://docs.unrealengine.com/4.27/en-US/RenderingAndGraphics/RenderTargets/)**
>
> Using Render Targets in Unreal Engine 4.

A quick YT search:

  
Or something non-YT:  

> **[Render 3D objects in UMG Widget/HUD](https://engineunreal.wordpress.com/2015/04/21/render-3d-objects-in-umg-widget-hud/)**
>
> A tutorial on how to render a 3D object/mesh in a UMG Widget/HUD

---

<div class="post-metadata">

**Author:** ![dylanvgames](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@dylanvgames](https://forums.unrealengine.com/u/dylanvgames)\
**Post date:** [April 14, 2020, 12:54pm UTC](https://forums.unrealengine.com/t/how-to-make-a-2d-menu-that-displays-3d-elements/463761/3 "2020-04-14T12:54:43Z")

</div>

Thanks for the help, render targets are actually what I was looking for

---

<div class="post-metadata">

**Author:** ![Anonymous\_f03eead13918b3092af3c07d5d434ec9](https://d1ap1mz92jnks1.cloudfront.net/user_avatar/forums.unrealengine.com/anonymous_f03eead13918b3092af3c07d5d434ec9/32/1017940_2.png) [@Anonymous\_f03eead13918b3092af3c07d5d434ec9](https://forums.unrealengine.com/u/Anonymous_f03eead13918b3092af3c07d5d434ec9)\
**Post date:** [August 11, 2024, 2:07pm UTC](https://forums.unrealengine.com/t/how-to-make-a-2d-menu-that-displays-3d-elements/463761/4 "2024-08-11T14:07:47Z")

</div>

In the Render Targets solution, you need to generate all objects in the main scene at the same time, and their lights may affect each other. I have developed a plugin that makes working more easier，In this solution, each UMG view component contains an FPreviewScene object, and they each have an independent UWorld objects,they will not affect each other or the main scene.  
[https://www.unrealengine.com/marketplace/zh-CN/product/b93b1c54b46a49d1bad5550d831a3a60](https://www.unrealengine.com/marketplace/zh-CN/product/b93b1c54b46a49d1bad5550d831a3a60)
