AuthorTopic: GR#115 - Space Ships - Topdown  (Read 14696 times)

Offline Szyu

  • 0001
  • *
  • Posts: 24
  • Karma: +0/-0
    • View Profile

GR#115 - Space Ships - Topdown

on: July 11, 2012, 09:22:36 pm
Hey community,
I'm just starting off working on Sprites for my game, which I am programming on XNA, so I want to hear your real opinions. I will show you 4 space ships i have created and yes I know, there is much missing for good Sprites. With your help and tips I want to improve my skill.
So let's start with the ships.


Offline yrizoud

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

Re: Space Ships

Reply #1 on: July 12, 2012, 09:08:00 am
The big issue is that they look too flat. All shapes have one-pixel-wide highlight at top and one-pixel shadow at the bottom, which makes them look flat, all parallel to the viewer, and 1-centimeter thick. You need to use thicker highlights and shadows to represent shapes that are thicker : ship bodies, reactors, turrets...
Darker shade can help represent something that is farther from the viewer, and lighter shade when they are closer.

Last, you probably shouldn't keep the internal black outlines. I know they help early on when designing the general shape, but as soon as you need to flesh out the volumes, they get in the way: they make a huge separation between forms that are actually contiguous.

Offline Szyu

  • 0001
  • *
  • Posts: 24
  • Karma: +0/-0
    • View Profile

Re: Space Ships

Reply #2 on: July 12, 2012, 10:43:24 am
Okay thanks for the introduction to my mistakes. I have to say that i am really new to the whole pixel thing, so i really have to learn a lot yet. This is why i have joined this forum. So at this time, i really dont have a clue how to proper set the shadows and lights to make a detailled and perhaps realistic view.

Offline PypeBros

  • 0100
  • ***
  • Posts: 1220
  • Karma: +2/-0
  • Pixel Padawan
    • PypeBros
    • View Profile
    • Bilou Homebrew's Blog.

Re: Space Ships

Reply #3 on: July 12, 2012, 02:30:51 pm
It's a 3D rendering trick that you can apply to any drawing medium, it's not pixel-specific.

A horizontal area would have a flat color: no shading. If an area is slanted towards the lightsource, highlight it. If it's slanted the other side, shadow it. Using a simple 3D modeller can help you .. or put a toy ship next to a desk light and study what is lighter and what is darker ... then practice drawing this very ship ;)

Offline Lazycow

  • 0010
  • *
  • Posts: 146
  • Karma: +0/-0
  • Do androids dream of electric sheep?
    • flurrycow
    • flurrycow
    • http://pixeljoint.com/p/15168.htm
    • View Profile
    • homepage

Re: Space Ships

Reply #4 on: July 12, 2012, 05:32:57 pm
i really dont have a clue how to proper set the shadows and lights to make a detailled and perhaps realistic view.

Divide et impera...

Build yourself a space ship construction kit, here's an example from chriskot

(from the CC Challenge - Dodonpachi Assembly Line)
A man touched down on the moon, a wall came down in Berlin, a world was connected by our own science and imagination. Yes we can!

Offline Szyu

  • 0001
  • *
  • Posts: 24
  • Karma: +0/-0
    • View Profile

Re: Space Ships

Reply #5 on: July 12, 2012, 06:40:15 pm
Ok this is a really interesting suggestion i should have an eye on. But still i dont know how to make the tiles. I am a real noob in setting shadows and lights for a realistic view.
And i am also struggling with the question, if such a view would be possible in my game. My Idea was just to Rotate the ship to move around. i guess it would look weird if you always see the engines of the ship. What do you think?

I will try to create my own construction kit, but i would be glad of any kind of help =)

Offline yrizoud

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

Re: Space Ships

Reply #6 on: July 12, 2012, 07:08:03 pm
I had started an edit based on one of your designs:

Offline PypeBros

  • 0100
  • ***
  • Posts: 1220
  • Karma: +2/-0
  • Pixel Padawan
    • PypeBros
    • View Profile
    • Bilou Homebrew's Blog.

Re: Space Ships

Reply #7 on: July 13, 2012, 09:31:15 am
My Idea was just to Rotate the ship to move around. i guess it would look weird if you always see the engines of the ship. What do you think?

If rotations is strongly part of your game design, then likely pixel art isn't the appropriate medium for your game assets. Not only you'll struggle with lightning, but any automated rotation will screw up the antialias/banding-preventions and any sort of eye-candy effort you pushed on your reference pictures.

Many shoot-em-up of the pixel-golden-age had no rotation, but instead used angling of the opponents to suggest horizontal moves. (by the way, in some environment it makes sense: your jet plane does not rotate left/right easily: it twists along the main movement axis and then gets "lifted to the right" by its wings.


(illustration with the tyrian spritesheet. Check planes on top-right corner).
« Last Edit: July 13, 2012, 09:46:19 am by PypeBros »

Offline Szyu

  • 0001
  • *
  • Posts: 24
  • Karma: +0/-0
    • View Profile

Re: Space Ships

Reply #8 on: July 13, 2012, 03:57:14 pm
@yrizoud:
your Edit would be a great start for me. I will try to bring this shadowstyle to the rest of the ship and show you the result.

@PypeBros:
Rotating the ship WILL be a main part of the game structure. It will be like the good old Asteroids game. When you fly outside a screenborder, you will return on the other side. So you need to rotate for not flying only in one line. I tried one of the ships from the topic Lazycow linked, and the issue with shadows and lights dont seem to make it look creepy.
My particle system perfectly compensated the perspective, so all i need to do is to add more details (much more) and better shadows/lights

Offline yrizoud

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

Re: Space Ships

Reply #9 on: July 13, 2012, 07:26:42 pm
Games that rotate bitmaps tend to have everything drawn in higher size, and the game engine reduces the visual size at runtime. The extra pixels help during roto-zoom, to provide finer details.
In this case, use only a small number of solid colors, never single-pixel details.
Linley's Angry Moth used this technique :

The ships don't show a specific lighting either.