Tutorial 1 -- Arches
by Will Harrison · in Artist Corner · 03/07/2005 (2:47 pm) · 23 replies
This mini tutorial covers the construction of arch type formations in Cartography Shop (CS). I used CS 4.1 for this tutorial, but I didn't use any special functions such as "carve" and "hollow" so it should doable in the demo version as well.
This screenshot, taken from the Torque Game Engine (TGE), should give you an idea of what we will build here:

1. Okay, let's begin! First step, open CS and in your "Front" viewport drag a rectangle similar to the one in the image below and press "Enter" to create a box primitive with default texturing and depth. This will be the left pillar of our arch portal.

2. Now, create another box primitive just above it. Make sure it is the same same width as the first one.

3. Take the smaller box you just made, copy/paste it four times and position them in an arrangement similar to the one below.

4. Now we are going to rotate the copied boxes to create the arch. To rotate, first select the box and then click it again so that the rotate handles appear (see below).

5. Here is the best way I find to make the rotations. First rotate the top-most piece so that it is 90 degrees vertical. Then rotate the middle piece to be about 45 degrees. Now, rotate the in-between pieces to smooth out the arch shape. Finally, after moving the pieces around a bit, you should have something like this:

6. Okay, carrying on... we now want to make these individual pieces look like one cohesive arch (or rather, half-arch) using the vertex editing mode. First, go to the menu item "Edit --> Select All". The reason we "Select All" is so that all the vertices will show at once, and we don't have to select each brush first before editing its vertices. Now click the "Select Vertex" button from the toolbar menu.
The vertex handles of all the brushes will appear now. Click and drag each vertex so that each corresponding pair share the same grid point (see below).

(Note that the vertices above are on grid points, it's just that, in this shot, the viewport is "zoomed-out", so you can't see that they actually are because the apparent grid resolution changes when you zoom out.)
7. Now, you may find you're having trouble making the arch look proper. If so, try increasing the grid/snap resolution. To do this, press "[" two or three times. Remember, you can go back to the previous grid setting by pressing "]". Continue moving the vertex handles around until you have something looking like the image below. Important note: when moving the vertices of the top-most piece, do not change its overall height. This is so that it keeps the same thickness as the pillar.

Tip: when making fine adjustments to vertices you may find it easier with the viewport set to full-screen. To do this, move your mouse over the viewport you're working in and press "F12", or right-click and select "Full-screen".
(Continued...)
This screenshot, taken from the Torque Game Engine (TGE), should give you an idea of what we will build here:

1. Okay, let's begin! First step, open CS and in your "Front" viewport drag a rectangle similar to the one in the image below and press "Enter" to create a box primitive with default texturing and depth. This will be the left pillar of our arch portal.

2. Now, create another box primitive just above it. Make sure it is the same same width as the first one.

3. Take the smaller box you just made, copy/paste it four times and position them in an arrangement similar to the one below.

4. Now we are going to rotate the copied boxes to create the arch. To rotate, first select the box and then click it again so that the rotate handles appear (see below).

5. Here is the best way I find to make the rotations. First rotate the top-most piece so that it is 90 degrees vertical. Then rotate the middle piece to be about 45 degrees. Now, rotate the in-between pieces to smooth out the arch shape. Finally, after moving the pieces around a bit, you should have something like this:

6. Okay, carrying on... we now want to make these individual pieces look like one cohesive arch (or rather, half-arch) using the vertex editing mode. First, go to the menu item "Edit --> Select All". The reason we "Select All" is so that all the vertices will show at once, and we don't have to select each brush first before editing its vertices. Now click the "Select Vertex" button from the toolbar menu.
The vertex handles of all the brushes will appear now. Click and drag each vertex so that each corresponding pair share the same grid point (see below).
(Note that the vertices above are on grid points, it's just that, in this shot, the viewport is "zoomed-out", so you can't see that they actually are because the apparent grid resolution changes when you zoom out.)
7. Now, you may find you're having trouble making the arch look proper. If so, try increasing the grid/snap resolution. To do this, press "[" two or three times. Remember, you can go back to the previous grid setting by pressing "]". Continue moving the vertex handles around until you have something looking like the image below. Important note: when moving the vertices of the top-most piece, do not change its overall height. This is so that it keeps the same thickness as the pillar.

Tip: when making fine adjustments to vertices you may find it easier with the viewport set to full-screen. To do this, move your mouse over the viewport you're working in and press "F12", or right-click and select "Full-screen".
(Continued...)
#2
(...Continued)
8. In the 3D viewport, we should see somthing like the image below. Note that I have used TGE's "concrete.jpg" texture and also have placed a light above and to the left of the scene. A tip for lighting: go to the light's properties dialogue (press "P" while the light is selected) and increase the "range" of the light to 1000+ to make the light more effective. Also, when you click the "Calculate Lights" button in the toolbar menu, change the "Ambient light color" by adding some blue or yellow to the default color.

Now to create the other half of the arch. To do this, first go back to "Select Object" mode and then click the menu item "Edit --> Select All". Copy/paste this selection and move it off to the right, about where you would expect it to be.

Now click the Mirror button in the toolbar menu.
The default axis to mirror the geometry on should be set to "X". Confirm this and click "OK".
9. We don't need that second top-most piece in the copied set so, select it and press "Delete".

10. Now we want to move the copied set to the left to join up with the original set, but first we have to select those pieces. The easiest way to select all the pieces of the copied set is to go to the 3D viewport and "Ctrl"-click each brush as shown below. I find this to be the best way to make multiple selections because you can quickly click anywhere in the shape (as opposed to the little "X" in the centre or edge of the brush when using the orthographic viewports).

Make some final adjustments here and there (don't forget to use "Select Vertex" mode and to change your snap settings higher or lower as needed) and finally you should see something like this:

Add some detail brushes and play with the lighting to make something more unique-looking.

We have finished making our arch portal! Now export the result to TGE's .dif format and add it to your game. :)
To see how to make arched doorways and windows continue reading this tutorial.
(Continued...)
03/07/2005 (3:19 pm)
Thanks Adam! :)(...Continued)
8. In the 3D viewport, we should see somthing like the image below. Note that I have used TGE's "concrete.jpg" texture and also have placed a light above and to the left of the scene. A tip for lighting: go to the light's properties dialogue (press "P" while the light is selected) and increase the "range" of the light to 1000+ to make the light more effective. Also, when you click the "Calculate Lights" button in the toolbar menu, change the "Ambient light color" by adding some blue or yellow to the default color.

Now to create the other half of the arch. To do this, first go back to "Select Object" mode and then click the menu item "Edit --> Select All". Copy/paste this selection and move it off to the right, about where you would expect it to be.

Now click the Mirror button in the toolbar menu.
The default axis to mirror the geometry on should be set to "X". Confirm this and click "OK".9. We don't need that second top-most piece in the copied set so, select it and press "Delete".

10. Now we want to move the copied set to the left to join up with the original set, but first we have to select those pieces. The easiest way to select all the pieces of the copied set is to go to the 3D viewport and "Ctrl"-click each brush as shown below. I find this to be the best way to make multiple selections because you can quickly click anywhere in the shape (as opposed to the little "X" in the centre or edge of the brush when using the orthographic viewports).

Make some final adjustments here and there (don't forget to use "Select Vertex" mode and to change your snap settings higher or lower as needed) and finally you should see something like this:

Add some detail brushes and play with the lighting to make something more unique-looking.

We have finished making our arch portal! Now export the result to TGE's .dif format and add it to your game. :)
To see how to make arched doorways and windows continue reading this tutorial.
(Continued...)
#3
Of course, arches can also be used in doorways and windows. Certainly, this can be more pleasing to see in a game environment than an ordinary "box"-shaped hole. To do this, we can simply modify the arch portal from the previous section.
Once again, go to "Vertex Select" mode.

Now click and drag the handles on the outer ring to make a rectangular top (see below).

Voila! An arched doorway. For a window, add a box brush to create the base piece as shown to the right here:

Arches galore!


Questions? Comments? Other tutorial ideas? Let me know!
-- Will Harrison
03/07/2005 (3:47 pm)
(...Continued)Of course, arches can also be used in doorways and windows. Certainly, this can be more pleasing to see in a game environment than an ordinary "box"-shaped hole. To do this, we can simply modify the arch portal from the previous section.
Once again, go to "Vertex Select" mode.

Now click and drag the handles on the outer ring to make a rectangular top (see below).

Voila! An arched doorway. For a window, add a box brush to create the base piece as shown to the right here:

Arches galore!


Questions? Comments? Other tutorial ideas? Let me know!
-- Will Harrison
#5
03/07/2005 (8:24 pm)
This is great stuff. Thanks for posting this.
#6
03/08/2005 (7:08 am)
Thanks Will!
#7
I know that in previous .map tutorials I've seen, they recommend using as many axis-aligned faces as possible, so, for example, they would recommend having the segments of the arched doorway be a series of aligned trapezoids, instead of the radial fan you have here (if that's clear).
Is this not recommended with map2dif, or is it still something to consider, or what?
03/08/2005 (8:08 am)
Out of curiosity:I know that in previous .map tutorials I've seen, they recommend using as many axis-aligned faces as possible, so, for example, they would recommend having the segments of the arched doorway be a series of aligned trapezoids, instead of the radial fan you have here (if that's clear).
Is this not recommended with map2dif, or is it still something to consider, or what?
#8
Generally, I would guess, that the axis-aligned approach would be better... perhaps to streamline the BSP process and for faster frustum culling, etc. Not 100% sure about that though.
Thanks for positive feedback everyone. ^_^
03/08/2005 (6:24 pm)
You're probably right. My first approach was to do just that -- make those lines vertical instead of radial... but then I thought the radial look had a better space distribution between the lines... :)Generally, I would guess, that the axis-aligned approach would be better... perhaps to streamline the BSP process and for faster frustum culling, etc. Not 100% sure about that though.
Thanks for positive feedback everyone. ^_^
#9
03/08/2005 (7:06 pm)
Depends on what you want to do with it. The radial approach works well if you want it to look like a stone or masonry arch.
#10
Great tutorial, but how did you make this part: "Add some detail brushes and play with the lighting to make something more unique-looking."
And another question which is puzzling me.. how big are those arches? From what I can tell from the grid the arch is 12 meters tall.. I cannot make objects smaller than 1x1 meter in cartShop.. I suppose I am missing somthing vital...
Can anyone help me?
03/13/2005 (2:30 pm)
HiGreat tutorial, but how did you make this part: "Add some detail brushes and play with the lighting to make something more unique-looking."
And another question which is puzzling me.. how big are those arches? From what I can tell from the grid the arch is 12 meters tall.. I cannot make objects smaller than 1x1 meter in cartShop.. I suppose I am missing somthing vital...
Can anyone help me?
#11
03/13/2005 (2:31 pm)
Ah, forget my stupid question...
#12
The details: for the decorative piece on the front of the keystone there is a box that is squashed (scaled down) and rotated 45 degrees, and also a squashed cone on top of it with the sides set to 4. For the little torch thingys, basically they're all comprised of stretched and rotated boxes.
For the lighting in that shot, all I did was add a second light. However, in the very first screenshot you can see there is a red glow near the torches... that was done by going to the menu Objects-->Torque-->light_omni...
adding a light to the scene and then, to make it glow red, you set the Properties (press "p" while the light is selected) value for "color" to "255 0 0" (Red=255, Green=0, Blue=0).
As for the scale, I didnt pay any attention to it while making that arch... when exported to Torque it's actually quite huge (about 12 meters, like you say)... Normally, 32 units in CS equals about 1 meter in Torque. 32 units is the default setting for the grid snap/square... so to make something smaller than a meter you have to press "[" a couple times (you can go as small as 2 units a grid square). Of course, you can always scale down in Torque anyway :P ...so I don't worry about it.
EDIT -- For more info on scaling in CS/Torque, check this thread.
03/13/2005 (8:51 pm)
Well... I'll answer anyway :)The details: for the decorative piece on the front of the keystone there is a box that is squashed (scaled down) and rotated 45 degrees, and also a squashed cone on top of it with the sides set to 4. For the little torch thingys, basically they're all comprised of stretched and rotated boxes.
For the lighting in that shot, all I did was add a second light. However, in the very first screenshot you can see there is a red glow near the torches... that was done by going to the menu Objects-->Torque-->light_omni...
adding a light to the scene and then, to make it glow red, you set the Properties (press "p" while the light is selected) value for "color" to "255 0 0" (Red=255, Green=0, Blue=0).
As for the scale, I didnt pay any attention to it while making that arch... when exported to Torque it's actually quite huge (about 12 meters, like you say)... Normally, 32 units in CS equals about 1 meter in Torque. 32 units is the default setting for the grid snap/square... so to make something smaller than a meter you have to press "[" a couple times (you can go as small as 2 units a grid square). Of course, you can always scale down in Torque anyway :P ...so I don't worry about it.
EDIT -- For more info on scaling in CS/Torque, check this thread.
#13
Thanks... actually it was only the last bit I refered to at being a stupid question...
And thanks for pointing me at that scaling thread.. very very helpful :)
03/14/2005 (1:14 am)
@WillThanks... actually it was only the last bit I refered to at being a stupid question...
And thanks for pointing me at that scaling thread.. very very helpful :)
#15
I think CS5 will be *the* tool of choice for making Torque interiors... the way its going.
:)
03/16/2005 (11:51 pm)
That's gonna be slick.I think CS5 will be *the* tool of choice for making Torque interiors... the way its going.
:)
#16
03/17/2005 (12:34 am)
---
#17
03/17/2005 (6:03 am)
OMG Major kudos on this! Can it be? An art tutorial I can actually follow from step 1 till the end? The world must be coming to an end!
#18
I like CS cause it's so easy to use and the interface is clean and uncluttered. I just like to see the KIS (keep it simple) desgin mentality used effectively in making tools... that's why I support it. And also, Tom Spilman is doing such a great job of listening to the community and making it work with Torque. The current version of CS is lacking a few nice-to-have features here and there and yet it works great (better than Quark anyway)... so just imagine what CS 5 will be like! :)
@John -- Hehe, thanks for the kudos!
03/17/2005 (10:24 am)
@Jim -- Well... Constructor is looking really good so far. I guess a developer's final choice will come down to price and which one has the most useful features they're looking for. The great thing I see for Constructor is it will be more of a WYSIWYG tool for TSE... with all the shader effects, etc.I like CS cause it's so easy to use and the interface is clean and uncluttered. I just like to see the KIS (keep it simple) desgin mentality used effectively in making tools... that's why I support it. And also, Tom Spilman is doing such a great job of listening to the community and making it work with Torque. The current version of CS is lacking a few nice-to-have features here and there and yet it works great (better than Quark anyway)... so just imagine what CS 5 will be like! :)
@John -- Hehe, thanks for the kudos!
#19
04/09/2005 (3:02 am)
More tuts like this would be great *rubs chin*
#20
yes... definitely... more... more!!!! :)
--Mike
05/25/2005 (8:12 am)
Thanks for the detailed illustrated tutorial Will...yes... definitely... more... more!!!! :)
--Mike
Torque 3D Owner Adam
Adam deGrandis
Im so glad to see someone sharing knowledge through tutorials... especially useful knowledge like this. Keep it up!