• Do not use Discord to host any images you post, these links expire quickly! You can learn how to add images to your posts here.
  • Eevee Expo's webhost has been having technical issues since Nov. 20th and you might be unable to connect to our site. Staff are also facing issues connecting, so please send a DM to Cat on-site or through Discord directly for faster service!

UI custom battle UI

This thread's author wants feedback on a user interface. Be constructive.

srcwolf1

Novice
Member
Joined
Jan 30, 2024
Posts
38
Making a custom battle UI for my game this is some of it let me know what you think about? And trying to move buttons around still cant find how to looked every lol
 

Attachments

  • Screenshot 2024-02-12 034120.png
    Screenshot 2024-02-12 034120.png
    7.3 KB · Views: 79
Last edited:
Upvote 0

Muffyang

Novice
Member
Joined
Nov 17, 2023
Posts
26
It's very disconnected. Name/sex/level aren't aligned at all, the backing is very basic. Poison lacks a border like the other UI elements. HP text blends into the background, the health bar lacks definition. How does the raw HP number look at lower values, would it have empty space at the start before health pools hit that third digit? If the blue bar is EXP, I can't tell if that screenshot is full or empty. Why is the EXP bar longer than the health bar?
Overall looks rather amateurish.
 

srcwolf1

Novice
Member
Joined
Jan 30, 2024
Posts
38
It's very disconnected. Name/sex/level aren't aligned at all, the backing is very basic. Poison lacks a border like the other UI elements. HP text blends into the background, the health bar lacks definition. How does the raw HP number look at lower values, would it have empty space at the start before health pools hit that third digit? If the blue bar is EXP, I can't tell if that screenshot is full or empty. Why is the EXP bar longer than the health bar?
Overall looks rather amateurish.
its my first time doing it. i re-did it hour ago i set the xp full to see what would look like
 

Attachments

  • Screenshot 2024-02-12 085035.png
    Screenshot 2024-02-12 085035.png
    20.7 KB · Views: 39
  • Screenshot 2024-02-12 085555.png
    Screenshot 2024-02-12 085555.png
    7.1 KB · Views: 44
  • Screenshot 2024-02-12 090226.png
    Screenshot 2024-02-12 090226.png
    7.2 KB · Views: 40
Last edited:

wrigty12

Tester-Coder Hybrid
Member
Joined
Jul 24, 2022
Posts
550
Having HP be blue makes it seem closer to being attached to the EXP bar. I would choose a different color.

The biggest issue I have is the inconsistent pixel size being used. By default, Essentials UI has the images created where a "pixel" is actually 2x2 pixels. Half of your UI is using that default UI (like the text; the status icon also does). But your custom background stuff is using 1x1 pixels.
 

srcwolf1

Novice
Member
Joined
Jan 30, 2024
Posts
38
Having HP be blue makes it seem closer to being attached to the EXP bar. I would choose a different color.

The biggest issue I have is the inconsistent pixel size being used. By default, Essentials UI has the images created where a "pixel" is actually 2x2 pixels. Half of your UI is using that default UI (like the text; the status icon also does). But your custom background stuff is using 1x1 pixels.
make the background outline 2x2 pixels? still learning lol want to make something and not get something from online
 

starcrxw

Rookie
Member
Joined
Mar 29, 2019
Posts
1
2x2 is basically just a thicker outline, like wrigty said it's the default essentials uses so overall your ui would blend in better with the other ui and the trainers/pokemon sprites since they use 2x2 pixels too. it does make it chunkier and you can't make as precise of details but it would come together a lot better over using 1x1. if your editing program has a grid setting you could set the grid to 2x2 to help you out a bit, i think you have a neat concept though! i would agree maybe change the hp to a different color, maybe white or a lighter color and possibly give the status effects an outline so they're a little easier to see.
 

Attachments

  • Sprite-0001 - Aseprite v1.3.2 2_12_2024 9_37_41 AM.png
    Sprite-0001 - Aseprite v1.3.2 2_12_2024 9_37_41 AM.png
    54.6 KB · Views: 14
Back
Top