8-Bit Rain

Previous topic - Next topic


Do you prefer rain on an 8-bit fashion? 8)

It is a bit messy as it is my first one and was frankenstained on a game.
Depending on what you need it for, specially if it is only aesthetic, it can be extremely simplified.

The rain, splash sprites and code are mine, you can use it freely but the background image is from ErekT and Ramenshop, borrowed for study reasons.
It is nice to see how rain has been done through these years. :good:

You might also wanna take a look at some pictures here: (beware, pops up)

Here goes the code and zip
Code (glbasic) Select
// --------------------------------- //
// Project: 8-bit RAIN
// Start: Sunday, December 23, 2012
// IDE Version: 10.283
// Done by Erico Patricio Monteiro
// CITY.png borrowed from ErekT and Ramenshop pixel art works for background example..and what a pretty one!
// Everything ELSE is mine and free
// http://www.gamesradar.com/the-evolution-of-rain/


// --- SYSTEM
SETCURRENTDIR("Media") ;// set media folder
LOADBMP "CITY.png" ;// load background image
LOADSPRITE "RAIN GOTA A.png",0 ;// load rain sprite type A
LOADSPRITE "RAIN GOTA B.png",1 ;// load rain sprite type B
LOADANIM "SPLASH.png",2,110,12 ;// load splash anim sprite
LOADFONT "smalfont.png",0 ;// load font
SETSCREEN 992,648,0 ;// set output resolution

GLOBAL rain ;// 0-rain off 1-rain on
GLOBAL raintg ;// rain target (what it plans to become)
GLOBAL rainmt ;// rain mid timer - rain fader
GLOBAL rainx[] ;// rain x sprite coord
GLOBAL rainy[] ;// rain y sprite coord
GLOBAL rains[] ;// rain state 0-drop off 1-drop on
GLOBAL raint ;// rain timer for drop flick
GLOBAL splashx ;// splash x sprite coord

DIM rainx[100] ; DIM rainy[100] ; DIM rains[100] ;// 100 rain sprites


WHILE TRUE ;// ------------------------------------------------------------------------------------------- // LOOP
// --- DISPLAY
ALPHAMODE -1 ;// no transparencies!
SMOOTHSHADING FALSE ;// no interpolation

IF raint>=0 AND raint<=4 ;// set raint=2 and 3 to blink rain
IF rain>0 OR rain=0 AND raintg=1 ;// if it is raining or want to rain
FOR z=0 TO 49 ;// loop 50x (100 drop sprites)
IF rains[z]=1 THEN DRAWSPRITE 0,rainx[z],rainy[z] ;// if drop on, draw it, type A
IF rains[z+50]=1 THEN DRAWSPRITE 1,rainx[z+50],rainy[z+50] ;// if drop on, draw it, type B
IF raint=0 OR raint=2 THEN splashx=RND(496) ;// random splash
IF rain=1 THEN DRAWANIM 2,0,splashx,300 ;// blink splash

IF rain=raintg
IF KEY(57)=1 ;// press space to change rain on/off
IF rain=0

IF rain>0 OR rain=0 AND raintg=1 ;// if raining or rain target on
FOR z=0 TO 49 ;// loop 50x (100 drop sprites)
IF rains[z]=0 AND raintg=1 ;// IF drop off AND rain target on (TYPE A)
IF RND(60)=0
rainx[z]=RND(496) ;// prepare drops x random position
rainy[z]=-15 ;// set drop y position
rains[z]=1 ;// drop on
IF rains[z+50]=0 AND raintg=1 ;// if drop off and rain target on (TYPE B)
IF RND(60)=0
rainx[z+50]=RND(496) ;// prepare drops x random position
rainy[z+50]=-15 ;// set drop y position
rains[z+50]=1 ;// drop on
IF rains[z]=1 ;// if drop on (TYPE A)
rainy[z]=rainy[z]+6 ;// gravity
IF rainy[z]>290 ;// hit ground turn drop off
IF rains[z+50]=1 ;// if drop on (TYPE B)
rainy[z+50]=rainy[z+50]+3 ;// gravity
IF rainy[z+50]>300 ;// hit ground turn drop off
raint=raint+1 ;// run rain timer
IF raint=4 THEN raint=0 ;// reset rain timer

// --- MID RAIN
IF rain<>raintg ;// check midrain condition
rainmt=rainmt+1 ;// advance midrain timer
IF rainmt=60 AND rain=0 AND raintg=1 ;// if for rain on, check midrain timer at 60
rain=1 ;// turn on rain
rainmt=0 ;// reset midrain timer
IF rainmt=110 AND rain=1 AND raintg=0 ;// if for rain off, check midrain timer at 110
rain=0 ;// turn off rain
rainmt=0 ;// reset midrain timer

GRABSPRITE 10,0,0,496,324
ZOOMSPRITE 10,247,163,2,2
WEND ;// ------------------------------------------------------------------------------------------- // LOOP [end]

[attachment deleted by admin]

Ian Price

That's really nice. :)
I came. I saw. I played.


tks Ian, it is quite a code mess, but it is simple to understand, hope it is usefull to people and hope i can release more pieces of code as snipets :)


Hey Erico, I like that! And nice choice of back-ground pick for the demo. The whole thing has a nice retro-feel to it.  :)
We could easily add things for rain-drops to splash off of, like phone-booth, news stands, awnings, etc.

This is perfect for an intro-scene. Can you imagine a "Dink Darkly, Private-Eye" logo in a seedy store-front window, with the rain falling down and a few lightning flashes? Some "mystery" music plays as an old-time car with grey windows pulls up, and parks. The head of a beautiful dame is momentarily visible over the top of the car as she steps into the door. A woman sobs. Lightning flashes. Game On!


Thanks, the guys that made that background are really pros!
You can see more of their work here:

You can see their work in progress too and some variations.
It sure has a nice mood, I thought this image would come along nice for a background on rain.

Somehow it reminds me a lot of old 8-bit side scroller/adventure games :)
I love the dithering and use of so little amount of colors.


Cool, its a nice effect. It's one of those things that ads atmosphere sublimely to any scene. Paired with some flashes and thunder noises and the effect is great!  :good:


"It is practically impossible to teach good programming style to students that have had prior exposure to BASIC.  As potential programmers, they are mentally mutilated beyond hope of regeneration."
(E. W. Dijkstra)


Sure shot Bigsofty,

I have been adding sound sfx to my little game lately(it uses this routine)...it is amazing how it brings a new world into it, like it sparkles life into it.
You know, my game has been without sound for more then 6 months...it is just amazing even with the simple blips and blops.

I think it will actually pack it up when music is done too :) I hope I can get someone to give it a bless on that.

PS: I have been recording rain and thunder myself, you know, rain era in sao paulo, waters of march I guess :) I hope I can use some of that in game ;)

Brick Redux

Well done with that Erico, a nice parallax effect. :good:
A mournful owner of a HP HDX18 Laptop that has died...FECK!

Brick Redux

Thanks to your code I ended up playing Lotus 2 again today.  A racing game that mimicks your rain code in a certain race. Im now looking forward to your game Erico.  Dont worry too much about messy code - in the 1990s alot of software developers coded games in the same way and they made money!  So, go with whats best for you and channel the creativity buddy.
A mournful owner of a HP HDX18 Laptop that has died...FECK!


Super thanks Brick!
Lotus 2 is my fave amongst the lotus trilogy,  I see you just did a snippet that could achieve the tracks effect uh?
Really nice!

Mr.T did a track effect similar to lotus, we have it on the snippets or example.
A lotus clone is one of my wanna-remake game, hehe.

Brick Redux

I was also a fan of the SuperCars games - top down view racing.

Regarding the fake 3d effect (snippet) Im sure its possible to achieve the Snes Mode 7 effect with it too.  Draw a large map sprite, choose a small area of said sprite and read the color values there. Then duplicate these color values onto the 3d grid snippet.  Doing corners would be quite easy - rotate the map sprite/ then scan the colors - achieving a fluid bend in the 3d grid.
A mournful owner of a HP HDX18 Laptop that has died...FECK!