Health Bar Unity Tutorial in 7 Minutes | DevLog 5
Вставка
- Опубліковано 10 лют 2025
- Welcome to our Unity Health Bars tutorial, a comprehensive guide on how to create customizable health bars with an easing mechanic (Lerp) inspired by Dark Souls. In just 7 minutes, you'll learn how to create polished and professional-looking health bars that can add that extra bit of polish to your game. Whether you're a beginner or an advanced game developer, our step-by-step guide is easy to follow and perfect for anyone looking to add cool health bars to their Unity game. Our tutorial is packed with keywords like Unity tutorial, game development, health bars, easing mechanics, Dark Souls, and more to help you optimize your search results. In Dev Log #5, we'll explore the world of Unity game development and guide you through every step of the process, from start to finish. So grab a cup of coffee, sit back, and get ready to level up your Unity game development skills. Don't miss out on this essential tutorial!
Excited to announce that we are now Live on Steam!!! 😮
store.steampow...
You can now add the game to your Wishlist!!!
Patreon : / blackcitadelstudios
Unity Asset Store : assetstore.uni...
Discord : / discord
Thanks for the Support everyone!!! 🤗
#unity #unity3d #devlog #indiegame #Wisplight #healthbars
Excited to announce that we are now Live on Steam!!! 😮
store.steampowered.com/app/2392420/Wisplight/
You can now add the game to your Wishlist!!! Thanks for the Support everyone!!! 🤗
Nice Tutorial !
Thanks! 👍
Tutorial looks great! Also added the game to my wishlist. Congrats to another milestone reached 🎉🎉🎉
Thanks for the support! Wishlists really helps a lot with our development. ☺️🙏
*Thanking and Solving the Issue*
Thank you for this!
It's the kind of healthbar that's makes the player see the effect of each action, always loved to see it when playing myself, so interactive!
🛑How it went with me:
At first, It wasn't working for me, it was showing the yellow bar only, but when damaging, it wasn't decreasing until health reaches zero then the yellow decrease the whole bar slowly.
⚙️Now, it's working, because there are few steps wasn't shown in the video, here they are:
Make the *Ease HealthBar* and its children above *the child HealthBar*, and make sure to complete *the parent Healthbar' script* by adding the the child HealthBar to "Health Slider", and the EaseHealthBar to "Ease Heath Slider".
The reason is that in Unity's hierarchy, the order goes like this: the upper the gameObject is, the back it will be placed, so as the opposite.
It is easier when imagining that each gameObject in the Hierarchy has an invisible number, so the top gameObject is 0, the second gameObject is 1, the one that follows is 2, and so on... As a result, gameObject #1 is in front of #0, and #2 is in front of 0 and 1, etc.
Hope it's clear and helpful.✨
Glad that it worked out for you. 👍 Thanks for explaining the steps that are missed on the video. 👍
OMG I was trying to solve the same problem for like an hour. Thank you so much for sharing! Really Helped A Lot.
@blackcitadelstudios
Don't mention it, I want to thank you for how deep your work is, from searching for the health bar tutorial for my game, to being amazed of your work, the interactive details you care about are exactly what makes the gameplay experience unforgettable!
Your developing experience is the key for the door of the player experience!
As long as you enjoy making it, and remember that every challenge you face means a new thing you are about to learn and gain in your journey, then keep it up! 💪🏻🎮✨
@@정선무
I'm very pleased to help!
@@HayaForHigher thank bro... Yeah, slowly finishing the game one day at a time, learning new things one at a time... ☺️
Hi there! Thanks for sharing your project with us. Now it’s too late but tomorrow morning I’ll add your game to my wishlist. Keep going, ánimo!!!
Thanks a lot for the support! ☺️🙏 As a solo indie game developer, it helps a lot. 👍
You need to put the ease healthbar maximum value as maxhealth, then put it under your main heathbar in the hierarchy
👍
Added the game to my Wishlist. Thanks for hearing my request. 👍
Thanks for the support! ❤
3:39
I created my script and attached it properly to my object but when I manipulate my health the value doesn't follow it :( help! I even made sure to drag my healthBar object from the hierocracy into the healthbar field in the inspector and no luck :(
i think it has something to do with assigning your slider in the inspector of the gameobject where the script is attached.
if it's still not working, You can head on to discord, so that I can check your code and project.
discord.gg/mVS8c8u2uw
@@blackcitadelstudios yes it's still not working :( I've joined the server btw!
Post your issue on the Ask-Questions section. add all the details, like your script, and a screenshot of your inspector. ill do what i can to help. if not, we can do a screenshare to help assist you with the issue.
@ thanks!
If anyone is having issues with only the yellow displaying and not the bright red this is the order that you should place your Gameobjects:
Health Bar
------Background
------Ease Health Bar
------------Fill
------Health Bar
------------Fill
figured out the issue? feel free to join us on discord so that i can help you with some of the code if you need.
THANK YOU SO MUCH. jeez idk why i couldn't get that and why it's not shown in the video lol
Added to my wishlist 👌🏻
Thanks a lot! ☺️🙏
when I add a new image, its empty. Despite I'm switching color to black it just create an empty square and I can't fill it
make sure that it's a UI gameobject and it's inside a Canvass Gameobject. UI objects/images needs to have a canvas for it to show.
it is... I also tried with an raw image but it still the same. There is no stuff on the web about that issue :/@@blackcitadelstudios
ok i found why. Was in wrong folder. Sorry about that and thanks for help!!
@@Fragelii head to our discord and send some screenshots. there could be several reasons why it's not showing.
@@Fragelii alright! Glad it's solved. Good luck on your project. 👍
thanks bro added your game to wishlist looks sick
Thanks bro! ☺️👍
You've skipped some steps. What slider do I add to the Health Bar script that is on the Health Bar parent object, as well as the Health Bar script on the Ease Health Bar. After watching the video, these fields are empty and I get a null reference error. It's a great video but some steps were skipped.
Just add the health slider gameobject to the inspector of the health script. Yeah missed that part. Sorry bout that.
It's not a problem. Thank you!
Lemme know if you have more questions. 👍
Have you done a video about the melee combat?
Yes, one of my lastest videos. I Made a Souls Like Combat, But you're the Monster!
ua-cam.com/video/uNa6jb42oMc/v-deo.html
For some reason, my ease bar is always 10 hp above my actual health. Only the ease doesn’t register the first time i press space. Does anyone know why? i’ll provide a solution if i can figure it out on my own
@@isaacashton5772 check the if statements or or could be the line where lerp is.
Check if your sliders components have the Whole Numbers variable ticked. Bashed my head against my desk for 2 hours before I found that little checkbox :)
Nice tutorial 👌 wishlisted wisplight wooho
Thanks for the support! ☺️🙏
Hy healthbar is yellow and isn't using the healthbar slider at all. I don't understand why its doing this.
Head to our discord, lets check your code.
I did the same thing, but my red health bar is not visible, only the yellow one is decreasing, can you help me? what could be the problem
Maybe the red bar is behind the yellow. Or it could be that the gameobject is not a UI object
Same happened with me, but the solution is as the channel owner said, so to fix it:
Make the *Ease HealthBar* and its children above *the child HealthBar*, and make sure to complete *the parent Healthbar' script* by adding the the child HealthBar to "Health Slider", and the EaseHealthBar to "Ease Heath Slider".
The reason is that in Unity's hierarchy, the order goes like this: the upper the gameObject is, the back it will be placed, so as the opposite.
It is easier when imagining that each gameObject in the Hierarchy has an invisible number, so the top gameObject is 0, the second gameObject is 1, the one that follows is 2, and so on... As a result, gameObject #1 is in front of #0, and #2 is in front of 0 and 1, etc.
Hope it's clear and helpful.✨
@@HayaForHigher thanks for expounding the solution bro. 👍
@@blackcitadelstudios
Anytime!✨
Thanks for sharing your project. Your videos help me a lot.
And by the way, can you make a tutorial about HealthSystem?
What i did is i made a variable on my playerPrefs script. This is where i put the stats of my character, as for the enemies, i just placed that variable in my enemy controller. Then I just subtract the health for every time the hit or takeDamage() function is called.
I suggest you utilize chatGPT to teach you about specific features to make. It will give you steps on how to make them. Parts of my healthbar system came from chatGPTs assistance. Its a very good tool to help you with your functions.
the health isn't matching with the Sidebar value can you help me?
you need to assign the sliders in the inspector for it to change the values.
@@blackcitadelstudios thank you!
@@DeApple_king you're welcome
Solid tutorial, but how do you make it so enemies effect the health bar instead of the keyboard.
You make a dealDamage function that will affect the health when you hit an enemy. Or your healthbar get affected if you're hit by the enemy.
I just couldn't get it to work for some reason. I seem to have gotten confused at 5:13. It jump cuts to how it is supposed to work; but, I didn't see where or how we were supposed to re add the health script to the object.
What are the things that worked so far?
Nevermind, I figured it out. The cut from the video at the timestamp confused me I was able to get it solved after some troubleshooting. @@blackcitadelstudios
@@AriLetsPlays glad to hear that. 👍 Good luck on your project.
nice job brother I am really thanking you for your teach
no problem bro. glad I could help. 👍
Hey how do I add like a whole number with a percentage inside of the bar because I kinda want my game to have that
You can add it as a child of the fill gameobject. Then you modify the text according to the values of your HP on your script as it updates the healthbar.
This is a really good tutorial my friend! But like others have said, please don't skip or cut out the important parts for a tutorial video . Otherwise good explanation and good video showcasing
Thanks, ill keep that in mind next time if im gonna make another tutorial video. 👍
The slider doesn't connect to the Health. Only the Value changes it
You need to update the health variable using the value of the slider.
Thank you for the fast responde😁👍
No problem. ☺️👍
Hi dude! Awesome video! It's the only one I found that did what I needed!
I'm just trying to do one thing different, but I can't seem to get it to work, I don't want the healthbars to be afected by camera perspective, if an enemy is extremely far away I want it's health bar to be the same size as one close to the camera. I'm building a MOBA style game and there, the healthbars of all the players are always the same size, whether they are at the center or the corner of the screen.
I managed to make this work by having the healthbars exist in the general canvas and setting their positions by converting the players position with the WorldToScreenPoint method + an offset so they are higher than the player's model, but I don't like this approach since the healthbar's objects exist in the hierarchy separated from their respective players, and also I have to instantiate them there with a manager script that shouldn't really exist.
But the problems are beside the point, what I would need is to have the same thing you show on your video but without the perspective affecting how the healthbars look.
Thanks again for the video!
I think you are on the right track. I don't know how to do it without experimenting on how to do it, but i think you're almost there in solving this feature. Keep up the good work. 👍
@@blackcitadelstudios After investigating for a while I realized that LoL uses an orthographic camera, instead of a perspective one, so player models, terrain and hud elements such as healthbars aren't affected by perspective. Still if you wanted perspective for your game except for the healthbars, this could be achieved by using the method in my first comment, the classes and code could be cleaner, but the general idea is there.
@@TheTheokatz yeah, it can work that way as well. 👍 Good luck on your game dev project.
I'm sorry, but I followed your instructions to the letter, but the end result is not the same as yours? I don't see the yellow blood bar moving, can I show you an example?
Yeah, head on to discord. I'll check it.
Dude i can't understand when you create the game object with health bar and ease health bar, you remove the script only on the healt bar or also ease bar? And then attach on the main game object?
I suggest to post your issue on discord along with your script so that we can check it.
hi jin here
Hello co-lead... Welcome to my channel... ☺️🙏
I get null error when using the slider script in this video saying that slider object has never been initialized, do u know the fix?
You need to drag and drop the slider gameobject to your inspector where the slider variable is located.
@@blackcitadelstudiosYou mean the healthbar with the slider component? I already did that, the output works however my console has infinite null reference errors
@@pikachubolt2001 what does it say in the error?
@@blackcitadelstudios Nullreferenceerror Object instance not initialized and it point towards the if condition of the slider where it compares slider value to health if condition
Maybe it's your health variable that is not initialized. Or it's on a different line of code.
i followed every step down to the T and it doesnt work
Head to discord, message me, let me see your project.
Check the console, see where the errors are, maybe you did not assign gameobjects in the inspector
and what if i use a image with fill option?
If you're using an image to make a container for your healthbar, you can just overlay the image on top of the fill, or behind if it's for fill background.
There is a problem, the max value of a slider needs to be changed every time to the value of the enemy health cause it won't be shrinking properly if it's set to one. Script needs to be fixed.
FIX:
Set in void Start()
{
healthSlider.maxValue = health;
easeHealthSlider.maxValue = health;
}
Max value is the maximum health when the player's health is full. There nothing wrong with the script. Please check again. It's set at start and will only update the slider once.
@@blackcitadelstudios must have skipped that part.
@@patek2385 so far, the code worked for everyone. Lemme know if it's working on your end.
@@blackcitadelstudios when I put that at the start it's working
Alright! That's great. 👍
is the health bar suppose to dissapear when in the parent Health Bar
Check the position of both, also check for canvass renderer.
@@blackcitadelstudios thanks man i wasn`t expecting a response.
@@blackcitadelstudios sorry but a bit of the ease health bar(yellow) is left behind im not sure whats wrong?
@@Heavenly_Zzzz what do you mean by left behind? Make sure to assign the the gameobjects to the inspectorm
@@blackcitadelstudios they both retract when i press space but a bit of the yellow bar is ahead of the red bar
why the healthbar script cannot manipulate the slider
Maybe you forgot to assign it in the inspector.
good
👍
❤
❤️
the health slider doesn't work
It works. A lot of people made it work. It's tried and tested. Maybe you missed some parts?
Hello,
This might be the solution:
Make the *Ease HealthBar* and its children above *the child HealthBar*, and make sure to complete *the parent Healthbar' script* by adding the the child HealthBar to "Health Slider", and the EaseHealthBar to "Ease Heath Slider".
The reason is that in Unity's hierarchy, the order goes like this: the upper the gameObject is, the back it will be placed, so as the opposite.
It is easier when imagining that each gameObject in the Hierarchy has an invisible number, so the top gameObject is 0, the second gameObject is 1, the one that follows is 2, and so on... As a result, gameObject #1 is in front of #0, and #2 is in front of 0 and 1, etc.
Hope it's clear and helpful.✨
to much skipped steps....
which part are you confused about? ill do my best to help out.
your cuts are so confusing
Thanks for the feedback
but doesnt work
Which part? It does work on my end.
Hello,
This might be the solution:
Make the *Ease HealthBar* and its children ABOVE *the child HealthBar*, and make sure to complete *the parent Healthbar' script* by adding the the child HealthBar to "Health Slider", and the EaseHealthBar to "Ease Heath Slider".
The reason is that in Unity's hierarchy, the order goes like this: the upper the gameObject is, the back it will be placed, so as the opposite.
It is easier when imagining that each gameObject in the Hierarchy has an invisible number, so the top gameObject is 0, the second gameObject is 1, the one that follows is 2, and so on... As a result, gameObject #1 is in front of #0, and #2 is in front of 0 and 1, etc.
Hope it's clear and helpful.✨
too many goddamn words you could have just not put cut the video so many skipped steps fgudaijchawudigawyu
Thanks for the feedback
Very confusing video, dont make any video if you dont want to show whole process.
I agree. One of my first videos, Im no longer making tutorial videos now coz i suck making them. Or maybe I just assume that people instantly get what Im demonstrating, my bad 😅. Thanks for the feedback. 👍
@@blackcitadelstudios Definitely dont stop making these tutorials, I made my first health bar in unity ever cause of you. Just make sure to show the whole process next time. Great video though and thanks so much for the help, now im one step closer to making my dream game!
@@negative_9 thanks for the words of encouragement. 🙂 Glad to hear that I've been able to help you on your dream project.