by date
TorqueX Newbie Diary #5
TorqueX Newbie Diary #5
| Name: | David Everhart | |
|---|---|---|
| Date Posted: | Jan 07, 2008 | |
| Rating: |  4.0 out of 5 | |
| Public: | YES | |
| Comments: | YES | |
| RSS Feed: |  or Subscribe with  . | |
| Profile Page: | View profile page for David Everhart |
Blog post
Well, I had a real long post written out, going into some pretty low level detail, but it seems this site has eaten that blog.... This time I will save off my post. Nonetheless, below is a screenshot of the start of my starting area, Ruston Post. It has only been 1.5 months since I started working from ground zero (literally), so be gentle!
The tiles are done in WorldCreator 2.5, and the character is done in Poser 7. I have got the import process from WorldCreator to TGBX down pretty tightly. I had some problems initially though. TGBX seemed to want to keep displaying a thin border around all my transparent PNGs. I finally discovered that I needed to:
1) Save the WorldCreator files to a transparent gif
2) In adobe photoshop, convert it to RGB mode
3) Layer->Matting->Remove White Matte
4) Layer->Matting-> Remove Black Matte
5) Layer->Matting->Defringe (I used 2 pixels).
6) Save as web for a transparent PNG-24
I have to do this process for each tile, so TGBX wont render a border around the transparent png. So far it seems to work, as the screenshot above shows. Another issue I ran into was that the default tilemap object does not work too well with truly 2:1 isometric tiles. You can generate a top down 2D tile, then rotate the tilemap object 60 degrees, but the look is definitely not isometric (think that is called trimetric, not sure). I ended up placing them as static sprites, at layer 30. If it becomes a performance issue, I will write my own isometric tiling system in XNA.
I am amazed at the power WorldCreator has. It uses masks, which are color coded, and can render in top 2, isometric floor, isometric walls, etc. Once I figured out how to work in it, and then how to export from it to TGBX, creating new content for Arillian became not only feasible, but fairly painless. In the screenshot above, I have a dirt road tile, a grass tile, a tower item, and an archway. Each of them took less than a minute roughly to create, but it was the export into TGBX that was holding me up. With that out of the way, my environment creation pipeline should be much more efficient!
The character was done using Poser 7.0. I am using the Michael 3.0 Base, with muscular body morphs, and the honor bound light armor set. In Arillian, there are three types of armor, light, medium, and heavy. Each type has several visual styles, and the one above is a light armor. Although you cant see it above in the screenshot, he is doing an idle animation, and I rendered out the animation from Poser 7.0 as 10 frames.
The character you see above is the final product of an AnimationConfiguration being processed. The AnimationConfiguration class contains a List<AnimationLayer>. Each AnimationLayer contains how many frames it needs, and attirbutes which help it to get the frames from where they are stored locally. The character above uses an AnimationConfiguration with 4 AnimationLayers. In my testing, I manually create the layers, though in reality the generation of the animation layer will be handled automatically.
From this, I can generate the path as data/globals/character/human/male/LITTNHTHSO. Since there are 10 frames and the format is png, it will get data/globals/character/human/male/LITTNHTHSO_1.png to data/globals/character/human/male/LITTNHTHSO_10.png. It then creates a horizontal strip out of the frames. Here is the full code to render the character above:
Thats a lot of code, but once its tied into the player, it will be autogenerated. For now, I typed it out for testing purposes. There is a lot going on there, but the total time from scratch is around 250 milliseconds. My initial cache testing showed under 100 milliseconds, but I am still testing that.
This is the test drawing code:
I have also been studying and learning 3DSMax, and bought the 3dsMax official learning guide book. I am roughly halfway through it, there is a lot to learn. I am continuing to learn it because although Poser 7.0 is powerful, I may need the raw power of 3dsmax to do what I need at times. The fact they did all the animations and design for the barbarian in Diablo 2 in 3ds max tells me it is very powerful in that regard. Ahh well, so much to learn, and much more to do. Next update, I hope to have the starting area completed, and character movement working (along with the walking animation). Until Then!
The tiles are done in WorldCreator 2.5, and the character is done in Poser 7. I have got the import process from WorldCreator to TGBX down pretty tightly. I had some problems initially though. TGBX seemed to want to keep displaying a thin border around all my transparent PNGs. I finally discovered that I needed to:
1) Save the WorldCreator files to a transparent gif
2) In adobe photoshop, convert it to RGB mode
3) Layer->Matting->Remove White Matte
4) Layer->Matting-> Remove Black Matte
5) Layer->Matting->Defringe (I used 2 pixels).
6) Save as web for a transparent PNG-24
I have to do this process for each tile, so TGBX wont render a border around the transparent png. So far it seems to work, as the screenshot above shows. Another issue I ran into was that the default tilemap object does not work too well with truly 2:1 isometric tiles. You can generate a top down 2D tile, then rotate the tilemap object 60 degrees, but the look is definitely not isometric (think that is called trimetric, not sure). I ended up placing them as static sprites, at layer 30. If it becomes a performance issue, I will write my own isometric tiling system in XNA.
I am amazed at the power WorldCreator has. It uses masks, which are color coded, and can render in top 2, isometric floor, isometric walls, etc. Once I figured out how to work in it, and then how to export from it to TGBX, creating new content for Arillian became not only feasible, but fairly painless. In the screenshot above, I have a dirt road tile, a grass tile, a tower item, and an archway. Each of them took less than a minute roughly to create, but it was the export into TGBX that was holding me up. With that out of the way, my environment creation pipeline should be much more efficient!
The character was done using Poser 7.0. I am using the Michael 3.0 Base, with muscular body morphs, and the honor bound light armor set. In Arillian, there are three types of armor, light, medium, and heavy. Each type has several visual styles, and the one above is a light armor. Although you cant see it above in the screenshot, he is doing an idle animation, and I rendered out the animation from Poser 7.0 as 10 frames.
The character you see above is the final product of an AnimationConfiguration being processed. The AnimationConfiguration class contains a List<AnimationLayer>. Each AnimationLayer contains how many frames it needs, and attirbutes which help it to get the frames from where they are stored locally. The character above uses an AnimationConfiguration with 4 AnimationLayers. In my testing, I manually create the layers, though in reality the generation of the animation layer will be handled automatically.
AnimationConfiguration newConfiguration = new AnimationConfiguration();
newConfiguration.T2DAnimationDataTemplate = Enumeration.T2DAnimationDataTemplate.DefaultCharacter;
newConfiguration.ID=1;
AnimationLayer headLayer = new AnimationLayer();
headLayer.AnimationType = Enumeration.AnimationType.Character;
headLayer.Race =Enumeration.Race.Human;
headLayer.Gender = Enumeration.Gender.Male;
headLayer.AnimationLayerType = Enumeration.AnimationLayerType.Head;
headLayer.ItemToken = "LIT";
headLayer.Mode = Enumeration.Mode.TownNeutral;
headLayer.WeaponClass = Enumeration.WeaponClass.HandToHand;
headLayer.Direction = Enumeration.Direction.South;
headLayer.FrameCount = 10;
headLayer.FormatOfImage = ImageFormat.Png;
headLayer.Sort = 2;
newConfiguration.AnimationLayers.Add(headLayer);
From this, I can generate the path as data/globals/character/human/male/LITTNHTHSO. Since there are 10 frames and the format is png, it will get data/globals/character/human/male/LITTNHTHSO_1.png to data/globals/character/human/male/LITTNHTHSO_10.png. It then creates a horizontal strip out of the frames. Here is the full code to render the character above:
public static void CreateAnimation()
{
AnimationConfiguration newConfiguration = new AnimationConfiguration();
newConfiguration.T2DAnimationDataTemplate = Enumeration.T2DAnimationDataTemplate.DefaultCharacter;
newConfiguration.ID=1;
AnimationLayer headLayer = new AnimationLayer();
headLayer.AnimationType = Enumeration.AnimationType.Character;
headLayer.Race =Enumeration.Race.Human;
headLayer.Gender = Enumeration.Gender.Male;
headLayer.AnimationLayerType = Enumeration.AnimationLayerType.Head;
headLayer.ItemToken = "LIT";
headLayer.Mode = Enumeration.Mode.TownNeutral;
headLayer.WeaponClass = Enumeration.WeaponClass.HandToHand;
headLayer.Direction = Enumeration.Direction.South;
headLayer.FrameCount = 10;
headLayer.FormatOfImage = ImageFormat.Png;
headLayer.Sort = 2;
newConfiguration.AnimationLayers.Add(headLayer);
AnimationLayer torsoLayer = new AnimationLayer();
torsoLayer.AnimationType = Enumeration.AnimationType.Character;
torsoLayer.Race = Enumeration.Race.Human;
torsoLayer.Gender = Enumeration.Gender.Male;
torsoLayer.AnimationLayerType = Enumeration.AnimationLayerType.Torso;
torsoLayer.ItemToken = "LT1";
torsoLayer.Mode = Enumeration.Mode.TownNeutral;
torsoLayer.WeaponClass = Enumeration.WeaponClass.HandToHand;
torsoLayer.Direction = Enumeration.Direction.South;
torsoLayer.FrameCount = 10;
torsoLayer.FormatOfImage = ImageFormat.Png;
torsoLayer.Sort = 1;
newConfiguration.AnimationLayers.Add(torsoLayer);
AnimationLayer leftHandLayer = new AnimationLayer();
leftHandLayer.AnimationType = Enumeration.AnimationType.Character;
leftHandLayer.Race = Enumeration.Race.Human;
leftHandLayer.Gender = Enumeration.Gender.Male;
leftHandLayer.AnimationLayerType = Enumeration.AnimationLayerType.LeftHand;
leftHandLayer.ItemToken = "LIT";
leftHandLayer.Mode = Enumeration.Mode.TownNeutral;
leftHandLayer.WeaponClass = Enumeration.WeaponClass.HandToHand;
leftHandLayer.Direction = Enumeration.Direction.South;
leftHandLayer.FrameCount = 10;
leftHandLayer.FormatOfImage = ImageFormat.Png;
leftHandLayer.Sort = 1;
newConfiguration.AnimationLayers.Add(leftHandLayer);
AnimationLayer rightHandLayer = new AnimationLayer();
rightHandLayer.AnimationType = Enumeration.AnimationType.Character;
rightHandLayer.Race = Enumeration.Race.Human;
rightHandLayer.Gender = Enumeration.Gender.Male;
rightHandLayer.AnimationLayerType = Enumeration.AnimationLayerType.RightHand;
rightHandLayer.ItemToken = "LIT";
rightHandLayer.Mode = Enumeration.Mode.TownNeutral;
rightHandLayer.WeaponClass = Enumeration.WeaponClass.HandToHand;
rightHandLayer.Direction = Enumeration.Direction.South;
rightHandLayer.FrameCount = 10;
rightHandLayer.FormatOfImage = ImageFormat.Png;
rightHandLayer.Sort = 1;
newConfiguration.AnimationLayers.Add(rightHandLayer);
AnimationManager.Instance.AnimationConfigurations.Add(newConfiguration);
DateTime startTime = DateTime.Now;
Console.WriteLine("CreateAnimation StartTime is " + startTime.ToLongTimeString());
DrawAnimationConfiguration(1, new Microsoft.Xna.Framework.Vector2(4, 10));
DateTime endTime = DateTime.Now;
Console.WriteLine(" CreateAnimation End Time is " + endTime.ToLongTimeString());
TimeSpan timeToRun = endTime.Subtract(startTime);
Console.WriteLine("CreateAnimation Time to run is " + timeToRun.TotalMilliseconds.ToString());
}
Thats a lot of code, but once its tied into the player, it will be autogenerated. For now, I typed it out for testing purposes. There is a lot going on there, but the total time from scratch is around 250 milliseconds. My initial cache testing showed under 100 milliseconds, but I am still testing that.
This is the test drawing code:
public static void DrawAnimationConfiguration(int configurationID, Vector2 position)
{
AnimationConfiguration newAnimationConfiguration = AnimationManager.Instance.AnimationConfigurations.Find(delegate(AnimationConfiguration animationConfiguration) { return animationConfiguration.ID == configurationID; });
T2DAnimationData testData = AnimationManager.Instance.CreateT2DAnimationData(newAnimationConfiguration, ImageFormat.Png);
// setup our animation sprite
T2DAnimatedSprite newSprite = new T2DAnimatedSprite(testData);
newSprite.Position = position;
newSprite.Folder = TorqueObjectDatabase.Instance.CurrentFolder;
newSprite.Visible = true;
newSprite.Layer = 0;
newSprite.Name = "test" + configurationID.ToString();
newSprite.Size = new Vector2(20);
// this is for test purposes
//newSprite.OnFrameChange = delegate(int frame) { Console.WriteLine(frame.ToString());};
if (newSprite.IsRegistered)
{
TorqueObjectDatabase.Instance.Unregister(newSprite);
}
TorqueObjectDatabase.Instance.Register(newSprite);
newSprite.PlayAnimation();
}
I have also been studying and learning 3DSMax, and bought the 3dsMax official learning guide book. I am roughly halfway through it, there is a lot to learn. I am continuing to learn it because although Poser 7.0 is powerful, I may need the raw power of 3dsmax to do what I need at times. The fact they did all the animations and design for the barbarian in Diablo 2 in 3ds max tells me it is very powerful in that regard. Ahh well, so much to learn, and much more to do. Next update, I hope to have the starting area completed, and character movement working (along with the walking animation). Until Then!
Recent Blog Posts
| List: | 09/03/08 - TorqueX 3D Hiding Meshes Part 2 07/09/08 - TorqueX - First Stab at Hiding Mesh Resource 06/22/08 - Journey Into 3D 01/28/08 - TorqueX Newbie Diary #6 01/07/08 - TorqueX Newbie Diary #5 12/12/07 - TorqueX Newbie Diary #4 12/07/07 - TorqueX Newbie Diary #3 12/01/07 - TorqueX Newbie Diary #2 |
|---|
Submit your own resources!| Rex (Jan 07, 2008 at 16:07 GMT) |
POSER has some odd weighting/deformation math...weighting is done in strange method, but easy once you get the caveats under control. I'd rather it parse out[doesn't...very well], but it's a very 'robust' set of math, needing a differing set of tuples to add into the equation, producing nice results in POSER's UI.
Good luck with POSER!
| David Montgomery-Blake (Jan 07, 2008 at 16:38 GMT) |
He said he rendered out the animation from Poser, which is an EXCELLENT use for it in gaming. But you're right on the mesh issue.
| Chip Lambert (Jan 07, 2008 at 16:50 GMT) Resource Rating: 5 |
I'm going to start looking more at TorqueX for a project I have and its going to be isometric. How hard was it to get the isometric, any additional details on doing isometric would be greatful :)
| David Everhart (Jan 07, 2008 at 16:59 GMT) |
| David Everhart (Jan 07, 2008 at 18:19 GMT) |
Hi Chip! One of the big things for me was getting the 2:1 aspect going (one pixel up, 2 pixels over) in the artwork. I found WorldCreator which renders it exactly in that format. I am absolutely impressed with WorldCreator, you can create an isometric world with ease with it. Check out this photo gallery of some of the stuff it can do(sometimes their site is down):
WorldCreator Photo Gallery
Once you use it, and begin creating tiles, getting it into TGBX took some work, but as outlined above, you can go through that process and get WorldCreator isometric artwork into TGBX fairly painlessly. Hmm, come to think of it, maybe I should write up a tutorial on using WorldCreator and TGBX together.
The character in Poser 7.0 required me to adjust the camera. I wanted a camera with no perspective, and it can be done. I use the front camera, then xrotate my character (and lights) by 45 degrees, then just rotate around the yaxis for the various directions.
TorqueX can definitely be used for an isometric game, it has a lot of game management peices that make developing in it pretty easy. I have not really seen a lot of isometric games coming out of Torque in general, but know there are a few. The big advantage for me of course was it was based on XNA (which I was learning) and that the tutorials and starter game templates helped me to really see the different ways a game could be put together. I tend to use my own game peices (such as my animation creation system), and delve into the TorqueX framework as needed (such as using the T2dAnimationData and T2DAnimatedSprite).
| Andy Hawkins (Jan 07, 2008 at 22:47 GMT) |
| David Everhart (Jan 08, 2008 at 00:58 GMT) |
Hiyas Andy! WorldCreator is in itself not a game engine, it exists soley to create 2d artwork. The way it creates it is unique. Check out the picture below:
If you notice the little box with mask x:79 y:126, that is a mask, in effect a template. The colors correspond to one of the 6 colored boxes on the top right. It takes the textures , paints them, then based upon your render mode generates it in the target window. You can then drag and drop it into the world viewer (shown on the bottom left). It is true isometrc 2:1. I can save the tile with the save button on the target window to a transparent gif, then go through my above process in my blog and import it into TGBX as a material.
The benefit of WorldCreator is it allows you to create isometric (or top down 2d, psuedo 3d) 2d artwork fairly effortlessly. You could become a pixel artist and draw these sure, but this tool just makes that job much simpler. The use of the masks is pretty intuitive, you can create running water, and do some pretty impressive feats, which you can then import into TGBX. Personally, I loved the isometric look ever since I saw Diablo, then UO. Probably just nostalgia on my part :)
Edited on Jan 08, 2008 01:00 GMT
| Joe Rossi (Jan 08, 2008 at 04:15 GMT) |
I tried the free version a long time ago and it was pretty cool. I'd like to check out 2.5 if I can somehow manage to get to it. I'm looking into tools for my latest project and this seems like it could help a lot.
| David Everhart (Jan 08, 2008 at 05:41 GMT) |
| Dustin Sims (Jan 09, 2008 at 02:52 GMT) |
You must be a member and be logged in to either append comments or rate this resource.
