Page 1 of 1

RPC's 3D Graphics Tutorial [Added pics, need texture tut]

Posted: Fri Mar 08, 2013 4:27 am
by RPC
Ok, so the plan is to make a model in Wings 3D and import it into blender for rendering. Photoscape and GIMP (or other similar programs) will be used to create the spritesheet and the mask.
[Note: Right now everything works except for the textures/models bit. Also, I will upload the pictures at a later time.]

Wings 3D
Starweaver's .blend file of awesomeness (shiptemplate.blend)
{In the blend file there are instructions-- they will be reproduced here}
[OPTIONAL] Starweaver's HowtoShotColor.avi (this shows how to make materials)
[OPTIONAL] Steelwing's Blender Rotation code
{There are also instructions for using GIMP, which will be reproduced here}

Zip with SW's .blend file:
(932.39 KiB) Downloaded 231 times
Updated Zip for 120 Facings:
(1.13 MiB) Downloaded 186 times
Here's a list of programs that do stuff:
Wings 3D

3DSMax ??(Avan uses this)
Bryce ??(digdug uses this)

3DSMax ??(Avan uses this)
Bryce ??(digdug uses this)
Kerkythea (for use with Wings, I haven't been able to render more than one at a time)
Yafaray ??(for use with Wings, I wasn't able to use)

sprite sheet:
Ifranview ??(Starweaver uses this)

Ifranview ??(Starweaver uses this)

What does Siafu use?
EDIT* Digdug said Truespace
What does DarthGeek/Shivan Hunter use?

To begin:

Wings 3D

1. Open up Wings 3D
2. Right click and there should be tons of options. The most useful ones are extrude and scale uniform.
1.png (34 KiB) Viewed 5475 times
(Since Wings is very intuitive, and models for ships vary widely, it is suggested to look at some Wings tutorials if you have issues making a model. Alternatively, you can ask here.)
3. Make model.
2.png (42.05 KiB) Viewed 5475 times
4. Once the model is done, export it into the .3DS format.
3.png (37.31 KiB) Viewed 5475 times
Blender (this is blender 2.5/2.6)
1. Open up Blender
2. In Blender, open shiptemplate.blend (or alternatively the 120 facings version. To delete the Kyrios head model, just right click and press 'X'. Delete the model and follow the tutorial.)
4.png (208.17 KiB) Viewed 5475 times
3. This will bring up a premade scene, and there are options to look at some other models.
5b.png (160.33 KiB) Viewed 4764 times
The following instructions are taken from from Starweaver's shiptemplate.blend. The only edits made are the addition of images, and [text in brackets].

Blender 2d Ship Rendering Template
Star Weaver, Jan 2011

Unrelated to but good for use with Transcendence by George Moromisato.

This work is liscensed under CC-3.0-BY

I suggest you not use the sample models for anything as is, espcially not uploading to, as they are colorless and quite unfinished.

You'll need to change this window back to 'properties' by using the menu above, or load it with your own UI, if you want to get anything done.

To use for Trans[c]endence:

Create or append your ship into one of the "x facing setup" scenes.

Parent your ship to the circle named Rot20 or Rot40. It will rotate around the origin so place it accordingly
[Import your ship. You can do this by File => Import => 3D Studio (.3ds)
Remember to make sure that your ship is one object. To do this, select all objects in Wings using the object select (not the facing or edge or point select) and right click. In the menu should be an option called "combine". Combine all objects to form the ship.
6.png (222.1 KiB) Viewed 5475 times
Here you will parent the ship to the black ring.
Right click the ship, and while holding shift, right click on the ring.
Press ctrl P.
Click Object
7.png (246.73 KiB) Viewed 5475 times

Switch into camera view [You can view what the camera sees by right clicking on it and pressing ctrl-numpad 0.], and select the camera. Animate the rotation (alt-a) and move the camera in and out (g-z-z for its own z axis) until the ship is as large as can be but does not clip the borders of the frame.
[Also, make sure to make the drive of the ship level with the Z axis of the circle, otherwise the drive exhaust will not fit- LordoCarrot]

Set the size of the frame in the render properties.
Go to properties
8.png (197.78 KiB) Viewed 5475 times
click render (it's the camera icon)
9.png (170.56 KiB) Viewed 5475 times
change the x/y size under "Resolution" as necessary
10.png (173.47 KiB) Viewed 5475 times
I haven't exp[e]rimented with non-square renders yet.

Render an animation. [The keyboard shortcut is ctrl-F12] This will dump the individual mask and color images into two separate subdirectories.
[You can also change the output directory under "Output"
setting output.png
setting output.png (181.19 KiB) Viewed 4764 times

Stitch the frames together into a colormap and mask for trans[c]endence. If you don't know what to use for that already, I recommend the free Irfanview's 'create panorama image' option in vertical mode.

Remember to convert the mask sheet to grayscale.
Files output by animating the ship are saved to the Colorfacings folder and MaskFacings folder.
Also, extra lighting might be needed to eliminate completely dark spots on the ship. To add lights press shift+a => "add" => "lamp".
Press shift and click on both the new light and the ship. Pressing control +T will point the light to the ship.
Another method is to select the light and do r-r to trackball it around and then g z-z to move along facing and g-Z-Z to move non depth.

You might have to play with light intensity so that ships don't become balls of white.

Ok when I render the 40 facings, Blender gives me a 80x80 pixel picture. Is this intentional?
If you want to change the output size, go to Properties using any of the blue circled buttons.
properties.png (187.29 KiB) Viewed 4764 times
Then, go to render, and scroll down until you see "Dimensions". Click "Dimensions" and you should see "Resolution". Changing the resolution will change the pixel length and pixel width of the output image.
Render.png (168.6 KiB) Viewed 4764 times
resolution size.png
resolution size.png (171.01 KiB) Viewed 4764 times
Textures and Materials
You can watch HowToShotColor.avi for this.[SW didn't okay the release of this yet]


1. Open Photoscape.
2. Select 'Combine'
11.png (121.45 KiB) Viewed 5475 times
3. Navigate to the directory where the images are, and stitch them accordingly.
12.png (144.68 KiB) Viewed 5475 times
4. Save it.

The following instructions are taken from from Steelwing's post here. The only edits made are the addition of images, and [text in brackets].
I just used Photoscape and GIMP to assemble my facings into a spritesheet and generate a mask from that.
Photoscape is dead simple to use. Start it up, click Combine, and save the result.
In GIMP, I opened up my newly generated combined image, then followed this:

1. In the Select menu, click "By Color",
then click in the black area of the spritesheet.
All black area will be selected.
13.png (161.6 KiB) Viewed 5475 times
2. Click the Fill tool.
Set FG color as black and BG as white, then
set options for BG color fill and
fill whole selection.
14.png (153.76 KiB) Viewed 5475 times
Select BG color fill (scroll down to see)
15.png (164.26 KiB) Viewed 5475 times
3. Click in the selected black area, so the background turns solid white.
16.png (189.5 KiB) Viewed 5475 times
4. In the Select menu, click Invert.
Now the areas corresponding to your ship should be selected.
17.png (151.38 KiB) Viewed 5475 times
5. Change Fill options to FG color fill.
Click inside the selected area.
You should now have your ship filled in with black.
18.png (157.73 KiB) Viewed 5475 times
19.png (118.44 KiB) Viewed 5475 times
6. Save to the same file type as your facings.
For those that prefer Paint.NET over GIMP, I'm sure you can do something comparable. I just wasn't able to work out how...
[NOTE: You can also invert the colors in Steelwing's tutorial so that you end up with a black background and white ship.]
[NOTE: When exporting a bitmap in GIMP, check "do not write color space information" under compatibility options.]
IRFANVIEW (credit to PKodon for pointing this out to me)
1. Under the Image menu, select "Create Panorama Image"
2. Set whether Vertical or Horizontal
3. Then pick the files you want to add, in the order you want to add them (or select all you want to add, then re-order before stitching them together).
[OPTIONAL] Steelwing's Blender Rotation code (an alternative way to render, can be used to render ships with an arbitrary number of facings)
There is the rotation code that works for 2.5/2.6 here.

To learn more about animation, it would make sense to modify the original 40 facings file to 120 facings. This will give you more tools to work with as well as being a learning experience for Blender.
Add a new scene using the "+" button at the top.
1.jpg (190.77 KiB) Viewed 4762 times
Make a FULL copy that way we keep the lights and the circle we parent to.
2.jpg (195.81 KiB) Viewed 4762 times
Delete the model by pressing the "x" key and import your own.
3.jpg (192.84 KiB) Viewed 4762 times
Don't forget to parent your model to the circle!
4.jpg (212.42 KiB) Viewed 4762 times
You can also rename your scene so you know which one has the new model.
5.jpg (207.53 KiB) Viewed 4762 times
Keep in mind that you can use the "outliner" editor type to switch between scenes.
6.jpg (217.66 KiB) Viewed 4762 times
At the bottom is where the timeline is.
7.jpg (222.75 KiB) Viewed 4762 times
Change the end frame to 120 (for 120 frames).
8.jpg (212.77 KiB) Viewed 4762 times
RIGHT CLICK on the circle (since that is what is moving and bringing the model along with it).
9.jpg (203.95 KiB) Viewed 4762 times
Next, go to the keyframes in yellow by clicking on the yellow lines in the timeline.
Keyframes are used by blender to know where to move objects to next.
10.jpg (204.93 KiB) Viewed 4762 times
Press ALT-I (I as in Indigo) and remove ALL keyframes. Make sure your cursor is in the blue box, since (for me anyways) the shortcut does not work outside of 3D View.
11.jpg (223.52 KiB) Viewed 4762 times
Next, click rotate,
12.jpg (202.55 KiB) Viewed 4762 times
and press Z to rotate your ship on the right axis.
The lower left of the window should tell you how many degrees you have turned.
13.jpg (182.94 KiB) Viewed 4762 times
We are making four new keyframes at 31, 61, 91, and 121 frames. At frame 31, the ship should be 90 degrees from the original facing, 180 at frame 61, 270 at frame 91 and 360 at frame 121 (that way we get a full rotation but cut off the duplicate frame at 120).
14.jpg (176.29 KiB) Viewed 4762 times
Next, press I (as in Indigo) in the 3D view and add the keyframe as a ROTATION. That way Blender would know to rotate the circle.
15.jpg (219.86 KiB) Viewed 4762 times
Repeat adding the keyframe to frame 61.
16.jpg (174.45 KiB) Viewed 4762 times
Repeat adding the keyframe to frame 91.
17.jpg (185.78 KiB) Viewed 4762 times
Repeat adding the keyframe to frame 121.
18.jpg (216.51 KiB) Viewed 4762 times
If you alt-a right now you should notice that the model actually shows a bit toward the end, making the spritesheet a bit weird.
To fix this, go to the graph editor using the blue button dropdown.
19.jpg (219.82 KiB) Viewed 4762 times
You should see the graph of the movement of the parent object for all three axes. We are only interested in the Z rotation (blue).
20.jpg (206.9 KiB) Viewed 4762 times
Remove the X and Y rotation by clicking on the eyes.
21.jpg (215.83 KiB) Viewed 4762 times
Next, use the "key" button and go to Interpolation Mode > Linear. This will stop the model from slowing down at the end and fix the rotation.

Have fun and good luck! Hopefully you learned something here that would be applicable to making interesting models ;)
22.jpg (230.46 KiB) Viewed 4762 times

*Edit: fixed some stuff to make it easier to read and clarify some more options.'
*Edit2: Added a bit about Irfanview
*Edit3: Added tip from LordoCarrot about engines and drive exhaust.
*Edit4: Highlighted a tl;dr version with red so blender isn't super hard to use and post isn't derpy to read
*Edit5: Added changing resolution and extra tutorial on animation with blender.
*Edit6: Added note about color space information when exporting bitmaps in GIMP
Last edited by RPC on Thu Jul 18, 2013 12:43 pm, edited 5 times in total.

Re: RPC's 3D Graphics Tutorial [WIP]

Posted: Fri Mar 08, 2013 2:33 pm
by digdug
this is really cool!
and all done using free tools ! :D

I can answer 1 question:
What does Siafu use?
AFAIK, 100% Truespace

Re: RPC's 3D Graphics Tutorial [Added pics, need texture tut

Posted: Wed Oct 02, 2013 4:11 am
by RPC
Just posting this to remind myself to add this to the tutorial but you can make a ship from here:

Then you can import model under blender instead of making your own model in Wings 3D. I still need to know how to texture though.

Re: RPC's 3D Graphics Tutorial [Added pics, need texture tut

Posted: Wed Oct 02, 2013 11:27 am
by digdug
for simple textures, you can make them in 2 ways:

- create a blank UV texture using your favourite tool (wings3D or Blender can do this) by generating it from your ship model.
- paint your UV texture areas using photoshop or any other free tool (GIMP for example)
- apply your UV texture using Blender on your model.
Takes time, you have to be good at painting bitmaps, but the results can be awesome.

- just slap a bitmap on the model surface normal (or part of the model) using Blender.
This is what I do, it's faster, but results can be less than optimal.

Re: RPC's 3D Graphics Tutorial [Added pics, need texture tut

Posted: Thu Oct 03, 2013 3:48 am
by RPC
Yeah, I don't know how to add the actual texture in blender yet as well >.< (I guess that's *two* things I need to learn)

Re: RPC's 3D Graphics Tutorial [Added pics, need texture tut

Posted: Wed Jul 30, 2014 5:41 pm
by StealthX051
Can we please have an updated animation to render 120 facing ships.

Re: RPC's 3D Graphics Tutorial [Added pics, need texture tut

Posted: Wed Jul 30, 2014 11:38 pm
by RPC
Ok, adding the 120 facings update, fixing up the tutorial and added a 120 facing pic to show that it does work:
Kyrios Head.jpg
Kyrios Head.jpg (880.53 KiB) Viewed 4768 times

Re: RPC's 3D Graphics Tutorial [Added pics, need texture tut

Posted: Sun May 22, 2016 3:11 pm
by RPC