|
|
|
|
|
|
|
|
|
 Posted: Sun Aug 26, 2007 9:45 am
Welcome. This is my first thread to help others build their own Shoutbox or Shoutmap in exactly 20 Steps. First, here's some Q&A for the people new to this:
Q: What's a Shoutbox/Shoutmap?
A: A Shoutbox is a little box thing made for leaving Gaians miniature messages. Like a chatroom of sorts. A Shoutmap is the exact same thing, only with clickable images, similar to an Imagemap.
Q: What's a Station Shoutbox/Shoutmap?
A: Those are specially made for New Profiles, and have buttons for Trades, PM's, and Adding to Friends or Ignored. In this tutorial, I'll show you how so.
Q: Wouldn't this put Shoutbox/Imagemap/Shoutmap shops out of business?
A: I'm not sure, really. This is for people who can't pay the high prices of a Shoutbox/Imagemap/Shoutmap. And you need some programs to help make them as well. Plus, I use GaiaTools to host them, while the shops pro'lly have their own servers to host them.
Q: What do you need to make one of these?
A: Simple. You need the following:
An image editing program. The most popular is Photoshop, but I use the GIMP for coloring purposes, which you'll see later on. You'll also need Paint (which all Windows users have) to build the 'skeleton,' or the frame and looks of the Shoutmap. You'll also need time, and creativity. The Shoutmap I used for this demo is for no one else to steal or copy. In fact, I'll be giving it to someone as a gift here on Gaia. And the final thing you need is a GaiaTools account. They're quite spiffy, and they have GaiArch, which is what I use for posting every time on Gaia. But I digress.
Q: If I can't make my own, can you make one for me?
A: Yes, I can. I can make you a Shoutbox/Shoutmap image for the mere price of 1k. Cheap compared to other shops, but ORDER BY PM. Thanks. :3 Also, lessons and help for setting up the regions is free, so don't worry. I'm always there to help. But you MUST give credit where credit is due, or I will report you for plagiarism.
Q: Can I use it for my Sig?
A: Go right ahead. I use mine, however, as a Station Shoutmap/Shoutbox. But I'm content with a Shoutbox rather than a Shoutmap.
Now then, onto the Tutorial!
...In the next post! sweatdrop
(Meaning no posting until I say I'm finished!)
Also, a post from WindPowa, the owner of GaiaTools, where you'll be hosting your Shoutbox/Shoutmap.
WindPowa I have seen so many tektek.org guides, it makes me warm and fuzzy inside to see a guide about my site (outside of the GaiaTools guild) for once. crying heart However, I wonder how you managed to write that guide, as the site was down at the time. sweatdrop You wrote it before ? Also, I think this thread should be moved to the Gaia Guides and Resources forum. (I think...) And please note that you can't sell GaiaTools soutboxes/shoutmaps, though you can freely sell graphics for them. And yay GaiArch. <3 Last but not least, there's a video tutorial here (though it doesn't cover mapping).
|
 |
|
|
|
|
|
|
|
|
|
|
|
|
|
Posted: Sun Aug 26, 2007 9:46 am
Now then, let's begin!
Step 1
Make a skeleton by making some squares, or rounded-corner square things (forgot the name) in Paint. I added a little touch by giving it a Xemnas picture and a title with Buttons. You'll see what they're for later on. Save it and then title it. I titled it as "Xemnas Shoutbox," even though it's gonna be a map. Whatever. Also, remember to save it as a PNG; you want all the images in there to have high quality, right? Right.
Step 2
Open up your image editing program (Photoshop or GIMP, but the latter is what I'm using). This should be simple enough.
Step 3
Give your Shoutbox an alpha channel (Layer > Transparency > Add Alpha Channel). Despite its name, it actually layers a background of transparency behind the white background.
Step 4
In the GIMP, use Select Continuous Regions and click everywhere that you will 'clear out,' as seen in the image.
Step 5
Click Clear (Edit > Clear or Ctrl+K) and now, if you did everything right, you should have what is seen in thr picture of Step 5. Click any of the other things next to the SCR button (like Select Hand-Drawn Regions) and click anywhere except where the dotted lines are.
Step 6
Now use that Wand thing again and click where you want to color your first region. Use the Bucket Fill option, and don't worry: it'll only color what's inside the dotted lines. Once you're done there, use SH-DR and click outside the dotted line area.
Step 7
If you did everything right, you should now have what is in the current picture. You can change the transparencies of the colors and fills, which is great if you like those kinds of glass effects. Do the same with the other two areas: use patterns or colors, it doesn't matter, really.
Step 8
If you wanted a Shoutbox, skip these steps until I say stop. But if you're doing a ShoutMAP, then continue to follow my steps through here. Click the areas of the buttons where they have transparencies and color them in the same way you did with the Boxes.
Step 9
Check your work for anything amiss or just plain messed up. The buttons I made are colored dark gray, which you can't see, but it's there nonetheless. Once you think you're ready, let's save that work and get to the Internet, shall we?
Step 10
For those of you from Step 8, you are now directly here. For those who followed through completely, congrats. Now, let's keep moving.
In order to do the next steps, register for a GaiaTools account. It's easy, really. If you have one, skip this and let's move on.
Step 11
Now that we're here at GaiaTools, go to the Control Panel of your Shoutmap/Shoutbox and either click Upload or go to the drop-down menu and click Custom. Either takes you to a window where you can upload your Shoutbox or Shoutmap.
Step 12
Now that we're here, choose the regions where you want the Comment text and the custom messages to appear. Blue is for the comment messages and green is for the custom messages.
Step 13
Now look at this image. If you had a Shoutbox before, then it should look like this, with comments in the larger area and custom text in the smaller. If you did it right, let's mov3 on. If you f*cked up, go back and fix it.
Step 14
NOW this is something for the Shoutmap makers. Shoutbox makers, skip until I say stop. For the rest, let's keep moving. Under Shoutbox Base should be Shoutbox Map, where you will be setting up Regions. What are they? Let see how far THIS rabbit hole goes.**Look, some jokes die hard, okay?Step 15
You should now be here. Click where the red arrow points, and continue.
Step 16
Now do the same thing you did to add the regions for the Shoutbox/map comments and text boxes. The lower arrow points to a URL box. This is where it will become a bona fide Shoutmap.
Step 17
Go to your Profile and click Add Friend/Ignored and grab the URL of it. This way, when the image of the Add button is clicked, it'll direct you --and everyone else who clicks-- to there.
Step 18
Now take that URL and paste it into the URL box. When it's there, check to make sure that the URL corresponds to the image. You don't want to click the PM button only to lead you to the Trades, right? Right. Do the same with the other two images until you have enough regions.
Step 19
Exciting, isn't it? You're almost done, too. Now then, from the people at Step 14, stop skipping. Save your preferences and then grab the BBcode seen being pointed at by the red arrow. Now you have two options: put it in your sig and hope that the size doesn't get the attention of the Mods, or put it in your Profile. It's a great substitute for the Comments box, and the other boxes if you made it a Shoutmap.
Step 20
Now go to your New Profile and click Text, pointed out by the red arrow. Paste the URL, and drag it anywhere you like on the Profile.
Hooray, you're done!
And from all this, you started with a simple Paint image. Congratulations, you're now the proud owner of a Shoutmap/Shoutbox!
Now then, if there are any other questions you want to ask, or need further help, PM me any time at all. If you liked this tutorial, comment me in my own Shoutbox or post here.
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Posted: Sun Aug 26, 2007 9:49 am
Originally Posted by: Penn Almasy
The N00b Ignorance Prevention Guild takes no credit for the creation of the above guide. If at any time, the author wishes it to be removed, please PM a guild crew member and it will be promptly deleted.
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
