[Starlight] Super Beautiful Combat Graphics (Patreon)

so firstly: literally everything here is a place-holder...
except the single fancy Input Marker graphic which isn't a placeholder but is still incomplete.
so i guess that isn't literally everything after all. shoot.

Anyway, this is how I frame a system-- as crudely as possible. Once things work, I can go pretty it up. Here's what you're looking at:

the dark blue areas are the Combat Track. This is what I've focused on as far as coding because it was the most precarious part.
The moving sections are hit blocks. Tap a button when they move under the Input Marker and you do the attack. If you tap on a different section you miss, and could be counter attacked.
The width and number of these hit blocks will vary, being generated based on the enemy you're facing and your own stats. There will also be critical hit zones, and potentially other kinds of zones too.
The track is mirrored on the top and bottom to give the player a better chance of being able to see it when looking at the center of the screen where the action is. I imagine in tense battles they might tunnel vision on the Input Marker, which is fine-- focus, win-- but in general I want them to be able to look at the pretty animations and keep an eye on the track with a concept I know from theatre as Soft Focus-- paying attention to something without looking right at it.

the green area will be where I keep the health bars. In-battle messages should take up the bottom track and health bar area, leaving the rest of the scene in tact.

Orange and maroon are the battle background-- two colors to mark where the horizon would be. Subject to change. Well, everything here is subject to change, and likely to.

The four cyan boxes were just placeholders for the Input Marker. It doesn't appear here but there are two designs of Markers-- one for when the party is in Heaven, and one for in Hell. This is the Hell one. The entire UI will change based on the location. There are cyan boxes on the left because the track reverses for defending and attacking from other directions. I've already made it able to reverse.

The pink columns are nothing-- they'll just be a border between the background and the UI. I'll need to add a border near the tracks too though. In time. It'll look prettier as we go.

The indigo sections will be the battler names. Yellow, character portraits. The character portrait section will expand across the screen horizontally for cut-ins when abilities activate. The tan section below is for combat info-- damage per hit, element, attack style, attributes, etc. 

If you've played GBA Fire Emblems, the layout is pretty similar to their combat screens... being based off of it and all. There's just the addition of the tracks, and character portraits. 

The alert box that keeps popping up is me hitting the input button to attack. "lightning bolt!" is just my cutesy placeholder 'button was hit' message. the number that displays after it is the game detecting which block of the track the button was pressed during in. having that number, it will be super easy to determine if it was a miss, hit, crit, etc. 

but that's where we're at with this. combat system's hardest part is done.
battle system... still an arm wrestle.
z-axes are apparently a social construct.