7
\$\begingroup\$

Being bored I decided to make my game isometric by applying a simple filter effect.

    g.scale(1f, 0.5f);
    g.rotate(400, c.getHeight() / 2, 45);

It works great, but now everything appears... flat.

enter image description here

Improve this question
\$\endgroup\$
6
  • 2
    \$\begingroup\$ You're going to have to modify your art if you want the isometric look to work. \$\endgroup\$
    – skyuzo
    Oct 25, 2011 at 7:15
  • 3
    \$\begingroup\$ You need depth to make isometric art work. This doesn't have any depth, hence the flat look. Search google for isometric art for examples. \$\endgroup\$
    – thedaian
    Oct 25, 2011 at 8:35
  • 1
    \$\begingroup\$ Personally, I like that flat style - the big problem I have with isometric games, is that it can sometimes be hard to see where my character is. \$\endgroup\$
    – Cyclops
    Oct 25, 2011 at 12:25
  • 1
    \$\begingroup\$ Make sure you take advice from real artists, not know-it-all programmers. Gamedev includes different talent sets, and no one but an artist will be able to truly help you with this. Make sure their section of gamedev is art. Otherwise, the answer will be sub-par and mostly ugly to everyone but you and the answerer. \$\endgroup\$
    – user15858
    May 27, 2013 at 11:09
  • 1
    \$\begingroup\$ I suggest getting some squares in a 3D modeler or 3D viewer (anything would work fine if you can move the camera around), and just move the camera around. Look at the different angles. Look at how it effects the look and feel. Compare to your art and camera angle. This and reading up on isometric artwork can actually help you understand why it is flat. When you understand that, you may be better apt to fix it. \$\endgroup\$
    – user15858
    May 27, 2013 at 11:13

3 Answers 3

Reset to default
8
\$\begingroup\$

Your technique could work, to some limited extent, but you don't want to apply the same transformations for the objects that are supposed to be standing. For these, make a simple "skew", as illustrated here: enter image description here The second rotation might not be the inverse of the first as it depends on the scale factor. The important thing is that the vertical lines are actually vertical, i.e, aligned with the y axis (look at the dashed lines). Also, you might want to scale back a little. This is more important for doors than characters.

But still, as the commenters said, if this project goes beyond boredom avoid this method and begin making isometric art with a regular grid :)

Improve this answer
\$\endgroup\$
8
  • \$\begingroup\$ Love the picture :P \$\endgroup\$
    – Derek
    Oct 25, 2011 at 15:01
  • \$\begingroup\$ True, but i can't read the word above the 3rd arrow. \$\endgroup\$
    – George Duckett
    Oct 25, 2011 at 15:22
  • \$\begingroup\$ @GeorgeDuckett, I think it's "rot(ate)" \$\endgroup\$
    – Raine
    Oct 25, 2011 at 15:42
  • \$\begingroup\$ @Raine, ahh that makes sense. It looking quite different to the first one threw me. \$\endgroup\$
    – George Duckett
    Oct 25, 2011 at 15:43
  • 3
    \$\begingroup\$ The skew works well for flat vertical objects like doors or walls, but for things like creatures it'll probably look better if you just apply no transformation at all. But, as Diego says, for best results you really should be drawing your tiles in isometric perspective to begin with. That, or go fully 3D. \$\endgroup\$
    – Ilmari Karonen
    Oct 25, 2011 at 16:19
6
\$\begingroup\$

It looks fine. Since an isometric projection is essentially a rotation followed by an orthographic projection there should be no foreshortening - and hence a limited perception of depth etc.

isometric flaw

So my take is, keep going.

  • Put some taller buildings in. Obstruction should help create a sense of depth.
  • Create shadows if you can (if you use actual 3d models to generate an isometric view out of them, you can use shadow volumes to get accurate shadows with little effort from artists (but a lot from programmers)
  • Add moving characters (again characters going behind visual obstructions will help)
  • Reduce the view the person has / zoom in a bit. This will help it look less map like (ala simcity 2000)

simcity 2000

and more "overhead view" like (ala starcraft)

starcraft

The more you zoom out, the more the brain starts to expect perspective / the player thinks he's looking at a map

Improve this answer
\$\endgroup\$
1
  • \$\begingroup\$ Great answer and a much simpler solution if you already have flat isometric map rendering nicely. + 1 \$\endgroup\$
    – Darren Reid
    Nov 10, 2011 at 8:32
2
\$\begingroup\$

You need differences in shadow heights, to make the isometry more believable. Higher objects cast longer shadows. Try it, you'll see an improvement right away.

All your edges which face upwards have very little definition. In real life, we recognize edges on a glance by a change in contrast between one surface and another. Your contrast (change in tone) is very slight between your top grey and bottom grey. Add to that the very fine brick detail -- I would emphasise that a lot. Also not that gaps between bricks aren't just a dark shade, more often than not you'll see highlighted edges contrasted directly adjacent to deep shadow. You have zero highlights -- of course things will look flat. Check this out as an example:

Dungeon Master clone shows specular and deep shadow contrast

(from here) And yes, I know it's perspectival and not orthogonal. The point is the lighting.

Improve this answer
\$\endgroup\$

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .