HomeUser Control Panel (unavailable in archive)ForumsTutorialsArt GalleryResourcesMaps

Creating an Animated Loading Screen

12-29-2005, 03:11 PM#1
N00byStance
How to create an animated loading screen?

Tools required: Magos' model editor, Notepad, YobGuls' converter

Why Magos' tool? Answer is simple: because it has fast loading screen wizard, and is very comfortable to edit models (relatively, ofc ;)).

Getting started
Once you've run Magos' model editor ("editor" in next parts of tutorial), select "Extras"->"Loading Screen Creator". Select proper texture and click "OK". Now we have a base point we're starting from.

OK, how to make it animated?
Our animation will be based on a TextureAnim. They allow you to create animated texture translation, scaling and rotation on the model surface. As the loading screen model is a simple square, the UV isn't very complex ;)

So, let's begin!
Open Texture manager (under "Windows" menu), select your texture and R-click it. From popup menu select "Edit" command. Check "Wrap Height" and "Wrap Width" checkboxes and close the window. It's necessary for proper working of our textureanim.

Now, open Sequence manager (also under "Windows"). Double-click on "Birth" element. It will open animation property dialog.
1) Change "From:" field value from 1000 to 0.
2) Uncheck "Non looping" box. That will make the animation loop forever.

Now its time to create the proper animation. Open Texture animation manager from Windows menu. R-click on empty list and click "Create New". Double-click on created element.

What animation shall we create? Hmm... Let's make, for example, texture sliding from bottom right corner to upper left corner?

Check "Translation: Animated" box and click on Translation button. Select "Linear" element from Interpolation Type list. That will make our texture slide in constant speed.
Paste following text into main textbox:

Code:
0: { 0, 0, 0 }
2000: { 1, 1, 1 }

That will make our texture sliding. Click OK to confirm.

Open Material manager, double-click the only element on list. Select the layer from layer list and double-click it. Select your TextureAnim from Animated Texture ID list. Click OK to proceed.

Finish
Congrats! It is done! Well, almost. As this tutorial refers to version 1.05 of Magos' tool, we must handle a very unconfortable bug. For some reason, when saving model, editor doesn't assing TextureAnim to a material. We must do it ourselves.

Save your model as a MDL file. Open it with Notepad and find following block:

Code:
Materials 1 {
    Material {
        FullResolution,
        Layer {
            FilterMode None,
            static TextureID 0,
            TwoSided,
            Unshaded,
            Unfogged,
        }
    }
}

Add the "TVertexAnimId 0," line after "Unfogged," one, so it looks like:

Code:
Materials 1 {
    Material {
        FullResolution,
        Layer {
            FilterMode None,
            static TextureID 0,
            TwoSided,
            Unshaded,
            Unfogged,
            TVertexAnimId 0,
        }
    }
}
Save & exit.

Run YobGuls' converter. Point your MDL file and convert it to MDX.

HF
Import your MDX file and proper texture into your map, remembering about giving it right path. Set up your custom loading screen under Scenario->Map loading screen window (check "Imported file" box and point to your MDX file). That's all.
NOTE: The animation will be played AFTER the map loads, when user is asked for pressing any key.

Example model is attached.

Try experimenting at your own, the effects may be more spectacular you can expect!
Attached Files
File type: rarAnimatedLoadingScreen.rar (41.8 KB)
12-29-2005, 03:14 PM#2
Taur
so basically instead of modelling the loadign screen to make it look cool and ... animatedy :P you just use pics and make it sorta like an aniamted gif

but consider this, you have to take several large pictures (if thier small the resolution will look horrible), think of the amount of space it would take up compared to a modelled loading screen.
03-14-2006, 07:13 AM#3
Magos
I made this little test program using various texture/geoset animation techniques:
Attached Files
File type: w3xMagos_AnimatedLoadingScreen_Test.w3x (292.5 KB)
03-14-2006, 12:19 PM#4
Blade.dk
Good tutorial.

There is a huge white shape coming in from the left on your loading screen model, Magos, but I think it looks great.
03-14-2006, 02:34 PM#5
Magos
It's pure white? It should be an image...
03-14-2006, 02:45 PM#6
Blade.dk
Yes, for some reason it shows the marty.blp image part as white here.
Attached Images
File type: pngMagos.png (460.8 KB)
03-14-2006, 02:50 PM#7
Magos
Looking at the background iomage it seems you have a color depth less than 32bit, is this true (or is it just the screenshot)? Might be the cause of it.
03-14-2006, 03:00 PM#8
Blade.dk
Using 32bit color depth normally, but it seems like Warcraft 3 was set to use 16bit color depth. Didn't fix it though. Oddly enough, I can use the texture as, for example, a unit icon and it shows just fine, both in game and in the editor.

Will look at some more settings later.
Attached Images
File type: pngMartyIcon.png (22.7 KB)
03-14-2006, 03:32 PM#9
iNfraNe
I've tried this some time ago and found out that the animation actually starts playing when the screen pops up, but you see it when the loading is done. I tried making the texture fade out when it was done loading, but I guess there is no way to do such a thing?

Might want to include the answer to this, seeing that is I think the most important thing you could do with animated loading screens.
04-08-2006, 12:15 PM#10
Nevan
How i can make the magos example effect (the frame)?
Tnx in advance
05-03-2006, 11:54 AM#11
PerfectlyInsane
Quote:
Originally Posted by Magos
I made this little test program using various texture/geoset animation techniques:

OMG... thats pretty good.. I just dont know how you did it without making the image stretch at the side.. I'll take a look at the MDL but I probably wont figure it out..

Could you make a more comprehensive tutorial please.. on each of the animations..

My current animated loading screen are just trees moving up and down the ground is shaking as dino is near. (it took me almost 1 hour to do following a noobstance tutorial several months ago.

Which I thought was adequate. After I saw the wonders you could do.. I want to upgrade it now.


and this is what I want.. lol dont laugh I'd have the proper images when I attempt to do it.. Basically the 2 figures will bob up and down quickly as they are running.. and trees are whoosing by...

And there would be grass at the bottom will also be moving.



ANy help will be great.. I'll give good rep.. and credit in my map.
Attached Files
File type: w3xMyloadingscreen.w3x (136.5 KB)
06-11-2006, 02:44 AM#12
PerfectlyInsane
K so far so good.. got a few issues.. now.. with transparecies, etc.. and scaling
Attached Files
File type: w3xMagos_AnimatedLoadingScreen_Test.w3x (169.4 KB)
06-15-2006, 11:09 AM#13
Peewi
This tutorial is really good, but I can't figure out how to make rotations. Could anyone help me with how to do that?
06-15-2006, 03:53 PM#14
N00byStance
Whoah, I had long break from wc3c (and most Warcraft 3)... Didn't expect this topic to grow to these sizes, when it dead near New Year :P I see nice discussion here ^^ I'm happy you like my idea :]

@Peewi, isn't it included in Magos' test map? (suggestion)
06-21-2006, 09:32 AM#15
PerfectlyInsane
I attempted making a loading screen from scratch using a flat plane in
3dsmax.. and animating it.. obviously it doesnt work like that.