AuthorTopic: Isometrics (Pixipedia)  (Read 6545 times)

Offline Zoggles

  • 0001
  • *
  • Posts: 85
  • Karma: +0/-0
  • Conjuring stuff
    • View Profile
    • Mini Wizard Studios

Re: Isometrics (Pixipedia)

Reply #10 on: October 19, 2005, 07:37:21 am
What those maths figures were in relation to in the tutorial was to simply point out a slight difference between hand drawn (or CAD isometrics for engineering/architecture) and pixel art isometrics where aesthetics are more important than the mathematical accuracy.

The actual percentage, or decimal point ratios are really irrelevant other than to point out the fact that they are nasty to look at. Isometrics, you work on a 2 across, 1 up/down. In pixel art you should never be looking to use a 'rotate' or 'skew' function anyway. Therefore the actual percentage is pretty irrelevant.

The 26.565 is simple math. Tan x = 1/2 therefore x = 26.565.
The second figure i calculated in the tutorial was indeed for keeping the 'depth aspect' in mind, and that is the figure the image would need to be squashed by horizontally before skewing it by 26.565 degrees.

Anyhow.. as I mentioned. The figures themselves (even though I still claim my maths is sound) are pretty irrelevant to anyone doing isometric pixel art.

As for the reason for 30degrees on traditional isometrics.. it has nothing to do with viewing the ground from (I can only assume an estimated angle of 45degrees), but far more to do with equilateral triangles. There is 60degrees between each axis when viewed two-dimensionally.

-Z-

Sorry if I don't seem to ever comment on your posts, but anything hosted on imageshack or most image hosting web sites is blocked from China. If I can't see it I can't therefore comment on it :(

Offline miascugh

  • 0010
  • *
  • Posts: 361
  • Karma: +0/-0
  • Schnitzelfiend
    • View Profile

Re: Isometrics (Pixipedia)

Reply #11 on: October 19, 2005, 04:28:15 pm
i was just trying to go into the essentials of this most common isometric view we get to see in pixel art. again, the 30 are not referring to the 2run-1rise-line, that of course are 26,565 and that's what i said above, nor to the traditional equilateral iso-grid. the 30 make up the angle which the ground is viewed at, this can easily be verifiied with simple trigonometry. and about the percentage of the width, zoggles' math is right i'm sure, but there's a little mistake in the approach, a tiny error in reasoning (the circle in truth would have to be an ellipse, because it's 'lying' on the ground; the line of 2 is rotated around the z-axis, thus the rules of distortion apply to the circle that would be created through the rotation as well).
heh, i'm aware, though, that this doesn't matter much the actual act of making isometric pixels, i have never applied those ratios myself consciously. this figures can be used if you want to incorporate a picture or such really hard and are anal about it :).

Offline Peppermint Pig

  • 0010
  • *
  • Posts: 495
  • Karma: +0/-0
    • View Profile

Re: Isometrics (Pixipedia)

Reply #12 on: October 19, 2005, 06:00:28 pm
Yeah.. the correction Miascugh made was a simple one as for how you drew the arc on an example graphic.

And my issue with your tutorials, Zoggles, is only that you had confusing examples between showing individual cubes to demonstrate style B, and then your example of drawing and plotting a grid in B. There, you offset the isometrically angled lines by 1 pixel between the different examples. It's not wrong to do this in freeform, but it was confusing when I overlayed the two to verify things were not the same. :P

Offline pixelblink

  • 0010
  • *
  • Posts: 143
  • Karma: +0/-0
    • View Profile
    • pixeljoint

Re: Isometrics (Pixipedia)

Reply #13 on: October 19, 2005, 11:45:31 pm
Anyhow.. as I mentioned. The figures themselves (even though I still claim my maths is sound) are pretty irrelevant to anyone doing isometric pixel art.

Thank you for saying that. I really can't see what math has to do with art. Art is about the estethics. There's certainly alot more to discuss about iso than this guys!

On another note, where the heck have you been Zoggles? MIA since how long ago?

Offline Zoggles

  • 0001
  • *
  • Posts: 85
  • Karma: +0/-0
  • Conjuring stuff
    • View Profile
    • Mini Wizard Studios

Re: Isometrics (Pixipedia)

Reply #14 on: October 20, 2005, 03:03:58 am
Ah.. ok, I think I see what you are on about Miascugh, taking a surface and distorting/skewing it fit on an isometric plane. Maybe my tutorial wasnt quite clear about the intention of that bit, but it came into the tutorial as there had been a discussion on Pixelation about skewing a 2d (platform view) surface to make an isometric one.. then flipping it horizontally for the other wall. I was simply trying to point out a difference in the sizes demonstrating the reduction in width of the surface if it were to be translated to the iso surface. In this case, the arc is a shallow ellipse, where the vertical radius is 1 and the horizontal, 2. You are rotating within Iso, not rotating in 3d to apply to iso. This is simply because of the aforementioned discussion about quickly painting textures on iso walls etc

If you were skewing a surface to fit into an isometric world, you would have to scale the height of the surface as well as the width and yes, the math would be quite different, although you could still do it in two stages. First skewing the height, and then following the bit I gave for the width.

As for the the 'grid in B' differing from the cube in B - ah.. I see what you mean. (I think) On the cubes, the top face's highlight is 1px too high compared to the grid type constructions following.

Reasons? well.. I tend to only offset that highlight if I'm actually using a tile engine or grid. If its just an object/item in iso, I would probably use the cube style. However, as soon as you start tiling or using a grid, you need to offset that line.

I do really need to do a part two to that tutorial at some point soon, elaborating on some areas a bit.

Type C is very similar to type B, but the main criticism I have to that is the lower edge of each tile. Being a flat 4 across, it means that corners all appear much rounder. Wonder if there's a decent option D

-Z-

PixelBlink: have been, and still am, out in China. Yeah MIA for quite a while. Taken me quite a while to find where everyone moved to, and seems like all the good ol' faces and 'lasts from the past's (greetings Blu_monkee) have found there way here.

Sorry if I don't seem to ever comment on your posts, but anything hosted on imageshack or most image hosting web sites is blocked from China. If I can't see it I can't therefore comment on it :(

Offline Peppermint Pig

  • 0010
  • *
  • Posts: 495
  • Karma: +0/-0
    • View Profile

Re: Isometrics (Pixipedia)

Reply #15 on: November 08, 2005, 03:25:41 pm
Just a brief update:   http://www.wayofthepixel.net/pixelation/pixipedia/index.php?title=Isometric

Images in.. need someone to add the mathematics. (go ahead and externally link the images, I'll move them into direct hosting later)

Going to start working on sprites and some other iso basics next.

Offline FaeryShivers

  • 0001
  • *
  • Posts: 64
  • Karma: +0/-0
    • View Profile
    • Happy Ufo Studios

Re: Isometrics (Pixipedia)

Reply #16 on: November 10, 2005, 09:20:25 pm
I've never been one for isometric art (it requires patience and technicality that I simply don't have), so I'll keep this really short.

Is there any other reason why someone would use a method other than B?

I've just started getting back into isometrics and honestly so far I'm liking C the best. As pep says it seems
to work better for designing game tiles. I've tried using all 3 methods and so far C's worked out the best for me
all around. In regards to patience, yes in some cases it requires more, but depth seems to flow out more easily in isometric
with less shading etc required.



On another note my start in pixel art (how lame ..that rhymed) really began in isometric. However, I started shying away from it for the longest time due to my lack of skill in "organic" looking isometric pieces (people, trees etc) sometimes you get too wrapped up
with the methods in isometric that you forget to experiment and everything just ends up looking like crude geometric
shapes slapped together. I've picked up ISO once again and I'm starting to like it more than I ever thought I would o_o
Looking over the examples I found with peppy (See "spriting isometric) has really got me interested, and it couldn't be at a better time as I think I'm going to try to move into the browser game genre as well.