My first attempt at Pixel art 0.0

[_JJ]

This thread goes on some, so I thought I’d add a TL;DR to the top for any that may find it in the future
Basically 10 days ago I started learning to make some pixel art in the style of the old 8 bit NES (with a memory upgrade) for the breakout project. I didn’t know much, and I still only know a little, but I managed to get there eventually by doing it over and over and getting really awesome feedback from @Rob!!

This is what I started with:

and this is where I got to:

I hope it’s helpful or encouraging to anyone who stumbles on it struggling through pixel art - just stick with it, it does start to make sense in the end!

---

Original Thread:

Hi all, I’m just starting out and am on the Arkanoid section. As you will see below I have precious little artistic ability, but I thought I’d try and make my game NES inspired. This will be my “warehouse” level background in my breakout game. I did follow most of the rules of the NES (8x8 px tiles (scaled up 9x), 256:240 aspect ratio, NES 56 colour palette) but I did ignore the bank switching element to colour selection to give me a fighting chance lol! I did worry that my playable width will be too narrow with a 4 unit border, but went with it this time, maybe later levels I can make the game area wider? That’ll be a challenge lol

Thanks for any feedback - but please remember I’m clearly not an artist

JJ

[Rob]

Looking good, has that nostalgic feel too it

[_JJ]

Thanks Rob

[CelloGuy]

that looks great, keep it up

[restlessdan]

I like it, keep going the more you do 2d sprite editing the better you will become.

[Joao_Dalvi]

Hey, it’s looking nice! It has a good feeling about it =)
keep up the good work

[_JJ]

Thanks all! I think I am a little happier with it coming back to it this morning. Last night after three hours of trying to work out how to use GIMP, and struggling through I was thinking it’s “good enough for now”. I did notice that of the 16 tiles that make up the crates, the right most column has a 1 px margin error that I had to fix, but yes soldier on!

Thank you so much for the support. The code I can get a handle on… design phew that’s a toughie!

[_JJ]

Cool, so I think I made some progress, fixed the width issue, made some block, ball and paddle sprites and added as layers to get a mock up (This isn’t in unity yet, still gimp)

Do you think the scale is right with the blocks? I was trying to stick to the NES sprite size rules, but I’m not sure… maybe I need to shrink the ball?

[restlessdan]

yeah I see what you are saying the ball and paddle look out of proportion to the blocks an idea I would go with is to make one block the width of two because the ball and paddle look to be scaled the same, but that’s my opinion.

[Rob]

This is looking very cool.

I can see where you are coming from with regards to the scale etc, that said I think this is one of those games where you can actually get away with a few things. As the image looks at the moment I would suggest (again it’s only an opinion) that the ball is a bit big in comparison to the blocks, but ok compared to the bat.

Of course, how do I know that this isn’t a “power ball” That’s what I was getting at above, you can have an extended bat, shortened bat, regular bat, normal ball, power ball, multi-ball and so on…

For a regular ball with those blocks I reckon you’d be looking to almost have the size of the current ball, bat size I would suggest is perhaps still about right. Difficulty levels could also inspire changes to this. Bigger blocks should be easier to hit shouldn’t they, so unless they are going to have multiple strengths and require multiple hits or perhaps the ball is going to start speeding up after a set amount of time, the game may be too easy if its all too big, you would also have less blocks if they were bigger, so again that plays into difficulty perhaps for the player.

The more I look at what you have the more I like it, there is a lot of dark border around both the grey background tiles and the blocks, that adds to the effect of them seeming smaller I think.

Looking forward to playing it though

Opinion/thoughts only… you may need to do a couple of get a feel for it.

[_JJ]

Thanks Rob and RestlessDan - just the feedback I need!

Sorry for the delay- I’m on Aussie time

I definitely think you’re right, I’m gonna try shrinking the ball, increasing the block size a bit… I also think I’ll halve the crates on each side of the screen and offset the tiles a bit - the tiles are looking a bit too uniform with the blocks now I’m paying attention lol, And I suspect the scale of the crates is adding to the tiny-ness of the blocks!

Right hop to… on the plus side, it is starting to get a bit easier … well… make a bit more sense lol!

Thanks again so much for your time and input guys

[_JJ]

Thanks heaps for your help everyone!

I feel like it’s getting somewhere now. I added a scoreboard area, (took about 2 hours to make an alphabet lol!) shrunk the margins, offset the tile pattern in the sprite to narrow the border, player around with the block sprites to make them seem a bit bigger too. Oh and I shrunk the ball. I wasn’t sure how visable the ball would be if it wasn’t pure white, but once I started moving the ball around, it seems good enough as a moving object. My scoreboard information is modelled off of the original Arkanoid for NES, though I wanted it at the top lol.

I’ll see how I feel about it tomorrow, but I think it’s time to start making this work in Unity

[Rob]

It looking really good @_JJ - having made the “gaps” between the background tiles and the blocks small I think that really works. Regarding the ball, look like the right size, but I can see that it is a bit harder to see it on the background, and before I read your comment about the ball I was wondering about the contrast between the blocks and that background. Ironically, since losing some of the darker lines between them I think that has skewed the contrast slightly. I wonder whether maybe just making the background tiles less bright might be a simple fix? I think the blocks and the ball would then stand out/contrast a little better and you wouldn’t need to change the sizes which, personally, I think look good.

Thoughts/suggestions only…

Oh, and not sure what a likely score might be, but are you going to have room up there if I get a big score

[_JJ]

Thanks Rob!

Ah, contrast! that’s what it was lol. I was looking at it trying to work out why my bricks had become fluorescent, but not understanding why!I redid my floor tile with darker shades (bit fiddle with 54 colours lol) and was pleasently surprised, thank you so much for the suggestion. Also darkening the tiles has allowed me to use a black border on my blocks, which I like… and you can see the ball at last lol!

Good spot on the Hi-Score position - I placed it before adding a border tile to the last 8px. I did want the Hi-Score area to allow for a 999,999 max Hi Score, but I do want to keep the scoring low like in the old days (when memory was limited) like 1st colour 1pt, 2nd 2pt, 3rd 5pt, 4th 10pt, etc which is 496 pts for this layout plus bonuses. Hopefully my breakout is realistic enough that someone doesn’t make it through 100 levels on 3 lives but I can always move it over again easily once I’ve got some real world testing.

Thanks heaps for your feedback and time (again!) it’s really helped

[Rob]

You’re very welcome and that is looking excellent! So, when can I play it?

[_JJ]

Haha I’ll share my game when it’s done I promise

I decided while this pixel art thing is starting to make sense, I’d get my graphics done before continuing with the programming, so I’m not tinkering back and forth between graphics and code to work it out. I’ve realised that whilst I arbitrarily chose a NES, it’s actually a really good restriction set to get started at pixel art with - small tiles, limited colours, etc. It’s given me something to focus on and it’s nice and logical! No free hand drawing (This would be stickman breakout if that were the case!).

It took me a few hours to work out pipe borders to a second level “The basement” but I’m quite happy with it now… I’ve still got to do the main background and another couple of levels but I’m slowly getting there

(below is a mock-up using the new border wit the level 1 assets)

Hopefully only a couple of weeks until I can share my game!

Thanks again for all your help Rob!

[Rob]

That’s a great idea and I’m sure is a really useful tool with regards to focus… good plan…

Liking the pipes a lot… lovely addition… are you planning on changing the floor tiles/background on each level too, I noticed that the background here worked really well with the boxes, but is very similar in colour to the pips, might be good to have again something that contrasts a little more so that the edges stand out and so on… looking really good though

[_JJ]

Thanks Rob, yeah, initially I’m thinking different background and border for each “zone” (Also maybe change the colour around the scoreboard). I’m thinking of having maybe 2-3 levels in a zone to stretch out the use of my graphics lol! This basement background I’m thinking bricks and moss, but I’ll see how it looks when I start making some tiles

[Rob]

Sounds like a fantastic approach and will lead to a real sense of consistency and progress I think. I have to say this really feels like a well thought out developer @_JJ, well done - can’t wait to see more so please keep us all updated on your progress

[_JJ]

Phew progress took a bit of a hit the last few days, too much on in real life lol. I did manage to get my background done to the second zone. I’m now thinking that I’ll just make one more final zone as having the time to keep spending on graphics is going to get a bit tricky and I still have 75% of the course to go lol!

Bricks obviously weren’t that tricky (Aside from keeping track of 8x24 columns all over the place lol) but they looked a bit plain when done, so I added a couple of mossy touches instead of mossy bricks

The scoreboard colour isn’t set, just experimenting, and I’ll be changing the arrangement of the blocks the player has to hit in different levels, add a couple of indestructible blocks and prize blocks, etc.

---