Graal Forums

Graal Forums (https://forums.graalonline.com/forums/index.php)
-   Graphic Design (https://forums.graalonline.com/forums/forumdisplay.php?f=9)
-   -   How-to Set Transparencies and Color Depth (https://forums.graalonline.com/forums/showthread.php?t=134262852)

fowlplay4 04-16-2011 09:34 PM

How-to Set Transparencies and Color Depth
 
Alright I know there's another guide like this but it uses Animagic and that just seems too overkill to me for a simple process.

There's also a way to do it with gif2mng.exe but I don't find that nearly as user-friendly as Irfanview nor do I like the lack of control.

This process applies to all images, not just heads. To keep things simple I use a head image in my tutorial.

Alternate Programs:

Adobe Fireworks Users can read cbk's post for a small how-to.
Paint.NET Users can read Soala's post for a small how-to.

Requirements:
1. Download and Install Irfanview (1.5 MB)
http://www.irfanview.ca/main_download_engl.htm
2. An image you want to trans and use on Graal.

Preparing the Image:
3. Set the background to a unique color that differs from your image.

http://img685.imageshack.us/img685/3...ppreparing.png

MS Paint automatically sets the bit-depth to 24-bit and removes any transparency.

Fixing the Color Depth:
Note: If your image is a GIF, it's already 8 Bit or Lower! Also the Graal Client does support 24-bit PNG images but the GraalEditor does not. If decreasing the color depth messed up your tilesets colors I would recommend just making a 8-bit version for off-line use.

4. Open the image with/in Irfanview
5. Set the bit-depth to 256 Colors / 8 Bit.

http://img850.imageshack.us/img850/8...easecolors.png

6. To verify that the colors were decreased, you should see 8 BPP on the information pane.

http://img822.imageshack.us/img822/2...sdecreased.png

Setting the Transparency:
7. Click the 'Floopy Disk' Icon or go File / Save As
8. Set the Save As Type to PNG if it's not already.
9. Make sure the Show options dialog is checked. This will make the PNG/PNM/ICO save options dialog appear.
10. Make sure the Save Transparent Color is checked. If it's not you won't be able to save the transparency.

http://img706.imageshack.us/img706/4...psaveimage.png

11. Now click the color you want to make transparent. In my example it's the pink background.

http://img39.imageshack.us/img39/3676/stepsavetrans.png

12. The image is now transparent. You can verify it's transparency by viewing it Windows Image Previewer or even re-opening the file in Irfanview.

http://img812.imageshack.us/img812/1106/stepsuccess.png

Congratulations
You can now use the image in the Graal Editor/Shop and online!

If you're having issues with body sprites I would recommend reading this guide: [Tutorial] How to create and save bodies

Savvy Users: In the Graal folder you'll find gif2mng if you've installed the developer tools. Through command you can fix body image by using: gif2mng -b yourbodyimage.png

Crono 04-16-2011 09:38 PM

;) thx

Unkownsoldier 04-16-2011 09:39 PM

You sooooo made that harder than it had to be.

fowlplay4 04-16-2011 09:48 PM

Quote:

Originally Posted by Unkownsoldier (Post 1643762)
You sooooo made that harder than it had to be.

Care to shed some light on your 'easy' process?

nullify 04-16-2011 10:06 PM

Haters gonna hate.

cbk1994 04-16-2011 10:11 PM

For anyone who wants to set transparency using Adobe Fireworks:

Under "Optimize" (on the right side of the screen if you're using the default workspace), select PNG 8 and then "Alpha Transparency" (use PNG 24 if it's a 24-bit PNG with no transparency, or PNG 32 if it's a 24-bit PNG with semi-transparency or transparency):

http://u.graalcenter.org/i/Picture_63007722.png

Then just File > Export.

If you're looking for something more Photoshop-esque, File > Image Preview is what you're looking for.

Unkownsoldier 04-17-2011 01:46 AM

Quote:

Originally Posted by fowlplay4 (Post 1643764)
Care to shed some light on your 'easy' process?

-put it into paint
-save as bmp (256)
-put the bmp in giffy "hit trans"
-put the img.gif into "gif2mng"
-trans .png there you go.

Fulg0reSama 04-17-2011 01:57 AM

Quote:

Originally Posted by Unkownsoldier (Post 1643839)
-put it into paint
-save as bmp (256)
-put the bmp in giffy "hit trans"
-put the img.gif into "gif2mng"
-trans .png there you go.

great, but what's the point of that if irfanview will fix the color options, adjust the colors depth, and trans it all at once without the use of multiple programs?

If anything you made it slightly shorter but even more tedious.

fowlplay4 04-17-2011 01:59 AM

Quote:

Originally Posted by Unkownsoldier (Post 1643839)
-put it into paint
-save as bmp (256)
-put the bmp in giffy "hit trans"
-put the img.gif into "gif2mng"
-trans .png there you go.

So you have to put it through 2 (excluding paint) different programs and end up with 3 different images before you get the finished product. Your 'easy' method sounds pretty ridiculous to me.

Where my guide has you do everything (sans drawing pixel art) in Irfanview without changing the file type, and requires no additional files.

I've also seen the method paint uses to convert images to 8-bit destroy color palettes in past.

Devil_Lord2 04-17-2011 12:39 PM

Quote:

Originally Posted by Unkownsoldier (Post 1643762)
You sooooo made that harder than it had to be.

Yes, but either way he did it.
There aren't many tutorials for Graal players out there.
If there are I can't find them.. At least rarely any good ones for programming...



Also, I believe Paint could set transparencies.. it took me forever to figure out how, but I believe I have... kinda just have to keep searching for the ways to do it lol.. anyway the search probably isn't worth it.. I heard gimp and paint.net are also good. In the past I use to use free trials of Paint Shop Pro 7.

Unkownsoldier 04-17-2011 03:00 PM

Quote:

Originally Posted by fowlplay4 (Post 1643847)
So you have to put it through 2 (excluding paint) different programs and end up with 3 different images before you get the finished product. Your 'easy' method sounds pretty ridiculous to me.

Where my guide has you do everything (sans drawing pixel art) in Irfanview without changing the file type, and requires no additional files.

I've also seen the method paint uses to convert images to 8-bit destroy color palettes in past.

It doesn't really matter, I can get a .png transparent image in less than 30 seconds. How long does it take to get yours transparent? It doesn't really matter how its done, its annoying that you have to do anyway. So the quicker you get it done, the less annoying it is, regardless of how its done.

*if you use paint to make it is a guarantee that the color palette wont be destroyed. Or you don't even need to use paint, save it as 256 bmp in any program for all I care.

Crono 04-17-2011 03:50 PM

Quote:

Originally Posted by Unkownsoldier (Post 1643913)
It doesn't really matter, I can get a .png transparent image in less than 30 seconds. How long does it take to get yours transparent? It doesn't really matter how its done, its annoying that you have to do anyway. So the quicker you get it done, the less annoying it is, regardless of how its done.

*if you use paint to make it is a guarantee that the color palette wont be destroyed. Or you don't even need to use paint, save it as 256 bmp in any program for all I care.

Are you retarded? No seriously, are you retarded? Open the file with irfan, apply 1 option, and save. It takes no time or effort at all.

fowlplay4 04-17-2011 05:13 PM

Quote:

Originally Posted by Unkownsoldier (Post 1643913)
It doesn't really matter, I can get a .png transparent image in less than 30 seconds. How long does it take to get yours transparent? It doesn't really matter how its done, its annoying that you have to do anyway. So the quicker you get it done, the less annoying it is, regardless of how its done.

*if you use paint to make it is a guarantee that the color palette wont be destroyed. Or you don't even need to use paint, save it as 256 bmp in any program for all I care.

Around 5 seconds, my tutorial is just thorough and explains the process completely for new users and gives them steps to help them verify they're doing it properly.

It also addresses the most typical scenario: A new player makes an edit of a head, and needs to convert it to Graal's format.

This is literally all that's done: (The check off steps only need to be done once, and then they save)

- Open image in Irfanview
- Image/decrease color depth to 256 colors
- Save as PNG, check off 'Show Options Dialog'
- Check off 'Save Transparent Color'
- Click Save, choose Transparent Color

Done.

Soala 04-17-2011 06:27 PM

1 Attachment(s)
Nice tutorial :)

You can also use paint.NET to set transparencies:

1) Open your image
2) Select the background with the magic wand
3) Press Delete key
4) "Save as", paint.NET will automaticly ask you to choose the color depth

Attachment 52718

Shards-Of-Fate 04-17-2011 07:06 PM

Animagic GIF has a Transparency / Eyedropper tool.

I just copy and paste out of paint, set the transparent color I like, save it--click and drag to gif2mng.exe and it does all the work for me.

The thread wasn't seeing who could do it faster, but to explain it to those who don't know how.

cbk1994 04-17-2011 08:00 PM

Quote:

Originally Posted by Devil_Lord2 (Post 1643912)
At least rarely any good ones for programming...

Learning Java or JavaScript or PHP or another similar language is probably the easiest way to learn GScript.

Quote:

Also, I believe Paint could set transparencies.. it took me forever to figure out how, but I believe I have... kinda just have to keep searching for the ways to do it lol.. anyway the search probably isn't worth it.
Paint cannot set transparencies.

MattKan 04-17-2011 10:49 PM

nice!

Devil_Lord2 04-18-2011 12:39 AM

Quote:

Originally Posted by cbk1994 (Post 1643938)
Paint cannot set transparencies.

I could have sworn I have done it once in the past. x_x
Either way it wasn't easy and I couldn't do it again because I really don't know what I did. Searching Google now I an only find stupid replies that aren't exactly what people are asking.. So either I actually did somehow pull it off, or I imagined I did years ago.. Kind of depends on the reason I started searching for a different program like PSP7 ... I don't remember D:


Does Graal use Java, would it be helpful to learn, or are other games / websites moving away from Java, I heard CSS would be good for websites but there was something else coming out x.x;; I don't know.. hardly learned anything about CSS in class anyway..


-EDIT-
Btw, I wasn't being sarcastic, I'm sure I have imagined doing things in the past. x.x;
But I still could have sword I did it once... D:

cbk1994 04-18-2011 12:53 AM

Sorry for hijacking your thread, Jer.

Quote:

Originally Posted by Devil_Lord2 (Post 1643995)
I could have sworn I have done it once in the past. x_x
Either way it wasn't easy and I couldn't do it again because I really don't know what I did. Searching Google now I an only find stupid replies that aren't exactly what people are asking.. So either I actually did somehow pull it off, or I imagined I did years ago.. Kind of depends on the reason I started searching for a different program like PSP7 ... I don't remember D:

Paint cannot set transparencies. There are some conditions where pure black is treated as a transparent color by Graal, but it is not real transparency and should be avoided.

Quote:

Does Graal use Java, would it be helpful to learn, or are other games / websites moving away from Java,
Graal does not use Java, but it uses a syntax which is very close to Java. JavaScript is closer to GScript since it is not strictly typed.

Java was never used for websites, although it is widely used for the serverside end of web applications (such as Gmail, Google Docs, ...). Java Applets are very rarely used now; Flash or JavaScript is preferred.

There is no widely-supported alternative to JavaScript for clientside web scripting.

Quote:

I heard CSS would be good for websites but there was something else coming out x.x;; I don't know.. hardly learned anything about CSS in class anyway..
CSS is not a programming language. Cascading Style Sheets are simply style sheets that contain information on how elements should be laid out and formatted.

Devil_Lord2 04-18-2011 05:17 AM

Quote:

Originally Posted by cbk1994 (Post 1644000)
Sorry for hijacking your thread, Jer.


Paint cannot set transparencies. There are some conditions where pure black is treated as a transparent color by Graal, but it is not real transparency and should be avoided.

That could be what happened, it wasn't on Graal though..

Quote:

Originally Posted by cbk1994 (Post 1644000)
CSS is not a programming language. Cascading Style Sheets are simply style sheets that contain information on how elements should be laid out and formatted.

Oh, I thought CSS was slowly replacing HTML.. again we didn't learn all that much on it, and I didn't get it at all.. nor did I like my website design class.. I learned more from Graal rather then pressing buttons on Dreamweaver x.x; In my opinion learning the program isn't the same as learning HTML..



Anyway, keeping to the subject, I heard Gimp and paint.net were good but I have not used either of them, and I doubt a lot of people have photoshop so there isn't much need to say how.. Or should I?

-edit-
actually if you have photoshop, and created the image in photoshop, I would think they would know how?

fowlplay4 05-02-2013 05:27 PM

Irfanview added a 'Use main window color for transparency option' un-check both of them in the advanced options when saving in order to manually choose a color to make transparent.

http://i.imgur.com/gZqDQkN.png

Clockwork 05-04-2013 09:46 AM

Easier in photoshop o-o

http://i.imgur.com/Y13mtaG.png

Elk 05-04-2013 11:30 AM

not everyone has photoshop though ;)

Crow 05-04-2013 11:50 AM

How is Photoshop easier? In IrfanView, you just have to save the image, then click on a color. Done.

BlueMelon 05-04-2013 12:59 PM

I just use Paint.NET, the selection tool is great.

Fulg0reSama 05-04-2013 08:48 PM

Quote:

Originally Posted by Crow (Post 1717450)
How is Photoshop easier? In IrfanView, you just have to save the image, then click on a color. Done.

Depends on who you ask.

All I do is change the layer, select the color, delete it and save and I can save it in a project file for reediting.

If it's just a one time thing, yeah, go ahead and use irfanview or any other free program.

Crono 05-04-2013 08:53 PM

Quote:

Originally Posted by Elk (Post 1717449)
not everyone has photoshop though ;)

they should, it's free!!!!!!


if ur a dirty pirate like me!!!!!

Crow 05-04-2013 09:12 PM

Quote:

Originally Posted by Fulg0reSama (Post 1717486)
Depends on who you ask.

All I do is change the layer, select the color, delete it and save and I can save it in a project file for reediting.

If it's just a one time thing, yeah, go ahead and use irfanview or any other free program.

In terms of efficiency (clicks/actions taken), IrfanView is faster. Also, it doesn't take as long to start up.

Fulg0reSama 05-04-2013 11:56 PM

Quote:

Originally Posted by Crow (Post 1717492)
In terms of efficiency (clicks/actions taken), IrfanView is faster. Also, it doesn't take as long to start up.

But with matters of convenience to someone who might want to do more (more done with possibly the same time), Photoshop excels.
But this is pretty offtopic lol.

BlueMelon 05-05-2013 02:12 AM

In terms of efficiency, what ever is the fastest/more familiar for the user, would be the best.

I can trans an image with 3 actions in Paint.NET because I know the hotkeys and the little tricks :p

xXziroXx 05-05-2013 12:26 PM

ya'll need to stop using **** like irfanview, paint.net, giffy and the likes and grow some balls and pirate a proper program

ya i went there

xAndrewx 05-05-2013 01:16 PM

i use saveforweb in Photoshop

Crow 05-05-2013 03:37 PM

Quote:

Originally Posted by xAndrewx (Post 1717527)
i use saveforweb in Photoshop

Ugh. Please don't :/

cbk1994 05-05-2013 04:06 PM

Personally I hex dump the image into emacs and regex the transparent color using the mandb index and kernel cache with a quick series of 15 meta keys and 7 interrupts. I don't know why you guys choose to do it the hard way.

Quote:

Originally Posted by Crow (Post 1717531)
Ugh. Please don't :/

As someone who doesn't use Photoshop for non-photos (and hence has rarely used it), why not?

DustyPorViva 05-05-2013 04:30 PM

Quote:

Originally Posted by cbk1994 (Post 1717532)
As someone who doesn't use Photoshop for non-photos (and hence has rarely used it), why not?


Well for one it saves as gif(it's preferred to use png if you're not animating), but I think it may also adapt to web palette.

It'd be really cool to see a program(or website) made that's quick and easy image saving made specifically for Graal. Copy/Paste and BOOM, save prompt. Automatic transparency option(based on 0,0 pixel), color correction for black and white(replaces #00 and #FF with Graal-compatible nears) and automatic body detection(detects bodies based on width/height and then properly adjusts the palette based on the colors from body.png).

Crow 05-05-2013 04:36 PM

Quote:

Originally Posted by DustyPorViva (Post 1717533)
but I think it may also adapt to web palette.

This, mostly.

Edit: Although, it looks like you can turn that off now. I know you couldn't in previous versions. But it's still GIF. PNG is preferred. Not too bad anymore, but still not the best way to do it. Also, saving with IrfanView, you can also use pngout, which it comes with. Saving with pngout will (sometime drastically) reduce the size of the resulting file, which is great for both website usage and Graal.

xAndrewx 05-05-2013 04:42 PM

1 Attachment(s)
which version do you use? lol

Crow 05-05-2013 04:51 PM

Quote:

Originally Posted by xAndrewx (Post 1717536)
which version do you use? lol

CS5. Haven't used the feature in a while, though. I was using PS7 for a long time, and if I remember correctly, it was only sporting GIF and web safe colors with the "save for web" option.

xAndrewx 05-05-2013 05:02 PM

ah I use photoshop 7 and thats on there... you must have used 6!! :D

Stephen 05-05-2013 06:02 PM

Quote:

Originally Posted by xAndrewx (Post 1717536)
which version do you use? lol

Rolf... Yes. I use save for web everyday. The dialog doesn't just offer several image formats (including 24bit PNG) it also has control over optimization.


All times are GMT +2. The time now is 07:52 AM.

Powered by vBulletin® Version 3.8.11
Copyright ©2000 - 2025, vBulletin Solutions Inc.
Copyright (C) 1998-2019 Toonslab All Rights Reserved.