next »

[Geeze]

Introduction to surface deformations
(And that cool old tv-screen effect)

Pretty, eh?


Requirements:
- Game Maker Pro (I'm not sure in what versions you can use this.)
- Some Game Maker using skills. (So this ain't for n00bs. n00bs: read Derek's awesome GM tuts)

Thanks to:
- Derek Yu. Duh  
- Chevy Ray for his great surface tutorials. Actually the code in here is based on THIS
- Paul Eres Just because his giving advice to everyone about Game Maker, which is a good thing
- ditdingiscool @ GMC.He made general deform scripts for GM. My tutorial is also based on those
Okay let's start:

I'll use the old screen effect as example, and I'll just copy+paste most of the code here and explaing by comments.

Create a new object which will handle surface deformations. Make sure it's the foremost object.

Put this in the creation step.

Code:

// screen base(view_wview and view_hview)
screen_x = 0; //Pretty self explanatory
screen_y = 0;
screen_w = 160;
screen_h = 120;
screen_scale = 4;

// create a surface for the whole screen to be drawn on, create as many as needed
// Here's a few extra surfaces for the effect
dsurf = surface_create(screen_w,screen_h); //All is drawn here first
msurf = surface_create(screen_w*screen_scale,screen_h*screen_scale);//The magnified version
esurf = surface_create(screen_w*screen_scale,screen_h*screen_scale);//Effect #1 surface,
fsurf = surface_create(screen_w*screen_scale,screen_h*screen_scale);//Effect #2 surface, and the final one!
// this will destroy the screen object if surfaces are not supported on the graphics card,
// reverting to the viewport method
if dsurf = -1{instance_destroy();}

Begin step:

Code:

// this draws the surface on the screen. I won't explain routines in detail. Check Chevy's tutorial
surface_reset_target();
draw_clear(0);
scr_deform(80); //THIS IS THE MEAT. THE INTERESTING PART WHAT IS THE REASON YOU'RE READING THIS TUTORIAL!!!!
// 80 stands for rate of curvature. Bigger number, smaller curve.
draw_set_blend_mode_ext(bm_one, bm_zero);
draw_surface_stretched(fsurf,screen_x,screen_y,screen_w*screen_scale,screen_h*screen_scale);
draw_set_blend_mode(bm_normal);
screen_refresh();

End step:

Code:

surface_set_target(dsurf);

And now to the interesting part. scr_deform() This is where the actual deformations are defined. You should rewrite this part completely when making your own effects.

Code:

//scr_deform(curvature) bigger -> less curve! 40-80 is quite good!
//iy,ix these are for the for loop
//curvecalc, determines how much is the current line going to be streched.
//
var iy,ix,curvecalc;
surface_set_target(msurf)
draw_surface_stretched(dsurf,0,0,screen_w*screen_scale,screen_h*screen_scale)
// Zoom. This is actually important to do first, to deform "pixels"
surface_set_target(esurf) //Horizontal deformation

for(iy = 0; iy < screen_h*screen_scale; iy += 1){
    curvecalc = power((iy-screen_h*screen_scale/2)/argument0,2) //Here is calculated how much a stripe is stretched!
    draw_surface_part_ext(msurf,0,iy,surface_get_width(msurf),1,curvecalc,iy,((screen_w*3)-(2*curvecalc))/(screen_w*3),1,c_white,1)
}
surface_set_target(fsurf) // Vertical deforamation
for(ix = 0; ix < screen_w*screen_scale; ix += 1){
    curvecalc = power((ix-screen_w*screen_scale/2)/40,2) //Here is calculated how much a stripe is stretched!
    draw_surface_part_ext(esurf,ix,0,1,surface_get_height(esurf),ix,curvecalc,1,((screen_h*screen_scale)-(2*curvecalc))/(screen_h*screen_scale),c_white,1)
}
surface_reset_target()

So this is how it usually goes:

• set drawing target to effect surface.
• have a for loop iterate through every line or column
• use draw_surface_part_***() to draw needed line.
  
• You can change x/y offset, scaling, colors, blend modes, or whatever you need to get desired effect.

Things to remember:

• It's very important to work on horizontal/vertical stripes so that it runs smoothly!
• NEVER OPERATE ON SINGLE PIXELS. It's slooooooooooooooooooooooow. So slow that game freezes
• Do not try to mention me that I didn't clear the surfaces. I didn't because I didn't have to, but you should do it if you need it!
• You can use sin/cos/tan freely to create cool waves/make game character drunk.
  

Dats it!

Comments are appreciated!

[Theophilus]

This would be perfect if it weren't so slow! It's cut my FPS to 40%. Any reason why it's so slow? Any tips to speed it up?

[ஒழுக்கின்மை (Paul Eres)]

i don't recall giving anyone advice on gm when they don't specifically request help on gm (either requesting it directly of me or by posting a thread with their question in these forums), so i'm not sure what you mean there, but this tutorial seems useful, even if nobody requested that you help them with this topic

[Geeze]

This would be perfect if it weren't so slow! It's cut my FPS to 40%. Any reason why it's so slow? Any tips to speed it up?

You could try to operate on 2 pixel wide stripes instead of one pixel wide. That should work.
I should probably add some stuff about optimization.

i don't recall giving anyone advice on gm when they don't specifically request help on gm (either requesting it directly of me or by posting a thread with their question in these forums), so i'm not sure what you mean there, but this tutorial seems useful, even if nobody requested that you help them with this topic

Just disregard what I said. I don't usually do radical honesty.

[Geeze]

Maybe it's because I'm rusty having not opened Game Maker for about a year, or maybe I'm just a dumbarse, but I can't get the deformation to work (the surface scaling works fine). So I opened up one of my old games that already uses Chevy's surface scaling script, pasted your first code block over the original "screen_init", pasted second block over "screen_begin" and third code block over "screen_end". Made a new script for "scr_deform" which screen_begin doesn't throw an error message at... but the deformation isn't there (tried messing with the scr_deform value).

Code:

// this draws the surface on the screen. I won't explain routines in detail. Check Chevy's tutorial
surface_reset_target();
draw_clear(0);
scr_deform(80);
// 80 stands for rate of curvature. Bigger number, smaller curve.
draw_set_blend_mode_ext(bm_one, bm_zero);
draw_surface_stretched(fsurf,screen_x,screen_y,screen_w*screen_scale,screen_h*screen_scale);//THIS HERE!!!
draw_set_blend_mode(bm_normal);
screen_refresh();

draw_surface_stretched(fsurf,screen_x,screen_y,screen_w*screen_scale,screen_h*screen_scale);
Are you sure you're drawing correct surface? Remember to doublecheck draw targets.
If that doesn't work can you paste your scr_deform() here?

[burning]

Can you tell me how to go about drawing anything sprites/surfaces on top on top of the main screen surface, which won't be affected by the transformations? i.e. UI that i don't want transformed.

[Geeze]

Oh good someone remembers my tutorial sometimes.
You could use another surface for stuff you don't want to deform and just draw that on top of deformed surface.
When you are drawing stuff you want to get on nondeform surf

• change to no deform surface
• draw
• change back! Or it will break the system.
  
  

And add drawing nondeform surface in the begin step after drawing deform surface.

[burning]

Thanks, i was on the right track, surfaces just seem to be really finicky about excactly where i put everything, so i had to really simplify everything to figure out where i was screwing it up.