By Don Burnett
Editor’s note: this article is a partial recovery of lost content it is one of the most view from the previous site and some of the images were not recoverable. We will make ever effort to restore this popular article as soon as possible.
Creating a Windows Application with a 3D Logo Design (even an animated one) isn’t very difficult if you have the right tools.
This tutorial will introduce us to creating 3D meshes in trueSpace 3D 7.6 (now a Microsoft product) some conversion utilities, and importing the 3D logo mesh into Expression Blend.
Notice I am working in Windows 7 pre-release for this tutorial, however it works great in Vista and Windows XP as well..
So we have opened trueSpace 7.6 this gives us a blank work environment.
The first thing we have to find is the “text” entry tool command which you can see on the eleventh entry in on the bottom horizontal tools palette. If you don’t see it right away click and hold down the 11th item “tool” square and it will pop-up so you can go up to it and select the text tool. It looks like this square below..
Now that it is selected let’s set the font we are going to use. A logo usually has a specific typeface or is a combination of a drawing and type. To change the typeface and size use your right mouse button to click on the TEXT tool item we just found..
Below is the typeface dialog.. I am going to select Pericles Regular 24 for this demonstration. It’s something I have installed and it’s a very visible Greek style of type.
After I have clicked “OK” I can go back to my drawing surface and start to add text. To do this I will need to left-click on the text icon again. This will cause the mouse point to disappear into the 3D surface and become an “I” shaped rod that I can move and click to set down anywhere in the 3D environment. Notice I am also in the “Model” tab in the workspace as well.. So I typed in my logo text “MyBigGreekLogo”..
After I have typed it in I can select and move it by clicking on the tools palette over to the far right that looks like an Arrow Mouse Pointer. If I need to adjust the environment there is also a 3D object in the lower right corner that adjusts the workspace’s view (but not the camera, which we won’t need to do anything with for this for this tutorial).
Next locate the library tab to the right, you’ll notice a Materials-DX9 Palette. This lets you attach and paint a DirectX 9 compatible Material onto your object. But for now we are going to extrude the text in 3D and bevel this into some reasonably decent logo-esque text.
The first thing we need to do while the text is still selected as one object is to find the Sweep tool.. Below you can see it as the fifth item horizontally in the tools palette. You may need to left click on the fifth item and select “SWEEP” as the items pop-up vertically.
It will look like this below..
select “sweep” then go to the 3D and find the “pull” handle on the front of the selected object and pull the selected points on the front face of the logo out. This will extrude the image in 3D. It will look like this below..
Next from the same menu that we selected “sweep” find the Bevel tool and select it.. I will bevel the front faces that we just selected. You don’t have to do anything further with the “bevel” tool. It will look like it should. next select the "mouse pointer” icon from the right palette. Your 3D extruded image should now look like this below..
Our next item is to select the texture we had planned on using a mapping it onto the logo..
So select the blue reflective texture from the library tab’s DX9 Materials palette.. It should be on the third row down, you may have to scroll the listbox to get to it..
After you pick this by clicking on the item the materials editor will pop-up in it’s place..
double click on the “DiffuseColor”
Select red from the color palette selector that pops up..
Click on the FILL ICON in the DX 3D materials editor to fill in the object. The icon should look like this:
Now the 3D object which was “blue” should turn “red” and your vertices should be all a shade of “red”. At this point we could add in animation elements to this and save them, but that only works if we are exporting to .3DS (3D Studio Max) format at this time. If we are exporting as a (.X) or direct X mesh or other formats (including .DXF) they only support still 3D images.
Now the screen should look like this and we are ready to export the 3D logo mesh to our 3d object files for conversion to XAML..
To export I simply find the TS6 Files drop down menu, select “save as..” then select “Object”
Now I have some options, so which format to export to? This really depends on you and the project and whether you need animation or not..
If you don’t I recommend exporting to “direct x” (.X) format. It’s the easiest to deal with and the most transportable of the available choices..
Be aware that whatever format you use, the “Settings” probably will need to be set so your mesh exports properly otherwise you will see strange “artifacts” in your imported 3D. For this demonstration finding the appropriate items might be a little out of the “scope” of what we are showing you how to do and requires some knowledge and 3D background. For now we will just ignore most of the settings, and yes our logo will come out looking a big weird, but it’s up to you to research how to get the proper settings for export, because it will no doubt be different for each logo or objects that you are working with.
If we are exporting to DirectX .x format there is a mesh conversion utility, that you’ll need to get it’s command line based.. It required the managed direct x DLL installed from the latest DirectX SDK developer runtime. You may need to recompile the project to get the utility to work, the 1.1 version worked great last time I tried it.. Note while the export option for direct x (.x) in trueSpace supports animation, the conversion utility outside just supports mesh object conversion at this time.
There is another option for conversion (well besides Electric Rain’s ZAM 3D ,which is a great all purpose 3D animation editing tool for WPF too!) and if there is animation with the logo, this might be a better solution for you..
Let me introduce you to Viewer3ds.. It’s main purpose is viewing and exporting to .3DS format.. To move .3DS format (with animation there is a tool available that’s very inexpensive called View3ds, that also will export your .3DS export to XAML..
To load the export in the lower left corner you click on the load ICON shown below..
After it’s loaded you will immediately see a preview and can select individual parts of the object and can check to see if you got your exporting options right. I obviously didn’t because in the window above the logo is missing some parts in the “O”s and the “B”s..
If you are happy with your export you can click on the EXPORT option which will bring up the Export Dialog..
Here you can export the 3D object as a “Page” or a “Window” which can be imported directly into any Blend WPF project. Or you can export as a “ViewPort3D’ which can be exported to a XAML resource page so the object can be used and reused multiple times in the project. You get the option of saving to a file or copying to the clipboard. One of the neat things about this is that any “embedded” animations in the logo that were exported are still there and available and could be previewed with this tool.. For this demo you should click the “Window” radio button and then click “COPY to clipboard”.
Now you are set with the XAML version of the object to load into your Expression Blend WPF project.. So open Blend and pick “WPF Application”..
Next hit “OK”then open your window1.xaml file and past the XAML from the clipboard that we selected above in the conversion tool from viewer3ds.exe
Select design from the “designer surface” tab in the middle region of the blend screen.. and voila! You have your logo. In my case I need to go back and set those export options correctly..
Technorati Tags: WPF,3D,trueSpace 3D,Microsoft,Mesh,Direct X,3DS wp-graphics.com