Modcraft - The community dedicated to quality WoW modding!

Content creation => Texturing and 2D Art => Tutorials => Topic started by: samgartell on October 29, 2011, 07:10:13 am

Title: [TUTORIAL] Change Login Screen For a Picture
Post by: samgartell on October 29, 2011, 07:10:13 am
Tools Required
BLP Converter
MPQ Editor
(Both inside this package from Eluo's thread http://bit.ly/w2StYU - Mediafire)
Any Picture Editor
(I recommend GIMP 2.6 http://www.gimp.org/ (http://www.gimp.org/" onclick="window.open(this.href);return false;) any should do though)
As pointed out by Sina, some particle effects from the dragon and the rumble still take place, nothing too serious, but just a warning.
How To

To get started, I'm not sure if this has been posted before, if it's old news or anything along those lines. I have no intentions of making a spam post, so if it is un-needed, feel free to just remove it.

OK. Start by finding your image, try to get a high quality image because it WILL lose some quality, by picking a good one now, it will at least be respectable quality later. I picked this [spoiler:2el99kgo](http://oi41.tinypic.com/2jcpz6.jpg)[/spoiler:2el99kgo]

Open that image in your chosen editor, and rescale it to 1024x1024, then make sure to save it as a PNG, any other format will not work in the converter. After saving, drag and drop the PNG file onto the BLP Converter, after doing so, you should notice another file pop up, the same name as your PNG, but with the file format .blp, if you don't right click the blp converter, go to properties, compatibility then tick "Run as administrator", press OK and try the step above, again. Once this is done, rename the new BLP to "WotLK_Login_Citadel01" without quotes.

Now this is done, you can create a new MPQ using MPQ editor and name it anything from Patch-A.MPQ to Patch-Z.MPQ, (1-9 works too) inside it, you want the file tree to look like this

(http://oi43.tinypic.com/2vx54ef.jpg)
Drop "WotLK_Login_Citadel01.blp" into both
"Interface/GLUES/MODELS/UI_MAINMENU/Northrend" and
"Interface/GLUES/MODELS/UI_MainMenu_Northrend"

But, this leaves unwanted effects like snow, the skybowl, and the dragon, we don't want that. So I've done those textures already, making them completely transparent, meaning they won't show up, download them here: http://www.mediafire.com/?e5muxtpt9d0c9hy (http://www.mediafire.com/?e5muxtpt9d0c9hy" onclick="window.open(this.href);return false;) Extract them from the ZIP, and put ALL the folders inside "Tut", inside the root of the MPQ.

With all that done, start up WoW and you should have got something like this:
[spoiler:2el99kgo](http://oi43.tinypic.com/jkhird.jpg)[/spoiler:2el99kgo]

If I've explained something strange or wrong, which looking at the time would not be a surprise at all, just let me know and I'll correct it straight away, whether it be a spelling mistake or something more important.

(My MPQ so you can take a look around and edit it to how you want: http://bit.ly/rFf9Dt (http://bit.ly/rFf9Dt" onclick="window.open(this.href);return false;))
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: Sina on October 29, 2011, 12:53:36 pm
Still got some effects from the dragon, and it looks a little bit strange, as the screen moves ^^

But, nice tut, works really fast and gives a lot of individualization (:


(if this screen-rumbeling and the music could/is changed, it would be extremely nice)



Edit: Could someone who did some more with Loginscreen/Modeling change this plane, so that the quality of the pictures is much better and it doesn't rumble anymore?
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: samgartell on October 29, 2011, 06:56:37 pm
Yeah, should have noted that at the start, this was a fast way of doing it. The particles of the dragon show, I'm almost sure they're hard-coded and the animation is irremovable.

You could try using a low polygon modelling program like Milkshape to create a plane, add a light and textures then convert the OBJ to M2? Not too great with 3D things, but I've seen people using MDLvis a lot recently, you should check that out too if you have the time :)

Edit: The music changing is easy, just get your MP3, rename it to "WotLK_Main_title.mp3" and drop it in a new MPQ with the treepath "Sound/Music/GlueScreenMusic" ;P However this doesn't cover the dragon sounds. I'm still looking for the .wav/.mp3 that controls that.

Edit2: Found them! Sound/Ambience/GlueScreen and the following files
GlueScreenLogin, Wrath_Login_1, Wrath_Login_2, Wrath_Login_3, Wrath_Login_4
All in .wav format tested it by replacing it with a water sound. Goes great with the Zangarmarsh image ;D
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: Sina on October 29, 2011, 08:29:30 pm
:D

You're the Edit-king! :D And epic! ^^

I took a look at MDLvis and also M2 in Blender. Buuut I think, if I start with this now, I won't get Vakara finished xD

I'll try the music now :) Thanks again.
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: samgartell on October 29, 2011, 08:33:51 pm
Haha, good luck with your project, hopefully MDLvis/Blender works out for you, I've heard a lot of people say MDLvis is a very difficult program to use >< Once again, good luck ;P

EDIT: Just noticed something in the Cataclysm files, there's an alternative "Low Bandwidth" model, which consists of what I should think to be a single plane with a picture on it, the model probably needs converting to 3.3.5a, BUT would provide the effect you want :P
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: Sina on October 29, 2011, 09:43:08 pm
Sooo, i made a little package.
Placed in the MPQ it will remove the dragon-sounds and switch the music with some bird-thing and flute.
If you want to take your own music, call your mp3 "WotLK_Main_theme" and place it in Sound/Music/GlueScreenMusic/.
http://[url=http://www.mediafire.com/?dq25x7f5qppk52g" onclick="window.open(this.href);return false;]http://www.mediafire.com/?dq25x7f5qppk52g[/url]


(that's all you told, just a little bit faster :) dragon sounds were changed with silence)
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: samgartell on October 29, 2011, 10:06:11 pm
Quote from: "Sina"
Sooo, i made a little package.
Placed in the MPQ it will remove the dragon-sounds and switch the music with some bird-thing and flute.
If you want to take your own music, call your mp3 "WotLK_Main_theme" and place it in Sound/Music/GlueScreenMusic/.
http://[url=http://www.mediafire.com/?dq25x7f5qppk52g" onclick="window.open(this.href);return false;]http://www.mediafire.com/?dq25x7f5qppk52g[/url]


(that's all you told, just a little bit faster :) dragon sounds were changed with silence)

Nice, thanks will come in handy for those wanting to remove the dragon sound altogether :D Oh and I assumed that everyone had cata and wotlk on their PC's before, so here's the flat plane and the blp that goes with it, I found it under "Interface/Glues/UI_Mainmenu_lowbandwidth" but when I tried to extract the .skin files, MPQ editor crashed so I can only give you the M2 and BLP :P Here: http://www.mediafire.com/?vguh37gb6y6amry (http://www.mediafire.com/?vguh37gb6y6amry" onclick="window.open(this.href);return false;) MPQ Editor (Latest) just isn't working properly with some cata MPQ's (Art.MPQ, etc. basically any that isn't in the enGB folder ><)
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: Sina on October 29, 2011, 10:58:23 pm
Well, I tried to look up the plane, buuut there are lots of planes. ^^

Then I first tryed to remove the dragon (just by moving him up), but M2Mod3 just crashes (it also crashes, as I want to convert the unchanged model :/).
As I try it with the changed it says something about MaxBones, as I try it with the original m2i about Boneweights. Don't really know, what to do with this information ^^

Will work on there another time.
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: schlumpf on October 29, 2011, 11:01:18 pm
You might go easier with editing the XML file describing the UI instead. That would require a GlueXML fix though. With that , you'd just go about and not use the model but display the textures themselves in the interface.
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: Keta on October 30, 2011, 07:39:14 pm
Could you perhaps make a fast tutorial on how that is done Schlumpf? Im sure a lot of people would like to know how that is done :P

Thanks
Keta

PS. LOLOLOLOL! 100th post! ;D
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: samgartell on October 30, 2011, 08:42:30 pm
Quote from: "Keta"
Could you perhaps make a fast tutorial on how that is done Schlumpf? Im sure a lot of people would like to know how that is done :P

Thanks
Keta

Just came here to ask the same thing :) Just need something along the lines of how you'd go about doing it. Thanks :)
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: Supora on November 05, 2011, 09:43:54 am
I've made this only by XML and Lua editing
(http://img822.imageshack.us/img822/8821/wowscrnshot110511114124.jpg)
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: Steff on November 06, 2011, 01:48:28 pm
Just delet the m2 loading layer and add a new grafix layer with your image. All just XML.
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: Avicii on November 08, 2011, 11:53:57 am
Quote from: "Supora"
I've made this only by XML and Lua editing
(http://img822.imageshack.us/img822/8821/wowscrnshot110511114124.jpg)

Quote
Just delet the m2 loading layer and add a new grafix layer with your image. All just XML.

Looks pretty kewl, even though it's supposedly "so easy" ^^

Avicii
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: Sina on November 08, 2011, 04:53:12 pm
I never worked anyhow with XML, don't even really know, what it is. :/

Won't help me until I got the lots of time to spend in learning about it.
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: yubiyoy on November 09, 2011, 02:19:35 pm
Its weird tough cause when i startup wow the picture is zoomed in. Any1 know why?
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: Mordred on November 09, 2011, 04:19:25 pm
I created this with XML and Lua^^

[youtube:6d6uc0wa]http://www.youtube.com/watch?v=CsuYjhf7fZk[/youtube:6d6uc0wa]
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: Sina on November 10, 2011, 03:17:36 pm
Quote from: "yubiyoy"
Its weird tough cause when i startup wow the picture is zoomed in. Any1 know why?

As you do it in the firstpost it is like this because (as far as I got it) you just change one texture of a plane and remove the rest of the textures.

The camera doesn't "look" directly on this plane, so the picture should be zoomed and stretched.


I saw it by taking a smaller picture in hope to get something non-strechted.

(http://imagr.eu/up/4ebbdcc4662f21_Background.jpg)
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: yubiyoy on November 10, 2011, 06:04:57 pm
Oh man i wanna try it :D
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: Supora on November 12, 2011, 10:24:23 am
Quote from: "Mordred"
I created this with XML and Lua^^

[youtube:340n7t3m]http://www.youtube.com/watch?v=CsuYjhf7fZk[/youtube:340n7t3m]
so how you added this three models in different angels?
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: Avicii on November 13, 2011, 03:27:14 am
Quote from: "Supora"
Quote from: "Mordred"
I created this with XML and Lua^^

[youtube:27ygftio]http://www.youtube.com/watch?v=CsuYjhf7fZk[/youtube:27ygftio]
so how you added this three models in different angels?

Looks nice ;) GJ
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: champthomas on January 13, 2012, 09:21:24 pm
Thanks for the tutorial it helped... Now i learned to edit MPQ's.
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: Tristram on February 21, 2012, 12:46:26 am
I'm pretty sure I followed this tutorial step by step, twice.

And my background is appearing red and zoomed wierdly, like this:

(http://i209.photobucket.com/albums/bb72/ProtossHydralisk/screen.png)
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: Shadowjesper1 on March 08, 2012, 01:00:58 am
You possible don't support this.

But can you update small steps (notes) of if this was Cata?

I tried to make this work on Cata, but I got no idea of the names.

 :lol:
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: mambo on May 19, 2013, 10:22:33 am
Can you reupload some downloads please, do not work anymore.

1."But, this leaves unwanted effects like snow, the skybowl, and the dragon, we don't want that. So I've done those textures already, making them completely transparent, meaning they won't show up, download them here: DOWNLOAD... Extract them from the ZIP, and put ALL the folders inside "Tut", inside the root of the MPQ."

2. "(My MPQ so you can take a look around and edit it to how you want:  DOWNLOAD)"
Title: Re: [TUTORIAL] Change Login Screen For a Picture
Post by: samgartell on July 12, 2013, 01:33:35 pm
Quote from: "Shadowjesper1"
You possible don't support this.

But can you update small steps (notes) of if this was Cata?

I tried to make this work on Cata, but I got no idea of the names.

 :lol:

I can't, no. This tutorial is a very weak way to go about this.

Quote from: "mambo"
Can you reupload some downloads please, do not work anymore.

1."But, this leaves unwanted effects like snow, the skybowl, and the dragon, we don't want that. So I've done those textures already, making them completely transparent, meaning they won't show up, download them here: DOWNLOAD... Extract them from the ZIP, and put ALL the folders inside "Tut", inside the root of the MPQ."

2. "(My MPQ so you can take a look around and edit it to how you want:  DOWNLOAD)"

I can't reupload because I don't actually have these files anymore. Rather than following this tutorial, try this one viewtopic.php?f=20&p=10578#p10578 (http://modcraft.io/viewtopic.php?f=20&p=10578#p10578" onclick="window.open(this.href);return false;)
Mordred covers how to do things properly, rather than this way (which two years ago, didn't seem so bad to me.) because honestly, it's awful.