Beginner's Sprite Tutorial

The place for codemasters or beginners to talk about programming any language for the Spectrum.
User avatar
RMartins
Manic Miner
Posts: 328
Joined: Thu Nov 16, 2017 3:26 pm

Re: Beginner's Sprite Tutorial

Post by RMartins » Fri Dec 29, 2017 4:58 am

I'm assuming you want an 8px char.
Does it need to be 16px width ?

I have 2 simple ones, with 16px character, in 24px width.
Image
and
Image

Interested ?
0 x

User avatar
R-Tape
Site Admin
Posts: 1431
Joined: Thu Nov 09, 2017 11:46 am

Re: Beginner's Sprite Tutorial

Post by R-Tape » Fri Dec 29, 2017 10:21 am

They look a bit too good for purposes here! They are 2 sexy looking sprites.

Could you post the frames here and perhaps I can modify the blob?
0 x

redballoon
Dizzy
Posts: 66
Joined: Sun Nov 12, 2017 3:54 pm

Re: Beginner's Sprite Tutorial

Post by redballoon » Fri Dec 29, 2017 10:41 am

Yeah is it possible to see the frames for the 2nd one?
The 1st looks sound but the right leg in the 2nd one looks a bit weird at times. It could just be trying to view a small image in my phone, though.
0 x

User avatar
Rorthron
Manic Miner
Posts: 552
Joined: Sun Nov 12, 2017 10:35 pm

Re: Beginner's Sprite Tutorial

Post by Rorthron » Fri Dec 29, 2017 11:12 am

R-Tape wrote:
Fri Dec 29, 2017 4:44 am
I agree the walk looks weird.
I think it is because of the first (standing) frame and the frame after it.

In the standing frame the two legs do not fully overlap, and in the following frame the two feet are drawn differently, so that the forward foot is the left one. It creates the impression that only the left leg makes forwards steps. If both feet overlapped in the middle frame, so they looked like only one foot, and the stepping frames made the left and right feet look the same, the steps would look a little better (though it would then be inconsistent with the perspective on the face).
RMartins wrote:
Fri Dec 29, 2017 4:58 am
I'm assuming you want an 8px char.
Does it need to be 16px width ?

I have 2 simple ones, with 16px character, in 24px width.
Image
and
Image

Interested ?
Nice sprites!
0 x

User avatar
RMartins
Manic Miner
Posts: 328
Joined: Thu Nov 16, 2017 3:26 pm

Re: Beginner's Sprite Tutorial

Post by RMartins » Fri Dec 29, 2017 1:13 pm

Here are Zoom versions of them.

Image

And
Image

I also have the SevenUp Editor .SEV files somewhere in my drive, I'll have a look and post them when found.
R-Tape wrote:
Fri Dec 29, 2017 4:44 am
...
Or even better, could someone improve the animation of this blob? I like the idea of showing how a walking animation can be done simply.
I could try that, when I have a half an hour or so free. :)
redballoon wrote:
Fri Dec 29, 2017 10:41 am
...
The 1st looks sound but the right leg in the 2nd one looks a bit weird at times. It could just be trying to view a small image in my phone, though.
There is something there yes, but I believe there isn't much that can be done about it, without looking funny, or having to change the whole sprite.

The issue you see is related with a bunch of pixels that are together on the left leg, when it's up in front.
It comes out as a brighter spot due to that, and that's what makes it feel a bit odd.

But if we remove those pixels, it seems the leg never crossed over, or the right leg might seem too bulky.

Maybe there are better solutions, but it's not easy at this size, in my opinion.
but feel free to change or update them, they can always be improved.

Thank you for all the positive comments, for my first walk animation studies, done quite a few months ago. ;)
0 x

User avatar
RMartins
Manic Miner
Posts: 328
Joined: Thu Nov 16, 2017 3:26 pm

Re: Beginner's Sprite Tutorial

Post by RMartins » Fri Dec 29, 2017 1:32 pm

OK here are the SevenUp .SEV files.

WalkAnim-Study.sev

WalkAnim-Study3F.sev

You know the drill, after loading the files, just use cursor keys to animate the frames.

You can move the first anim sprites to be centered on a char boundary, since currently it's centered between 2 chars.

After taking a new look on the second anim, I'm sure it can be improved, by making the first stance after center position, to have a slighter larger gap between both legs.
You can also notice that both do not have arms yet.

Well, they were my first walk anims, what can I say, not perfect. :shock:

The one in my Avatar is a lot better, but also easier, with more pixels to shuffle :D
1 x

User avatar
Ast A. Moore
Manic Miner
Posts: 603
Joined: Mon Nov 13, 2017 3:16 pm

Re: Beginner's Sprite Tutorial

Post by Ast A. Moore » Fri Dec 29, 2017 2:34 pm

Code: Select all

	ld b,(hl)	;get table address spritegraphic0, spritegraphic1 etc in BC
	ld l,c
	ld h,b
H (and L, incidentally) can be loaded directly from (HL):

Code: Select all

	ld h,(hl)
	ld l,c
0 x
Every man should plant a tree, build a house, and write a ZX Spectrum game.

Author of A Yankee in Iraq, a 50 fps shoot-’em-up—the first game to utilize the floating bus on the +2A/+3,
and zasm Z80 Assembler syntax highlighter.

User avatar
Morkin
Manic Miner
Posts: 256
Joined: Mon Nov 13, 2017 8:50 am
Location: Bristol, UK

Re: Beginner's Sprite Tutorial

Post by Morkin » Fri Dec 29, 2017 2:59 pm

Nice thread this. Finally got round to having a decent look at this as I still haven't managed to write a decent pixel-based sprite routine.

In the Balachor games the sprite moved 4 pixels at a time, so I thought I may as well store X & Y co-ordinates as character co-ordinates 0-31, or 0-22. I did that mainly because I had previously been used to PRINT AT in BASIC.

I did a bit of experimentation with smoother movement, so it made sense for the Y-coordinate (vertical) to be a pixel co-ordinate of 0-192. But I still had the X-coordinate (horizontal) as 0-31, as I figured this was the only precision needed for horizontal screen addresses.

I didn't even consider storing the X co-ordinate as 0-255, and getting both the screen address and the sprite animation frame from that. I guess that's a more standard (and probably more sensible!) approach. I had the sprite animation frame as a separate variable.
0 x

User avatar
Ast A. Moore
Manic Miner
Posts: 603
Joined: Mon Nov 13, 2017 3:16 pm

Re: Beginner's Sprite Tutorial

Post by Ast A. Moore » Fri Dec 29, 2017 4:59 pm

Morkin wrote:
Fri Dec 29, 2017 2:59 pm
it made sense for the Y-coordinate (vertical) to be a pixel co-ordinate of 0-192. But I still had the X-coordinate (horizontal) as 0-31, as I figured this was the only precision needed for horizontal screen addresses.

I didn't even consider storing the X co-ordinate as 0-255, and getting both the screen address and the sprite animation frame from that. I guess that's a more standard (and probably more sensible!) approach.
Even that isn’t enough when you’re dealing with fractional coordinates and sprites moving smoothly beyond the edges of the screen. Some clever trickery is required for that.
0 x
Every man should plant a tree, build a house, and write a ZX Spectrum game.

Author of A Yankee in Iraq, a 50 fps shoot-’em-up—the first game to utilize the floating bus on the +2A/+3,
and zasm Z80 Assembler syntax highlighter.

User avatar
RMartins
Manic Miner
Posts: 328
Joined: Thu Nov 16, 2017 3:26 pm

Re: Beginner's Sprite Tutorial

Post by RMartins » Fri Dec 29, 2017 5:47 pm

Ok, I tried a couple of revisions ...

First I tried to add 2 steps instead of one, in 8 frames, which is doable, but since in this case we only want to advance 8 pixels, steps need to be small, which implies feet need to be small.

Image

But I did not like the outcome ... looks like "Miss Bob" in high heels :D

Hence I reverted back to a single step, which gave me a lot more control.
Image

Now I like this, but there is a catch.
If you repeat this, you will see that the back leg seems to drag, this is normal, because it's the animation of a single step, to a stop, so back leg has to slow down ... to a stop.

For 2 steps, we need the last 4 frames, to move the back leg a lot faster, since it's swinging to take the lead.
This is required, to make it look natural, i.e. we need to swap the last few frames to stop, or to keep walking.

I don't have more time now, to make the full walk version, 4 more frames.
The body movement, will be identical or similar, but the back leg, needs to speed up, and end half bent, to continue.

I hope it helps.

UPDATE:
Here is a longer repeating version, where it looks like he is limping, as I mentioned before.
Image
1 x

Post Reply