Battle interface

Processing Project Guidance
1

how do you make a battle interface like pokemon?
image

or perhaps more like this image

with battle interface i mean you see the two images(one of the enemy and one of the player that i made on pixelart.com), a health bar and different actions you can take

2

Hi @MoonAlien822,

If you are only asking about the interface in itself, you roughly need this:

  • Pixel art images (sprites in .png format for example) of the creatures / ground / background…

    See Images and Pixels, image() and loadImage()

  • Depending on how much you want to draw using Processing, you can use basic shapes and primitives to display the life point bars, texts, buttons…

    See: Typography and Shapes

  • Animations makes the game dynamic and not boring.

    See: Animations and interaction

  • For the programming side of things, you should use Object Oriented Programming with classes and objects because it suits well this kind of game.

    You also need to think about the mechanics of the game/ random variables and probabilities.

    See: Objects

Have fun! :yum:

3 Likes
3

thank you, this helped a lot. one more question, i also want to have health bar, how do i do this?

1 Like
4

What do you mean? Drawing it? Displaying the animation? Storing the data?

5

2021-09-14 22_41_24-Untitled - Paint
2021-09-14 22_41_24-Untitled - Paint747Ă—366 16 KB

the width of the second rect is dependant on a few things, so consider using map, to define the respective position compared to available health pool. Please find the processing reference for map, if you dont know what the function does.
And also may the use of constrain to keep the values from being too high or too low, again please look at the processing reference for the constrain reference.

Google map + processing
google constrain + processing

1 Like