AuthorTopic: Ramblethread! A brainstorm approaches!  (Read 172495 times)

Offline zeid

  • 0010
  • *
  • Posts: 200
  • Karma: +1/-0
    • View Profile
    • Pixel Class

Re: Ramblethread! A brainstorm approaches!

Reply #120 on: June 08, 2010, 06:53:53 pm
Just found this thread; I've always wanted to discuss and explore in a more logical and technical fashion the pixel art unique matter helm and others have been discussing at the start.

I also wanted to insert a little opinion and say, the nostalgia associated with pixel art serves to hold it back as a serious medium in the eyes of many.  So I'm very glad that Snake said what he did in that interview, and that a game like that is coming out.

While Owlboy's art might not intentionally be trying to bring a nostalgic value to the game, it is inherent.  Perhaps this is a limitation to some extent of pixel art in games and at particularly low scale.  Good pixel art at smaller and smaller sizes should have a stronger symbolic expression.  going back to your earlier post, and elaborating on some of what you have said, I think it would be safe to say creating pixel art at lower and lower sizes resorts in the need for less realism and more symbolism (symbolism is of course tied closely with abstraction in the terminology I am using).  The cost of not doing so is a reduction to readability.  Too much abstraction and your image may result in an underrendered look.  Too little abstraction and you get 'fuzzy' images.

The last thing to note about this is it is acceptable in traditional media to symbolize/abstract despite the scale of the image so long as it is done tastefully;  This means of course that you can have larger scale images with higher symbolic value/more abstracted features while it still remains acceptably high quality art.  On the other hand you cannot have lower scales without the symbolism, or you aren't using the pixel medium to it's fullest and are just creating down scaled images with the same loss of precision of having resized other art mediums.
« Last Edit: June 09, 2010, 12:48:33 am by zeid »
View my Devlog... unless you aren't ready to have your mind blown.

Offline Helm

  • Moderator
  • 0110
  • *
  • Posts: 5159
  • Karma: +0/-0
    • View Profile
    • Asides-Bsides

Re: Ramblethread! A brainstorm approaches!

Reply #121 on: June 08, 2010, 07:09:52 pm
yes on that, zeid, I think that given the game-related history of pixel art, even the fact that in small resolutions an 'object' is defined by being separate from a 'background' (sprites and bobs and tiles and backgrounds and so on) gives in an inherent relation to symbolism, whereas if you make an oil painting using a huge brush and three colors that doesn't mean that this brush-stroke is an 'object' at all, a dualist entity that is on top of the canvas background. It could mean that if the artist was going for it but I'm just saying in pixel art when you go smaller and smaller it seems you're inviting symbolism-via-abstraction. Abstraction is fine art is resolutely not symbolist. A Mondrian painting does not necessarily have objects in it that 'stand in for other objects'.

Offline zeid

  • 0010
  • *
  • Posts: 200
  • Karma: +1/-0
    • View Profile
    • Pixel Class

Re: Ramblethread! A brainstorm approaches!

Reply #122 on: June 10, 2010, 02:41:27 am
I'm planning on writting a piece on pixel art of the sub-pixel level (representing image data less then 1 pixel in size) and super-pixel level (representing image data more then 1 pixel in size).  I know a lot of people don't make this distinction but I group AA, sub-pixel animation and similar use of pixel clusters in the same capacity all into the group of "subpixel representation".

I've been considering dithering dependant on, context to fall into either super-pixel, or sub-pixel.
Right now I regard it as a super-pixel technique when it's use in regards to colour conservation;  i.e The use of larger then pixel sized patterns to create the impression of a new colour on the pixel level.
However I place dithering into the sub-pixel category when it comes to creating texture;  i.e. The use of the pixels in relation to one another to create the impression of obscured detail relating to a texture of sorts.

I've been meaning to discuss something like this for a long time (years), this seems like the thread to bring it up and to help develop my thoughts on the matter further with the influence and insight of other artists.

What are people's thoughts on this concept?  Agree dissagree, classify things differently?
View my Devlog... unless you aren't ready to have your mind blown.

Offline Helm

  • Moderator
  • 0110
  • *
  • Posts: 5159
  • Karma: +0/-0
    • View Profile
    • Asides-Bsides

Re: Ramblethread! A brainstorm approaches!

Reply #123 on: June 15, 2010, 06:08:04 pm
On Banding Solutions

The pixel artist that works with more than two colors will undoubtedly run into banding problems. Here are some useful approaches for clearing out banding in one's pixel clusters.



First let's talk about the problems a little.

A is the case where a mostly regular cluster has a few irregular edges. The instinct of many pixel artists is to 'follow the shape' with anti-alias so it's 'shaded' while still retaining its irregular identity. This impulse isn't the best solution. Squares are strong in pixel art. Pixel art does perfect lines better than any other medium we know of. Absolutely crisp and straight, 90 degree angles in pixel art as a strength. The good pixel artist subconsciously is drawn towards the platonic solids they can present in their art, so to 'fill in the form' is a possible solution. However we see in the example above that the artist has exacerbated the problem by introducing banding. Instead of a perfect shape he's left with a very visually striking reminder of the shape's imperfection. The blemishes at the edges have been made doubly apparent because banding draws attention to the grid.

Let's talk about B last.

C is slightly more complicated combination of clusters where the artist is both trying to 'shade' the irregular contours of the shape and at the same time taper its end off into its own cluster to suggest a gradation or fade. To use contour anti-alias (single or double-pixel rows going around regular angles) that introduce a new cluster is a common reflex in pixel artists, however by introducing banding here what is instead achieved is a very strange visual illusion where the pixel cluster is blurred and doubled. I can't explain this any better, anyone who has spotted the perils of banding can see what I'm talking about.

B is a composite problem, where there's both a 90 degree boxy shape conveyed but there's also sloping and a free-form taper edge. Banding here has made every problem that much worse.

I want the reader to stop a while here and consider how they'd solve these problems. Go in your pixel art program and make do as best you can, commit to an approach on how to deal with the banding issues apparent in these examples. Then come back and read the rest and see how your choices parallel mine.











Here's a set of solutions.

On A you'll see I opted to double the anti-alias vertically. This effectively makes the antialias from contour anti-alias to separate pixel clusters on its own. This might seem counterintuitive at first but it looks much better than the banding. It suits however only the situations where the form can be elongated in either axis like that. Generally keep in mind:



When pixels of close shades touch in a systematic manner, there'll be banding. Although it seems counterintuitive, using clusters that are not one-pixel thin, less colors and therefore stronger segregation works better than banding because it suggests there's an orderly system of stacking that isn't dependent on the pixel grid, but on the number of available colors. If you have to choose between the two in pixel art, I posit that it's better to draw attention to a small color palette than it is to draw attention to the grid.

On C my solution here is to remove most of the contour anti-alias that would connect it to the separate cluster. Again this feels counter-intuitive but art with a grid has special considerations to keep in mind.




Best to deemphasize the introduction of a new color cluster through anti-alias *at the connection* between the two, otherwise between trying to anti-alias one form into another and introducing the new shape gradually, banding will occur.

On B my solution is as expected, composite. I identified the perfect angle on the right slope of the form and gave it one-point anti-alias. I made the irregular nooks sharp and readable and I suggested a slight curvature at the bottom of the identified square with a single pixel's worth of anti-alias. I broke up the line on the bottom of the form with the anti-alias because I judged any other solution for that configuration of pixels would lead to more banding. That last bit is effectively, sub-pixelling.

Here's a different set of solutions:



As you can see here anti-alias is mostly removed. This is a different approach but a valid nonetheless. On A note that the 'platonic square' that the cluster desires to be is again empathized and no banding is occurring. On C not how the two clusters (and no aa, at this point) interlock as if they're shaking hands: that's an elegant solution to the edge between clusters issue. In your paint program, add a pixel on the top or bottom of the 'handshake' to see what I mean about it. On B the minimal AA brings out the cluster shape loud and clear, but it also brings attention to the grid. It's a cost/benefit choice.

« Last Edit: June 15, 2010, 06:11:05 pm by Helm »

Offline 7321551

  • 0010
  • *
  • Posts: 121
  • Karma: +1/-0
  • a.k.a. Jarrad
    • View Profile

Re: Ramblethread! A brainstorm approaches!

Reply #124 on: June 16, 2010, 07:20:35 am
I think I avoid banding most of the time... Is this right?


I'm not sure about the doubled AA in the first A-solution. Do you know of any examples of that method?

Offline Helm

  • Moderator
  • 0110
  • *
  • Posts: 5159
  • Karma: +0/-0
    • View Profile
    • Asides-Bsides

Re: Ramblethread! A brainstorm approaches!

Reply #125 on: June 16, 2010, 07:42:25 am
Your AA seems solid to me.

Bading gets worse, more like this:



As to the A example, you can see it in a lot of pixel art, especially with metallic surfaces but nothing specific comes to mind.

Offline 7321551

  • 0010
  • *
  • Posts: 121
  • Karma: +1/-0
  • a.k.a. Jarrad
    • View Profile

Re: Ramblethread! A brainstorm approaches!

Reply #126 on: June 16, 2010, 04:47:40 pm
Thanks.
I noticed that the examples expanded/contracted a bit in the two different solutions, which gave me this idea -

Contriving size of subject to remove AA & avoid banding:

Offline Helm

  • Moderator
  • 0110
  • *
  • Posts: 5159
  • Karma: +0/-0
    • View Profile
    • Asides-Bsides

Re: Ramblethread! A brainstorm approaches!

Reply #127 on: June 16, 2010, 04:49:36 pm
Yes, thank you, that is a useful chart.

Philosophically I think even the sharpest-minded pixel artist should use at least a few bits of sparse one-point anti-alias in a piece just to show that manual antialias is in his artistic lexicon, you know?

Offline ptoing

  • Moderator
  • 0101
  • *
  • Posts: 3063
  • Karma: +0/-0
  • variegated quadrangle arranger
    • the_ptoing
    • http://pixeljoint.com/p/2191.htm
    • View Profile
    • Perpetually inactive website

Re: Ramblethread! A brainstorm approaches!

Reply #128 on: June 17, 2010, 07:46:59 pm
I just realised something. We often completely disregard the circumstances old gameart was made for. Older systems such as the C64 and all lowres arcade machines (even recent games still coming out) run with solid scanlines, not interlace or progressive scan. Only one field of scanlines is active at any point in time and it never changes which one it is. Thus you get very solid and visible sectioning of the pixels. Either horizontally or vertically, depending how the monitor is rotated (lots of vertical games in the arcades)

The thing is that scanlines slice through the grid and thus they make it more obvious and at the same time also kinda hide it.

Look at this:


In the versions with scanlines I would say the evil banding version looks best, the scanlines effectively hide the stepping between which shows where the grid meets.
I would also say that this goes for stuff like AA, as in it is needed less, because stepping is hidden to a degree.

Just something to keep in mind for things like CCs and such.
There are no ugly colours, only ugly combinations of colours.

Offline Rydin

  • 0011
  • **
  • Posts: 888
  • Karma: +0/-0
  • ...zzzt...
    • View Profile
    • hitori

Re: Ramblethread! A brainstorm approaches!

Reply #129 on: June 17, 2010, 08:09:50 pm


Here was my try at solving the problems before scrolling down.
Man cannot remake himself without suffering for he is both the marble and the sculptor.