Jump to content
  • Advertisement
Sign in to follow this  
bhavinvs

2D game developer

This topic is 4402 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

If you intended to correct an error in the post then please contact us.

Recommended Posts

Hi friends, I'm making a 2D game with 8 bit bitmap images,i want to have shadows and lighting like features in my game, please help me in this with your experience and amzing trick.

Share this post


Link to post
Share on other sites
Advertisement
If you are developing for modern computers, 32bit can often times be *faster* than 8 bit, so I highly recommend making the switch.

As for lighting and what not, this could depend alot on the game. Static shadows can be made by skewing the image and making it all black, mabye with a slight blur if you've got access to an alpha channel. Lighting can be difficult, but if you have alpha channels, you could make a big image and stretch it over the screen and change it's alpha values to represent how bright it is at that pixel.

Without more information, I don't think that we'll be able to help you much.

Share this post


Link to post
Share on other sites
a cheap "old school" trick :

- reduce the color number of all your 8-bit bitmaps to 85 colors.
(should be easy with an image editor like photoshop)

- build your color palette as the first 85 colors correspond to the bitmaps palette, then the 85 following colors will be the same but darker (to simulate basic shadows), and the 85 last colors will be lighter (to simulate basic light).

- now to "shadow" a pixel, you just have to do something like : pixel = (pixel modulo 85) + 85, and to "light" a pixel : pixel = (pixel modulo 85) + 85 * 2

(I took 85 because 85 * 3 = 255)

hope it helps :)

Share this post


Link to post
Share on other sites
Thanks for replying,Is it any other alternative way,bcz all my images are of 8bit.
And this is my first game program having little knowledge of grahics and pls tell me about what is .PNG image,can i used it instead of 8bit bitmap.If u can show exaple with code it will be helpfull.

Share this post


Link to post
Share on other sites
Quote:
Original post by bhavinvs
Thanks for replying,Is it any other alternative way,bcz all my images are of 8bit.
And this is my first game program having little knowledge of grahics and pls tell me about what is .PNG image,can i used it instead of 8bit bitmap.If u can show exaple with code it will be helpfull.

Example of loading PNG can be found on the web, and I am too lazy to search for it. www.wotsit.org, is a good start on file formats. You can use any file format, PNG, JPG, TGA, GIF, etc, as long as you can map the image data to your 8-bit image buffer.

If you have little knowledge of graphics, then it's highly unlikely that you can understand the suggestions above nor the tricks how to do it. The limitation of 8-bit is that, you can't blend colors because it lacks of alpha channel. Shadows and lighting become harder to implement.

Share this post


Link to post
Share on other sites
Quote:
Original post by pizzafan
a cheap "old school" trick :

- reduce the color number of all your 8-bit bitmaps to 85 colors.
(should be easy with an image editor like photoshop)

- build your color palette as the first 85 colors correspond to the bitmaps palette, then the 85 following colors will be the same but darker (to simulate basic shadows), and the 85 last colors will be lighter (to simulate basic light).

- now to "shadow" a pixel, you just have to do something like : pixel = (pixel modulo 85) + 85, and to "light" a pixel : pixel = (pixel modulo 85) + 85 * 2

(I took 85 because 85 * 3 = 255)

hope it helps :)


ur reply sounds good,but still i'm not getting clear,give me some more detail with little example if u can.

Share this post


Link to post
Share on other sites
(ouch, I should take some lessons to learn proper english ^^)

First, an 8-bit bitmap can be considered as an array of bytes (an 8-bit element, a positive integer which can have a value from 0 to 255). Using C language, you would name this "byte" an "unsigned char".

In this bitmap, any "byte" refers to a pixel (which means a point in the bitmap).

this pixel doesn't contain any color information (no red, green or blue value). It's just a color index, which means it refers to a palette entry containing the colors information (red, green and blue value : combined it makes a color. if you don't get this particular point, you could read an HTML tutorial about changing text colors with the command :)).

let's simplify and consider we have an 8-bit bitmap with only 3 colors :

color 0 : black
color 1 : red
color 2 : yellow

it means all of the "bytes" contained in the bitmap will have a value of 0, 1 or 2.

the trick is to use the remaining colors entry (from 3 to 255) to simulate basic shadows (darker colors) and basic lights (lighter colors).

we first build a new color palette :

color 0 : black
color 1 : red
color 2 : yellow

color 3 : another black (the black color is alread the darkest)
color 4 : dark red (color 1 but darker to simulate a shadow effect)
color 5 : dark yellow (color 2 but darker to simulate a shadow effect)

color 6 : dark gray (color 0 but lighter to simulate a light effect)
color 7 : light red (color 1 but lighter to simulate a light effect)
color 8 : light yellow (color 2 but lighter to simulate a light effect)


so... now let's say you want to simulate a shadow only on a specific pixel :

the main idea is to read the byte from the bitmap at the proper coordinates (most of the time it will be something like : pixel = bitmap[x+y*width], find a tutorial about adressing 2D arrays in C if you don't get this point).

once you have this byte, you want to know which color it was in your original palette (with no light or shadow). so you perform a simple mathematical operation which is called "modulo" : pixel = pixel modulo 3 ("3" because we use only 3 colors in our little example, it should be 85 if we use 85 colors).

so now that you have your original color (0, 1 or 2, which visually corresponds to black, red or yellow), you want to shadow it : it's the same as making it darker. as you can see, darker colors in our color palette begin with the color 3 (another black, the "darker" version of the color 0 : black). so we add 3 to our pixel so it corresponds to its darker value :

if pixel value is 0 : 0 (black) + 3 = 3 (another black)
if pixel value is 1 : 1 (red) + 3 = 4 (dark red)
if pixel value is 2 : 2 (yellow)+ 3 = 5 (dark yellow)

now we just have to write the new color in the bitmap, using something like : bitmap[x+y*width] = pixel.

to sum up, it shoud look like this in C language :

pixel = bitmap[x+y*width]; // get the pixel value from the bitmap
pixel = pixel % 3 + 3; // "shadowing" the pixel
bitmap[x+y*width] = pixel; // saving the pixel in the bitmap

("%" operator means "modulo")

to make a light effect, you just add 6 ( = 3 * 2) instead of 3, to make the colors correspond to their lighter version.

Is it more clear ? :)

(if you have understood all the explanation, you should look at some old software 2D bump-mapping tutorials and also some tutorials about environment lighting... look for articles writed around year 1998-2001, it might help you coding some better light/shadow effects than this, but it requires some "heavy" mathematics)

Feel free to ask about what you didn't understood, I'm not very good at explaining algorithms :)

[Edited by - pizzafan on July 31, 2006 3:02:46 AM]

Share this post


Link to post
Share on other sites
Quote:
Original post by pizzafan
(ouch, I should take some lessons to learn proper english ^^)

First, an 8-bit bitmap can be considered as an array of bytes (an 8-bit element, a positive integer which can have a value from 0 to 255). Using C language, you would name this "byte" an "unsigned char".

In this bitmap, any "byte" refers to a pixel (which means a point in the bitmap).

this pixel doesn't contain any color information (no red, green or blue value). It's just a color index, which means it refers to a palette entry containing the colors information (red, green and blue value : combined it makes a color. if you don't get this particular point, you could read an HTML tutorial about changing text colors with the command :)).

let's simplify and consider we have an 8-bit bitmap with only 3 colors :

color 0 : black
color 1 : red
color 2 : yellow

it means all of the "bytes" contained in the bitmap will have a value of 0, 1 or 2.

the trick is to use the remaining colors entry (from 3 to 255) to simulate basic shadows (darker colors) and basic lights (lighter colors).

we first build a new color palette :

color 0 : black
color 1 : red
color 2 : yellow

color 3 : another black (the black color is alread the darkest)
color 4 : dark red (color 1 but darker to simulate a shadow effect)
color 5 : dark yellow (color 2 but darker to simulate a shadow effect)

color 6 : dark gray (color 0 but lighter to simulate a light effect)
color 7 : light red (color 1 but lighter to simulate a light effect)
color 8 : light yellow (color 2 but lighter to simulate a light effect)


so... now let's say you want to simulate a shadow only on a specific pixel :

the main idea is to read the byte from the bitmap at the proper coordinates (most of the time it will be something like : pixel = bitmap[x+y*width], find a tutorial about adressing 2D arrays in C if you don't get this point).

once you have this byte, you want to know which color it was in your original palette (with no light or shadow). so you perform a simple mathematical operation which is called "modulo" : pixel = pixel modulo 3 ("3" because we use only 3 colors in our little example, it should be 85 if we use 85 colors).

so now that you have your original color (0, 1 or 2, which visually corresponds to black, red or yellow), you want to shadow it : it's the same as making it darker. as you can see, darker colors in our color palette begin with the color 3 (another black, the "darker" version of the color 0 : black). so we add 3 to our pixel so it corresponds to its darker value :

if pixel value is 0 : 0 (black) + 3 = 3 (another black)
if pixel value is 1 : 1 (red) + 3 = 4 (dark red)
if pixel value is 2 : 2 (yellow)+ 3 = 5 (dark yellow)

now we just have to write the new color in the bitmap, using something like : bitmap[x+y*width] = pixel.

to sum up, it shoud look like this in C language :

pixel = bitmap[x+y*width]; // get the pixel value from the bitmap
pixel = pixel % 3 + 3; // "shadowing" the pixel
bitmap[x+y*width] = pixel; // saving the pixel in the bitmap

("%" operator means "modulo")

to make a light effect, you just add 6 ( = 3 * 2) instead of 3, to make the colors correspond to their lighter version.

Is it more clear ? :)

(if you have understood all the explanation, you should look at some old software 2D bump-mapping tutorials and also some tutorials about environment lighting... look for articles writed around year 1998-2001, it might help you coding some better light/shadow effects than this, but it requires some "heavy" mathematics)

Feel free to ask about what you didn't understood, I'm not very good at explaining algorithms :)


Thanx Thanx thanx a lot an now can i have one pizza(just kidding).I think u have done ur best to explain me,thanx once again for explaining,it was more clear for me.which is the best book for Beginners.Pls reply to tht.

Share this post


Link to post
Share on other sites
you're welcome :)

unfortunately, I don't know any books about coding 2D games.

by the way, you should look at the tutorials section on this site, it should be very helpful to you.

good luck ^^

Share this post


Link to post
Share on other sites
Sign in to follow this  

  • Advertisement
×

Important Information

By using GameDev.net, you agree to our community Guidelines, Terms of Use, and Privacy Policy.

We are the game development community.

Whether you are an indie, hobbyist, AAA developer, or just trying to learn, GameDev.net is the place for you to learn, share, and connect with the games industry. Learn more About Us or sign up!

Sign me up!