Display model as image on UI layer?

Greetings,

I’m trying to compose a series of “tutorial” screens to teach players how to play my 3D space shooter.
I have really nice 3D models I am using in my game that I’d like to include on these “documentation” pages.

I’m arranging a 2D UI screen like so:
6279968--694001--upload_2020-9-4_19-14-49.png

I would like to superimpose these models above the labels:


I’d also like them to be animated (e.g. rotate) if possible.

If I just add them to the scene I cannot get them to render correctly along with the UI elements.

What’s the best way to accomplish this?

Thanks!

I’ve tried capturing images of these models and creating 2D sprites from them but I can’t get them to be transparent.
I tried following these steps to use MS Word to make a transparent version of the image and in Word it goes from this:
6280223--694070--upload_2020-9-4_22-28-32.png
to this:
6280223--694073--upload_2020-9-4_22-28-43.png

But when I pull into Unity it’s still not transparent:
6280223--694076--upload_2020-9-4_22-28-59.png

I’m sure I’m not the first person to try to do this so I’m really hoping somebody chimes in soon.

What you should do is render the models to a render texture ( just point a camera at it and set the camera Target to a render texture). Them you can render with transparent background.

You can just rotate the model as normal and have it updated in real time. If you want to take a still image and save it as a regular texture (to avoid rendering it in real time which is costly) here’s some code that can get you started.

Oh, and by the way, if you want to remove the background from an image in an external tool, word is not a good choice. Photoshop, GIMP or paint.NET are much better. The latter 2 are free.

Good luck!

Thanks for the reply. I was actually able to get 3D models to show up in the UI with a separate camera. Here’s a short video showing what I’ve got so far.

https://www.youtube.com/watch?v=24URCp_aBaw

1 Like

Ok, so I’ve got my 3D models displaying correctly but now I want to just drop some transparent sprites for Mouse and Keyboard visuals. I found some supposedly transparent png files which I’ve dragged into Unity but when I add them to a scene they are anything but transparent and I don’t see any settings that would control the transparent background:
6284384--694823--upload_2020-9-6_17-6-7.png

I am guessing you found those by googling. Most sites that offer things like that don’t give you the real transparent version until you register and do a bunch of other onerous steps. A good site to pull icons for prototypes (and beyond) is game-icons.net. It is free and they allow you to download a transparent png, no problem.

Here is a mouse icon: https://game-icons.net/1x1/delapouite/mouse.html

If that doesn’t work, check the import settings on your texture. You may have to check the box that reads “alpha is transparency” for your situation.