Creating 3D sprites and using them in Construct 2

Discussion and feedback on Construct 2

Post » Thu Dec 22, 2011 7:25 pm

Since I cannot search for '3D' to see if there are similar topics I decided to write one myself.

Note that I have been using Construct 2 for less than a week, but have programmed in C++ with Allegro and I hope you won't be mad for my bad English.

The concept

As you all know Construct 2 doesn't support 3D models, so the only way to make a game seem like it's 3D is to generate images of 3D objects and use them as sprites.

Where to start?

First get some 3D Modeling software (I will be using Google SketchUp because it's free, and it has a warehouse where you can find finished models quickly if you're too lazy to do them yourself)

I recommend you use the engineering template if you don't want to color your shadows later in Photoshop (they appear green if you use the standard template)


Creating the sprite

After you have created or opened your model, choose the angle of your game (platform, top-view etc.) I have created a Watch Tower for a tower defense game I'm doing at the moment.



To make it more 3D we will add some shadows (Note: shadows are a bit tricky to work with because of the objects that move on them i.e. if you put your hand on light the shadow of the hand that appears on the ground will be bigger than the shadow that appears on a table, for example)

The shadow properties in Google SketchUp are located under Window>Shadows (Note !important: Remember the date and time of the shadow you're using and use the same settings for all your models!)

After you have created/selected your model, added shadows, you are ready to export it. Click File>Export>2D Graphic... and save it as .png file.

The exported image should look something similar to this ...



Editing in Photoshop

This is the raw sprite we will be using. Now open a photo editing software (I will be using Photoshop in this tutorial). Select the white area (or like in my case the green because I used the standard template) and press delete. Now we made the area around our sprite transparent. Click Select>Inverse and then crop the image. Now we have just the sprite and it's shadow. What we have to do is make the shadow transparent because shadows are transparent. Select the shadow with the Magic wand tool and press ctrl+shift+j. A new layer is created with only the shadow inside. From the layer tab that should be on the right make the opacity about 35% (I think this is about right). Save the image over the old 'raw' sprite with .png extension.

The result should be similar to this ...



Now you can import this sprite in Construct 2 and make great games!

P.S. Make sure that the shadow is not in the collision detection area (?) because objects cannot collide with shadows . This is easily done in the 'edit animations' menu in Construct 2

I hope you liked this tutorial, and again sorry for my bad English.

You can see a live example of the test game at my page.Martin2011-12-22 19:56:23
B
9
S
4
G
5
Posts: 9
Reputation: 3,582

Post » Thu Dec 22, 2011 7:35 pm

Thanks for this, Im constantly doing this ;D I love 3DWarehouse.

You should have put this on the tutorial page though.
B
29
S
12
G
7
Posts: 740
Reputation: 7,849

Post » Thu Dec 22, 2011 7:36 pm

I figured that out after I posted the topic, sorry for that :)
B
9
S
4
G
5
Posts: 9
Reputation: 3,582

Post » Sun Jan 29, 2012 7:26 pm

Thx for your post! I never thought of making 2D-sprites using sketchup, it's simple and looks great! :)
B
6
S
1
G
2
Posts: 17
Reputation: 1,341

Post » Sun Jan 29, 2012 10:18 pm

Been doing this kinda thing for a while. It works well. :)

Yer page doesn't work though.
B
47
S
10
G
6
Posts: 455
Reputation: 8,326

Post » Sun Jan 29, 2012 11:07 pm

Problem is, you need a new sprite for every angle :(
B
90
S
30
G
24
Posts: 3,189
Reputation: 32,400

Post » Mon Jan 30, 2012 12:25 am

[QUOTE=sqiddster] Problem is, you need a new sprite for every angle :([/QUOTE]

Not if your on a Static Screen.. lol..tonycrew2012-01-30 00:25:55
B
40
S
14
G
11
Posts: 243
Reputation: 9,432

Post » Mon Jan 30, 2012 1:18 am

@sqiddster: What do you mean?
B
47
S
10
G
6
Posts: 455
Reputation: 8,326

Post » Mon Jan 30, 2012 11:59 am

I mean that if you want to rotate an object, you need a new sprite for each angle so that the shadows and perspecitve, etc do not look off...
B
90
S
30
G
24
Posts: 3,189
Reputation: 32,400

Post » Sat Feb 18, 2012 3:00 pm

I moved to a better domain, that's why it doesn't work :D
B
9
S
4
G
5
Posts: 9
Reputation: 3,582

Next

Return to Construct 2 General

Who is online

Users browsing this forum: No registered users and 14 guests