Pixelation

Update: now with pixel ink. Am I heading in the right direction ? When building the mockup, I've got the feeling that waves of the ink should be larger.

Just out of curiosity, is there something I'm missing about the sponges?  they seem kind of out of place in a book/ink-themed zone, and they don't really fit visually either; compared with your other elements, they look kind of rough and unfinished. 

First, thanks for your comments. The theme is "an old (197x?) school", where the sponge was hanging by a thread near the black board, with the water container just beneath. I see it as a "natural" odd-and-round-shaped sponge, compared to those synthetic-and-squarish sponges *I* have used during my childhood.
But yeah, I do agree that they're still very rough and need to be polished. Gameplay-wise, I've inserted them in that "ink pit" level because I believe it's interesting to have elements that can float for a limited amount of time, and sponges are just like that: once soaked, they sink.

The bindings on the books also look a bit unusual.  They're quite thick, and seem to extend over the pages.

Aha... Yeah, I think I see what you mean. I'll hunt for some references to see if I can come with something else. The "justification" would be the perspective: the book is not 90° with the eye, but rather 75° or so, so you see a small part of the binding and a large part of the pages. I'll try and see whether I manage to render that better.

I actually kinda like the look of the sea of ink as you have it now.  It's definitely worth experimenting with larger waves, but these do a pretty good job of conveying the look simply and effectively.

^_^

One thing that might be fun (or you might already be doing) would be to have bookends occasionally appear in the walls.  That could add a bit of texture and diversity as well.
Anyway, crits aside, I really do like the way this is going.

I hadn't thought about bookends yet for this vertical level ... I'll brainstorm about something interesting to come with.

The problem with those water tiles imo is that the peaks look like they slush forward then back again. instead try to make them move—one should fall into the next to create the illusion that each peak is sliding across the screen. that breaks the obvious tiling.

Also once that's nailed down, I think you could really make the animation a lot subtler—and a lot slower. maybe it shouldn't have those kind of wavey peaks at all. when I think about ink or oil vs water I imagine it being all goopy and sticky rather than pure liquid. even closer to a tar pit kind of thing.

as for the sponges, the 197X school setting is clever but the problem is that people just won't really get it. it doesn't fit in with the modern image of a classroom and people won't naturally think that way at all. can you replace them with more modern chalkboard brushes? i do think they could totally work as maybe a sub-boss or something but as a regular common enemy it makes people question.

The problem with those water tiles imo is that the peaks look like they slush forward then back again. instead try to make them move—one should fall into the next to create the illusion that each peak is sliding across the screen. that breaks the obvious tiling.

Note that I'm aiming at a stationary wave here, like the one you can produce in your bathtub. Not propagating waves like the one you'd see in a river or at sea.

->
Here's an improved version. Two more frames and (hopefully) slowed down speed ... but setting the speed with gimp is still much Trial/error :/ . I hope I managed to break the "teleporting peak" artefact.

Also once that's nailed down, I think you could really make the animation a lot subtler—and a lot slower. maybe it shouldn't have those kind of wavey peaks at all. when I think about ink or oil vs water I imagine it being all goopy and sticky rather than pure liquid. even closer to a tar pit kind of thing.

Thanks for the suggestion. I had no intend to have "oily" ink so far, but I'll investigate that.

can you replace them with more modern chalkboard brushes?

this is the kind of sponge I'm talking about. Chalkboard brushes would not make sense for the desired monster design. They're just too heavy. Plus, I've never seen any of them in a school here, only in Simpsons Cartoons.

Hehe cute attempt at the rayman style

Well, clearly, Ubisoft shoot our originality in the back 15 years ago with Picture City, but the school zone design even predates that. That being said, it's clear rayman on PSX *did* have an influence, although I'd credit Lewis Carol, Zool and Coolspot equally high for inspiration. I've indeed peeked a few colours on Rayman screenshots to see whether it'd be neat to have some hue shift in ink highlights, but that's basically all. I intentionally went for something much simpler that rayman's ink sea.

Now, if it's still close enough, okay, I'll lower my "this-is-a-ref" threshold and put a notice next time.

Mind to detail a bit more what you mean with "I think youre focusing way too much on using techniques right rather than the objects itself" ? What technique ? what am I doing wrong ? how would you proceed instead ?

The lines of the circles in the binders are really weird.

Do you have a limited palette?
I think it would work better if you re-used a least one color from the books in the background.
The colours aren't very harmonious right now.

Maybe try to make the waves in the ink more like hills than spikes, since it's more like the liquid is slowly moving than actual waves.

vs .

There are interesting things, indeed. I also doubled the exposition of the "spikest" frame, as I think there might lack some pendulum in my original ink swamp. Of course, a doubled frame with some details animation while keeping the same shape would work better.

My brain seems to do some resistance and tries to convince me that the spiky one is best because those spikes better transmit the idea that falling in the ink means sudden death.

Have you considered making this tile scroll ? It would show that these waves are caused by a wind.

(*sigh*)

This all happens within a giant school. There isn't supposed to be enough wind to cause waves. I try to make it look like a dangerous pool, not like a wild sea. I want the kind of waves that appear when something periodically disturb still "water", such as drops or bubbles. There's magic involved in the game, so I can easily decide that what makes the ink disturbed comes from lost balance in the magical field.

Plus, making it scroll is a matter of programming, not something I'd do at the pixel art level.

hope that makes what I need help with clearer.

Oh I didn't read your what you said about the sponge before making my edit. I went for a blocky/geometric shape which I now find pretty damn ugly. The character designs I made were just for fun anyway.

Anyway, I'm not sure of what use this could be for you, the statement really was to try and make things simpler.

I'll agree that this is overly simple: the shading, and the perspective aren't every interesting but I think as a whole it's more coherent than what you have showed. The fact that I'm using 10 colours helps I guess, but I'm pretty sure you could get the same result with more colours.

I really tried to make the lines clean, since some of yours are a bit messy.

Also, I used the darkest colour of the table and sponge as the lightest colour of the background. I think this makes everything more coherent while still having the foreground flash like you wanted.

Bear with me, this has to be like my 5th attempt at pixel art. (the wood texture lines weren't cleaned out because I'm lazy).

Je ne savais pas non plus que tu étais francophone avant de lire ton blog.

An attempt to make the colours more harmonized. Not quite satisfied yet ... Am I at least going in the right direction ?

Well, I'm still fighting with the colour harmonization and the (quick & dirty, but now hand-drawn) background. The 5-bit-per-color-channel of the nintendo DS distort the vibrant colours I managed to have on 13/10, so I'm trying an alternate approach, using colours of a former background that worked fairly well with the "woods zone" and using different hues.

Still, I'm not happy with the result. the whole scene is too grey, cold and sad for the overal spirit of the game. What it does well, is to provide the feeling of a more confined space. ABC, I tried several backgrounds inspired by your edit, but they were all "too open" and did not worked for the library level I have in mind.

Any help is welcome at this point. I really need some colour guru's vision to calibrate BG and FG together into something that works well.

This is a smaller palette, but no effort has been made by me to unify it, just cleaning it up and pushing brightness/contrast. Does it help?

That's the kind of fearless alternate I'm after, yes. Feel free to replace sprites with one-shade silouhetto if the overall colour count is already too high for other colour edits.

The biggest problem with your art is bad texturing, at this point, I'll return with specific edit and critique.

Ah. Well, that's not much of a surprise: it came out with quite much pain. I look forward for your advice.

-- (later) -->
I started from step 2 and tried to apply steps 3 and 4 with the geometry I try to achieve (rounded cover, with slight bumps at each edge, due to the seams -- see profile shape on the left). I may still have the second version try to fix some remaining errors with step 4. I also kept my original colour for the paper (I try to make the book look old, with yellow-ish paper), but if you switched to white-and-cyan for a purpose, I'd be curious to know.

As for step 5, I must admit that I don't get the process through which you picked those pink/cyan tints you have used ... But seen at 1x, you managed to have something much convincing for the shadow on the paper than what I ever got. If there's a rationale / tutorial about this, I'm curious as well.

meanwhile, I took a quite opposite approach to colour harmony by making a miniature of the scene and try to "zoom & refine" it progressively. So far, it brings this:
<-new test | for ref->

It's easier for me to experiment other tints ... although I still stay much more "conventional" compared to the color revamp you made.

edit: more book references

@helm: okay, thank you for your guidelines. I'll "polish" the book tonight and give the "wooden block" a revamp asap.

edit: polished -- except the "paper" part which still need a bit more love. I might also need to revise the left corner a little bit: it looks like it's not following the shape suggested by those rounded lines on the cover >_<

The first try of a real-sized wood block that uses the colours defined with the "minitature level" experiment. Hope the volume is correct.
See top post for a full-size level mock-up. Now, let's proceed with anti-aliasing, refine the texture details and avoid boring pattern repetition...

note: background here is not definitive. That's merely a colour test with a simplified pattern.
Btw, it's a mix of techniques found in zool, coolspot and SMB3, if that matters. I tried to grasp and apply the best of each.

#4 looks best to me.  The wood looks more like wood and the background doesn't look greyed out.

Use both the bright and dark variations of wood for added variety, IMO.

Good idea to recreate a "bookshelf" stage! Don't know why, this kind of stages were a common trope in old school games. I liked them very much, expecially in Castle of Illusion



and World of Illusion (one of my favourite games ever)



I think that much of their charm was given by the warm and cozy feeling they had. As a kid I wanted them to last a lot because they were so relaxing. So I'd choice warm colors, a but little bit dark and desaturated.

Yes, they have a more adult setting, but they are filled with school-stuff monsters and traps. You should play (or watch on youtube) those levels, 'cause they are really cool.

I would personally make the background a chalkboard to heavily emphasize the middle school theme while still having a dark background, which would allow you to have various writings and equations to break up empty space.  That is just me though, I may also recommend light, greyish plaster walls and "giant" (relative to your character) windows/posters/hangings.

I have plans for a few levels in the school zone, at different places of the school. The giant classroom is one of them - and there will clearly be a giant chalkboard far in the background. Then, there will be the "ink temple" where Bilou learns that he's the long announced "hero" who must save the planet. But first, he must bring back Booklet to the Library and have a talk with Pr. Harraps. So says the scenario. At last, there is the escape from Pendats jail and epic fight against SqRt, the math book.
I want the library to be globally a dark and dusty place, hence placing the camera facing the wall (or the back of the furniture that holds the books ... but yeah, these could be just wall-mounted shelves, actually.

You should play (or watch on youtube) those levels, 'cause they are really cool.

I may have found a fair quality gameplay video on youtube. That will be for tonight. If you have the ability to do screenshots of the level yourself, I'm very interested by the glass flask just nexto the books in the CoI screenshot, as I lack a proper reference for pixelarting "inkjet" monsters. (unfortunately, it looks like there's only low-quality JPGs around on the Web)

Experimenting with an alternate background, where the school become a huge city made of books.
(well, BG is still very sketchy, but if you've got comment about it so far, you're welcome anyway).

I plan to have more varied book covers in future updates  ... maybe something like this

It seems that those are at least 2 different books, but it's kinda hard to separate them (if they should have different sizes, change the color/details of each book)

I they are the same, make a perspectivical projection to get the proportions right (slym pointed already out that they look awkward).
I choosed your first book, drew the ground view and constructed the other views - really simple to understand by just looking at the picture

Yeah, good point. I think I'll also have to come up with something with a more square-ish shape for certain platforms (or ban that from that level altogether). Your TOP/FRONT visualisation convey well what I'm trying to do and produce more convincing objects. Thanks for the tip.

Well, just go with that general idea, then, but also move the books out of the level/screen on the left side. That way, you can have them occupy the space you want them to but also look "right" at the same time.

Having platforms (the books) that appear to recede in space does raise the question of exactly what plane the character is on; which edge of the book?



I really like the book fort architecture of the background , but having the books unilaterally larger (and significantly so) than those of the foreground invites a sense of dislocation of scale. I think the previous, plainer backgrounds felt more appropriately intimate and 'zoomed in'. Personally I'd apply that (very nice) idea to the foreground platforms (the current foundation of woodblocks seem a bit uninspired and not particulary evocative of a classroom). BG books could look good as well but I'd keep them at the same scale or smaller.

What about a view of the school room as if you're looking out from the bookshelf?

you can walk all over the book top, and the blue line can be jumped through

Ok, That's a nice idea, I'm a sucker for secret passages too .

Woodblocks to shelves makes a lot of sense. For more interest with a close-up bg I like Hugh's previous blackboard suggestion; it's pretty flexible (you could use primitive chalk drawings as the scenery or little in-jokes or whatever)  and I reckon you could get a nice chalk effect with a little tlc. I updated the example in my previous post.

Going for a full classroom in perspective might end up quite busy but if that's the way you want to go why not post up your attempts?