Graphics 2.5d Black Outline For Basic 3d Shapes

M

modler2

Guest
GM Version: Studio 1.4
Target Platform: Tested on Android and Windows

Summary:
This is my first tutorial I hope you guys like it! I thought this might a cool effect to add to 3d projects or in my case a 2.5d project. Keep in mind I'm no expert so this code is probably inefficient. It is simply drawing a second duplicate model .5 bigger on the x,y,z axis, applying a black texture to it and then enabling culling on the block. Its a very basic application that can add a cool effect to your games. Keep in mind however this is doubling the poly count and on large scale can cause slowdowns. It also is known to cause bigger and or smaller lines depending on the position of your player.

The effect can make your flat game go from this:


to this:



I'm not going to explain about the player because its your game your player will likely interact different than mine. I also am assuming that you have an understanding of applying textures to 3d models. However I will explain the camera and the block code required to achieve this effect.

Start by making an object and calling it "Camera"

Within Camera create a room start event and copy this code into a script
Code:
d3d_start(); //this starts the 3d in the room
//fixes alpha issue within gamemaker studio
draw_set_alpha_test(true)
draw_set_alpha_test_ref_value(40)
Still within Camera create a room end event and place this code into a script
Code:
d3d_end(); //avoids memory leaks when closing the game
Finally create a draw event for the camera and place this last line of code in it
char is just the name of my player for my game just change thta name to what ever name your player object is called
Code:
d3d_set_projection(char.x,char.y-6.9,350,char.x,char.y-7.2,190,0,0,1)
Now create and object and call it "Wall"

in the create event for your Wall object place this code into a script
Code:
//======================================================
//this fixes the black texture issue in gamemaker studio
//======================================================
draw_set_color(c_white) //required to draw the texture otherwise the box will be black

//======================================================
/textures for block
//======================================================
wall_texture = sprite_get_texture(wall_tex,0);
grass_texture = sprite_get_texture(spr_grass,0);
black_texture = sprite_get_texture(spr_black,0);

//======================================================
//this fixes the 3d opacity issue in gamemaker studio
//======================================================
draw_set_alpha_test(true)
draw_set_alpha_test_ref_value(40)
Lastly create a Draw event in your Wall object and place this code into a script
Code:
if (point_distance(x,y,char.x,char.y)>230) exit; //if outside screen do not draw
else
{
    d3d_set_culling(false);
    //draw the block
    d3d_draw_block(x,y,32,x+32,y+32,-32,wall_texture,1,1);
    //draw the grass above it
    d3d_draw_block(x,y-1,32,x+32,y+1,-32,grass_texture,1,1);

    //=========================================
    //draw black outline
    //=========================================
    d3d_set_culling(true);
    d3d_draw_block(x-1,y-1.5,33.5,x+32.5,y+32.5,-32.5,black_texture,1,1);
}
 
Last edited by a moderator:

chance

predictably random
Forum Staff
Moderator
This is an interesting combination of 2D line drawings overlaid on 3D primitives. Not really sure what the application might be, so maybe you could say more about this. Either way, I suspect some members may have use for it.

Also, I'm curious why you put the 3D primitive drawing inside the d3d_transform_set_identity() block. You aren't performing any transformations, so those aren't necessary. I believe you can toggle the d3d_set_culling() without them.
 
M

modler2

Guest
This is an interesting combination of 2D line drawings overlaid on 3D primitives. Not really sure what the application might be, so maybe you could say more about this. Either way, I suspect some members may have use for it.

Also, I'm curious why you put the 3D primitive drawing inside the d3d_transform_set_identity() block. You aren't performing any transformations, so those aren't necessary. I believe you can toggle the d3d_set_culling() without them.
Totally forgot to remove that from the code, im pulling the code from my wip game thats why. Thanks for the heads up! Also adding this outline if you wanted to you could easily applied a cell shaded baked texture to fake outline+cell shading without the use of a shader.

Its a poor example but this is an old project of mine where i tried to fake it using this:
 
Last edited by a moderator:
Top