Unreal Engine 4 Interactive Sci Fi Screens! (Widget Blueprints Tutorial)

[@YF-Waifu]

This topic is such a hard one to find tutorials on. Your guide still holds up in Unreal Engine 5.1.1, I can't thank you enough for this tutorial. you deserve way more subscribers than you have.

[@goktugsimbt]

Hello, is it work on UE 5.3?

[@YF-Waifu]

@@goktugsimbt not sure, but it is likely it will

[@gamemakerdude]

25:00 to 26:00 is how you actually setup a widget to appear in the world. I have been searching online for a long time to figure this out! I have only been able to get 2D widgets to display up until this point. I had no idea I could actually attach it to an actor rather than using the "create widget -> add to viewport" method. Thank you so much for this, and it looks awesome!

[@PsychoticSorcerer666]

Doom 3 impressed me back in the 2000's because it used this system instead of the "press a button and your character just does it" system most FPS's use. I love that you created this tutorial so I could add it in mine too!

[@chlbrn]

Really want to say thank you, man. You are awesome. I am currently working on interactive designs like 3d widgets and hud for a VR project. You inspire me a lot.

[@thepolygonpilgrimage]

Charlie.H Really glad it helped you# Feel free to let me know if you have any questions. Even if I don't know the answer then I'll go work to figure it out and come back to you with the answer. then we both know and have learned and grown; and that's what it's all about! :) If you'd like subscribe for more tutorials and content as I continue development. Cheers~

[@Dj3ndo]

Exactly what i needed for my graduation project! Thank you!

[@thepolygonpilgrimage]

Very happy to have helped! Good luck! :)

[@Scors4]

I like this tutorial, and I thank you for it! This has helped me immensely and now I must build panels to validate having interactive screens.

[@thepolygonpilgrimage]

Scors4 That's great! :)

[@alt3741]

Matt, honestly, you are great! One day I’ll make my own game studio and sponsor you to help. At least I hope I’ll do that ;)

[@thepolygonpilgrimage]

Thanks very much!

[@Grimsikk]

Ooh, this will be perfect for the Freestyle mode on an arena shooter I'm making. I wanted to have a music player console that players in a server could use to add songs, etc. This will be perfect for that. Thank you for this.

[@thepolygonpilgrimage]

Glad that it is helpful! Link me your project when its done so I can check it out!

[@Novalis1504]

Hey man, just stumbled on your video here and I'm amazed!!! I searched for some tuts about cool looking or complex UMG, and this is definately one of the best tutorials about this i have found so far. Many people just upload videos about how to show a default button or animate it quite simple, but i always wanted to know how to approach some more complex and better looking UMG designs :) Subscribed!

[@thepolygonpilgrimage]

Killuah3 Thanks very much! Let me know if there is anything specific you are looking for and I'll figure it out

[@thehambone1454]

I’ve been looking for a tutorial for this. Thank god.

[@thepolygonpilgrimage]

Glad it helped!

[@nitinraikwar3402]

You are a gem of a person. Helped me a lot. Thanks

[@thepolygonpilgrimage]

Thanks very much for the kind words! :) Appreciate it very much

[@bluethumbbuttoneek9465]

Just randomly found this and guna love following this subscribed this is interesting at high peak levels

[@bluethumbbuttoneek9465]

This

[@thepolygonpilgrimage]

Glad you enjoyed!

[@UCCi6g4buFK8dVtAxbFYEKzA]

The cursor by default isn't centered in the FPS template. Look at the FirstPersonHUD and substract half the size (of the cursor =8) from its position (also delete the Y-20 shit). It has to be: SizeX % 2 - 8 -> FloatToInt -> ScreenX. Same for Y.

[@TheGamer1402]

Ingenious, thank you!

[@jahongirerkinov8655]

I like this tutorial, and thank you very much

[@thepolygonpilgrimage]

Glad it was helpful!

[@wmorrisgccc]

Matt, still after two years, this is by far one of the best interactive project tutorials out there. I wanted to know how easy would it be to set up for VR using the Quest. Would a pointer need to be included to activate the interaction? Also how easy would it be to incorporate like a slide show of images instead of text?

[@thepolygonpilgrimage]

I'm very glad you like it! Unfortunatly I'm not sure how to set this up for VR as I have moved away from Unreal. I wish you luck with your project though! Thanks for the very nice comment :)

[@mistert2962]

Is it possible to get the images of 6:36 from you? Is there a website where I could buy them?

[@thepolygonpilgrimage]

Sorry I'm not sure that I have those anymore. If there are not in a zip linked in the description they might be gone. Remnants of my old computer.

[@TheBlackleoner]

Thank you for sharing, waiting for more in the near future.

[@dannykay4649]

It’s like the computers/terminals in prey

[@max72590]

Nice video, very well explained and easy to follow, but one thing i recommend to do in future tutorials is to make more use of arrays and functions, that way you can simplify the blueprint and make it more legible (less scary for newcomers) by iterating through the array and doing the operations you need to instead of making large amounts of copies of the same nodes.

[@thepolygonpilgrimage]

Thanks Max! Indeed, I am also still pretty new to blueprints so right now I am learning how to do functions and about structs. Next, and future blueprints will be more compact and cleaner. Thanks for the suggestions and the comment! Cheers :)

[@romainst8499]

Why don't you make an simplified one :) ?

[@marisamorena8452]

great tutorial I hear someone snoring in the background 19:56 or maybe Darth Vader met you :)

[@thepolygonpilgrimage]

Marisa Morena That was my dog Jo who unfortunately passed away a few weeks ago

[@marisamorena8452]

Sorry to hear that

[@ika677]

I am so glad to found this video tutorial, how frustated I am to make interactive screen

[@thepolygonpilgrimage]

Glad this has helped you! :)

[@WildChildStudios]

how can i play level sequencer animation when i click on any button on screen?

[@pHaace]

is this or can you make an update that makes this replicated so it shows in multiplayer games? even if its not gonna keep watching and use it to learn more about UE4 for sure. found a few great tutorials from you.

[@siennaalyssa6225]

@26:14 don't you suppose to hook up the node with something?

[@thepolygonpilgrimage]

Sienna Alyssa I'm not sure what you mean. Can you be more specific?

[@jamiinesbitt4680]

Loved this

[@thepolygonpilgrimage]

Jamii Briggs Thanks very much!

[@isaackershnerART]

Hey, what if I want to have a button cause an object to perform an animation in the game. I cant figure this out!

[@thepolygonpilgrimage]

www.google.com/search?q=ue4+how+to+make+a+button+play+an+animation&rlz=1C1GGRV_enUS754US754&oq=ue4+how+to+make+a+button+play+an+animation&aqs=chrome..69i57.7959j0j7&sourceid=chrome&ie=UTF-8

[@tombittikoffer412]

Hi Matt! You have gotten me closer than anyone. However, What I'm wanting to do is my Blueprint for an art pieces (It's a gallery) has an interaction where I walk up to it and player overlaps a trigger box, the UI opens up and plays it's opening animation. It would look even nicer to have the animation reverse when we leave the trigger box. I can make it pop on through a "make visible" node and it goes away when I walk away but somehow can't get it to play an animation when that happens. It's not allowing me to source an animation to play inside of the widget class when the trigger box is tripped. (From the BP of the art piece) That would be awesome. Otherwise, this is awesome. I can have my users click on a menu item and get more info on the art piece. Thoughts?

[@thepolygonpilgrimage]

Thanks very much Tom, I appreciate that you have enjoyed this very much. Unfortunately I left UE4 behind some time ago and have fallen out of practice. I wish you good luck with your piect as it sounds really cool. :)

[@wolfboos]

I love you, Thanks

[@clebo99]

Any reason why the animation doesn't start when the HUD comes up? I'm trying to do a simple rotating gear like on the bottom right and I'm setting the keyframes. When I run the keyframe in the game it doesn't rotate. When I try and run it in the HUD as a test it works.

[@thepolygonpilgrimage]

I'm not really sure sorry it's been a long time since I've done UE stuff. You may need to look into keeping the animation "live" and sort of always playing. Best of luck!

[@clebo99]

@@thepolygonpilgrimage Actually, I figured it out. And sorry that the other reply was from another question.

[@bggangel]

So you say in the video that you are setting the top of the back button in code but I do not see that anywhere. Can you explain how you did that?

[@thepolygonpilgrimage]

Gerben Gangel Can you pinpoint for me where in the video you are having issues? I'm happy to help but it's been a while since I did this tutorial. I will open it up and take a look as well. Thanks!

[@ourlifeisjustagame]

This is a great tutorial! I have a question though, when I set input mode to game and UI, why do I need to hold the Left/Right Mouse button to move the camera? probably something silly I missed. When I set the BP to game mode only, I can control as normal, and still use the UI. So I was curious and placed only the BP in the world, no graph on it, and was still allowed interaction. Setting it to game mode and UI only may not be needed?

[@thehambone1454]

Question, what if you wanted to do seething more complex like a screen to play a mini game? You wouldn’t use something designed for menus I wouldn’t tthink. Any ideas ?

[@techlife2168]

keep it up man . it looks so good

[@thepolygonpilgrimage]

TechLife Thanks! Much appreciated. :)

[@doctormanhatten3973]

Чувак,спасибо!Теперь я смогу создать свою собственную игру похожую на Дум!=)

[@thepolygonpilgrimage]

I am glad that this helped you! Good luck with your project. :)

[@amadushaw6488]

So this same concept can be used in let creating those holoscreens advertisement billboards u normally see cyberpunk sci fi genres?

[@thepolygonpilgrimage]

Probably yes and they are intractable with the mouse

[@amadushaw6488]

@@thepolygonpilgrimage That is awesome and I see those stuff a lot in overwatch too and always wonder how they got that animated screens on their buildings. Good stuff

[@friendlysealstudio4447]

this is wonderful i didn't expect it to be so easy to setup but is theres a way to lock character looking around and still be able to click the widget?

[@archiblage]

Amazing tutorial, I wanted to ask, is there a way to create an interactive showcase for a product with some events ? Like when selecting the product it explodes and return it to its normal status with another click ?

[@thepolygonpilgrimage]

Not sure. I'm sure there is a way but I have not done UE stuff in a long time. Best of luck though!

[@isaackershnerART]

what if you want a button in this to then dispatch an event to another blueprint like to trigger a door? I cant find anything on how to get a 3d widget to trigger a door, only found stuff on how to dispatch and then create a? widget from widget and put it through the viewport. How do I make a 3d widget button open a door!? Ive been looking everywhere.

[@thepolygonpilgrimage]

You need to look up blueprint communication

[@lumbabumbaschumba4975]

Look for Blueprint communication and specially blueprint communication via interfaces. its really ez.

[@clebo99]

Ok.....and I promise this is the last question. I want to export an image with the "checkerboard" background so it is "invisible/clear" but every time I do it I see the white behind it. How do you export so the background is "invisible" and all I see is the shapes? Does this make sense what I'm asking?

[@clebo99]

LOL...I figured this out as well. I had to add the alpha channel and then use the color picker and "Clear" the background (doing this in GIMP). Worked like a charm.

[@thepolygonpilgrimage]

Glad you got it working!

[@sylvanaswindrunner1141]

Nice Tutorial! But I have a question, what is the X Y coordinate in Set Position in the Widget Blue Print? Are they stand for the original coordinates of all those buttons?

[@sondreulvik9585]

Help it dose not work for me nothing happens when i click on the buttons on the wiget no matter WHAT i do?

[@thepolygonpilgrimage]

It's been quite some time since I've do e UE4 stuff but, did you follow all the steps exactly, and it matches what I've shown in the video?

[@consistentlyinconsistent1]

I can't get my text box widgets to show up in the graph so I can't plug them into the function for set text box

[@thepolygonpilgrimage]

Sorry its been a long time since I've done any UE stuff. Are you getting an error?

[@consistentlyinconsistent1]

@@thepolygonpilgrimage yeah the Text box set text box needs to have a text component to change but the text I create in designer is not showing up in the graph at the left menu with the animations, buttons etc

[@consistentlyinconsistent1]

@@thepolygonpilgrimage all good bro think I found the issue great vid really shows how detailed the ue4 system is.

[@thepolygonpilgrimage]

@@consistentlyinconsistent1 Glad that you got it sorted!

[@consistentlyinconsistent1]

@@thepolygonpilgrimage hey man sorry to bother you but I have an issue when I actually play the game the Widget does not appear with my static meshes in the blueprint, It works just playing it in simulate play but not standalone game. would you have any advice to get it displaying?

[@tronnegamesindustries376]

There's no way you could provide a download link for this project right ? i would really love to dissect this , i was kinda looking for something like this for my own project , i was looking to make datapads / keypads just like Doom 3. i've did several attempt but they dont work as i expect them too , your system is much more functional.

[@thepolygonpilgrimage]

Lore Magna I'll look into it. Might be able to just zip the whole thing and provide it for download

[@tronnegamesindustries376]

i would love it man !

[@thepolygonpilgrimage]

Lore Magna Since there has been a lot of interest I will set up my old computer this weekend and dig this project out. Will post here when it's done with the link

[@tronnegamesindustries376]

cant wait for it !

[@tronnegamesindustries376]

lemme know when you have some updates Matt , this is probably the most important piece of the puzzle i am missing :D

[@spazman6117]

How did you make the widget sit on the stand like that? EDIT: Just read someone else asking you this same question and I got my answer thank you but I also have another question. Is there a way to make the widget attach to another object so that when the original object moves, the widget moves with the object?

[@thepolygonpilgrimage]

Staple_ If you make the entire widget a child of the root actor it will follow.

[@thepolygonpilgrimage]

See above

[@romainst8499]

Nice tutorial ! Can we use it with VR controller ? product viewer

[@thepolygonpilgrimage]

Not sure what that is. I'd recommend looking into the documentation for it. Best of luck! Thanks!

[@2010Edgars]

I see no material who have widget. How did you make them?

[@cfilo88]

It looks like you have rendered the UMG in a material. Is it true? How did you apply the UMG on the static mesh? Thank you

[@thepolygonpilgrimage]

It is not a part of the mesh, it is floating just in front of it. Thanks!

[@cfilo88]

Thanks for the answer. Do you know a way to render a UMG widget in a material?

[@thepolygonpilgrimage]

Not currently no.

[@lkfish4201]

Where am I able to download the assets and blueprints ? Thanks.

[@thepolygonpilgrimage]

許桓語 I did not provide the assets for this yet but I will work on doing so. I am planning on cleaning this up as far as blueprints go so in the future that will be cleaner too

[@NeoRender]

can you make it in unity engine?

[@thepolygonpilgrimage]

Totally! Unity has some really great UI tools. I'm sure this would be possible in Unity.

[@РоманЗыканов]

Hi, Matt! I'm quite a beginner in UE4. Could you upload a project file for me to consider it in detail?

[@thepolygonpilgrimage]

I'm sorry I dont have these files anymore. :(

[@codezet21]

Thank you for sharing!! It is possible to download the project? Anyway thank you for the great job!

[@dreamuser8519]

Man nice

[@thepolygonpilgrimage]

Thanks!

[@MetricZero]

Hey there. Thank you very much for this tutorial. I've been wanting to make a sort of interactive wikipedia inside UE4 and I think this might get me started. One question though. How do you get the reference to the animation to Play Animation? No assets seem to exist in the drop down menu from "In Animation" despite having created said animations.

[@thepolygonpilgrimage]

Send me a PM and we can work together on this to get it solved for you. First thought is make sure you both save and compile before adding in the play animation. This way the latest list of animations should be available. Send me a PM and we will get it worked out! :) Cheers

[@MIKEatFULLSAIL]

Thanks for the tutorial. I am having a lot of difficulties with UMG. First and foremost is how it is displayed in the world. I would be interested in learning how you actually applied the UI to the table in this video.

[@thepolygonpilgrimage]

Thanks! The UMG is a blueprint (in the sense that it is a 3d widget in the world already) The table is made to fit it so that all I had to do was put it in the world and rotate it to fit on the table. I hope this helps!

[@MIKEatFULLSAIL]

Matt Parkin that is what I figured. The issue I commonly run into is when I create an actor with a UI widget to bring into the world it looks extremely washed out, text is hard to read, and it is very bright despite turning off all reference to lighting.

[@thepolygonpilgrimage]

This may be due to your material. Check that to make sure that nothing odd is going on there. Another possibility is the lighting in your scene. If you get stuck send me some pics of everything you have and ill have a look

[@DimitriosDenton]

Can you put a link in the description with the other videos you reference, like the one on how to create the spinning thingy?

[@thepolygonpilgrimage]

Dimitrios Corvinos For the spinning I just goggle UMG animation. Epic themselves have quite a few tutorials for it. I'm on business travel right now but I'll try to find it when I get a moment if you don't find it in the meantime. Hope this helps!

[@Dixonchannel]

Best!

[@thepolygonpilgrimage]

Thanks very much!

[@AlenobaLP]

You seem to know a bit more on how to fire animations than I do... so can you help me with something? I want to have an Actor with a Widget component play an animation in that specific widget. How can I do it without having play in all versions of that blueprint? In my specific case I want an "Interact" Widget to show up with a cool animation whenever the player looks at things he can interact with. Sadly, I only seem to get it to work on all widgets at the same time so everything will say "Interact" :( Do you know a way?

[@thepolygonpilgrimage]

Alenoba I think I understand what you are looking for. send me a direct message with your contact email and we can chat more about it. I'll do my best to build a sample and send it to you

[@mahnomix]

Do you happen to have a project file?

[@thepolygonpilgrimage]

No sorry, that was quite a while ago.

[@HellBringerdark]

Hello. I have a problem setting up the widget. I did everything as you did and I can't press the buttons, I can hover them but no click or press. Btw I am using 4.15 if that matters.

[@HellBringerdark]

My bad. I had a problem in the character BP put the press pointer key for the released also. sorry for the first comment and good job. I like the style very much.

[@wilismatrix9847]

Thank you for the tutorial, I was looking for this for my graduation project. but the quality of the video is very compressed and not clear for 1080p

[@thepolygonpilgrimage]

That's strange, no one else has had an issue. Maybe your internet service isnt able to load the highest quality.

[@OseniWeter]

Nice

[@OddSauce]

am I the only one who hears a constant ominous breathing sound in the video?

[@thepolygonpilgrimage]

That was my dog Jo who slept at my feet while I work. He passed away in March of this year.

[@OddSauce]

@@thepolygonpilgrimage oh... well I'm sorry for bringing up a sensitive subject then

[@thepolygonpilgrimage]

@@OddSauce No worries. Life happens.

[@RobCardIV]

i could be wrong. but probably not. jon carmack was the first to achieve this effect in a runtime video game.

[@thepolygonpilgrimage]

Ok. I'm not sure what point you are trying to make here. Can you clarify?

[@samson2342]

A request is in the future to remove the Polygon pilgrimage from where it is and place it some where else or have it fade in and out cause its hiding stuff. Maybe scale it down. Thanks for a good tut. :)

[@thepolygonpilgrimage]

sam son I understand your concern. I don't use the logo on the video at all anymore. Even when it was there I was careful to make sure it didn't cover anything important and if it did cover anything I made sure to mention what was needed. You shouldn't have this issue with the newest videos. Thanks!

[@keyserswift5077]

too bad you can't incorporate this into a desktop environment.

[@thepolygonpilgrimage]

How do you mean?

[@RobCardIV]

why make a portfolio?? just make your own gd game : )

[@thepolygonpilgrimage]

Whats wrong with making a portfolio? It is possible to make both you know.