Closed Thread Icon

Preserved Topic: sig things (Page 1 of 1) Pages that link to <a href="http://ozoneasylum.com/backlink?for=13509" title="Pages that link to Preserved Topic: sig things (Page 1 of 1)" rel="nofollow" >Preserved Topic: sig things <span class="small">(Page 1 of 1)</span>\

 
eyezaer
Lunatic (VI) Mad Scientist

From: the Psychiatric Ward
Insane since: Sep 2000

posted posted 07-11-2003 04:29

I just about titled this "simple sigs" because of mahj showin every one up in here... so...

this is a simple sig i guess. no animation or anything fancy. foo!

transparency is going to be a mess i think unless i get lucky, so tests away...



and...



[This message has been edited by eyezaer (edited 07-11-2003).]

eyezaer
Lunatic (VI) Mad Scientist

From: the Psychiatric Ward
Insane since: Sep 2000

posted posted 07-11-2003 04:29



hahah!

it... su-ck-SSS


[This message has been edited by eyezaer (edited 07-11-2003).]

eyezaer
Lunatic (VI) Mad Scientist

From: the Psychiatric Ward
Insane since: Sep 2000

posted posted 07-11-2003 04:39

Aaaaarrrrrrrr!

So, I cant seem to get the transparency to work perfectly. I had doubts... mmm... any ideas?









[This message has been edited by eyezaer (edited 07-11-2003).]

eyezaer
Lunatic (VI) Mad Scientist

From: the Psychiatric Ward
Insane since: Sep 2000

posted posted 07-11-2003 04:59

.





[This message has been edited by eyezaer (edited 07-11-2003).]

eyezaer
Lunatic (VI) Mad Scientist

From: the Psychiatric Ward
Insane since: Sep 2000

posted posted 07-11-2003 05:10

bloody smoke... nevermind.



[This message has been edited by eyezaer (edited 07-11-2003).]

Slime
Lunatic (VI) Mad Scientist

From: Massachusetts, USA
Insane since: Mar 2000

posted posted 07-11-2003 05:25

When you have something that fades to transparent like that, and you can't get the transparency to work, you should make it solid all the way to the edge and then create a dithering effect beyond that, dithering from solid opaqueness to full transparency. The easiest way to do this is to make a layer (in photoshop) that does this without dithering, and then set its blend mode to, uh, I forget what it's called, but the one that creates a dithering effect.

I used this technique in http://www.slimeland.com/misc/rtffaq.gif .

DL-44
Maniac (V) Inmate

From: under the bed
Insane since: Feb 2000

posted posted 07-11-2003 06:39

"dissolve"

docilebob
Maniac (V) Mad Scientist

From: buttcrack of the midwest
Insane since: Oct 2000

posted posted 07-11-2003 06:43

It sometimes works, too, if you select the smoke (or whatever) and fill in a layer below it with the bg color.

eyezaer
Lunatic (VI) Mad Scientist

From: the Psychiatric Ward
Insane since: Sep 2000

posted posted 07-11-2003 22:14

interesting. If you look close at Mahj's sigs it looks like he does one pixel lines of one color then a pix line of the other color like scan lines.

We shall see....

Also, both of those are painted directly into a 43 4 4 background, so... why the heck is the Gif89a export still absent?

We should all pester Adobe until they put that back in as a standard feature.



edit... how about

Is it perfect or what?

not... really.

[This message has been edited by eyezaer (edited 07-11-2003).]

Slime
Lunatic (VI) Mad Scientist

From: Massachusetts, USA
Insane since: Mar 2000

posted posted 07-13-2003 09:52

The important thing is to do the dithering *outside* of the image area. Don't dither right on top of the parts that aren't 100% transparent, or it looks too obvious.

InI
Paranoid (IV) Mad Scientist

From: Somewhere over the rainbow
Insane since: Mar 2001

posted posted 07-13-2003 11:39

The poster has demanded we remove all his contributions, less he takes legal action.
We have done so.
Now Tyberius Prime expects him to start complaining that we removed his 'free speech' since this message will replace all of his posts, past and future.
Don't follow his example - seek real life help first.

mahjqa
Maniac (V) Mad Scientist

From: The Demented Side of the Fence
Insane since: Aug 2000

posted posted 07-13-2003 15:39
quote:
interesting. If you look close at Mahj's sigs it looks like he does one pixel lines of one color then a pix line of the other color like scan lines.



I do use scanlines, yes. It's clearly to see in my last post in this thread: Call 911

I've whipped up a bit of a mini-tut of what I did.

Get the PSD at http://www.mahjqa.com/stuff/transparencylamp.psd if you want to do it yourself. Much more fun this way.


This is what I started off with. The layers are, from bottom to top:
Background. Simple, color: #2B0404, which is the average of the background colors of this forum.
Lamp. Just a painting of a lamp, doesn't do anything in this example.
Light. It's the big spotlight thing you see. I made this one with [filter>render>lighting effects.]
Hue/Saturation is used to give the lamp a blue color.
Both Light and Hue/Saturation are in the layer map called 'light map'. The blending mode of this map is set to 'screen', which means that whatever is IN this map, will be treated as one flattened layer which is set to the blending mode 'screen'.

I could export this one. I usually export things this way: I select the complete canvas, I click [edit>copy merged], and paste that in a new, empty document. Then I use the eyedropper tool to get the color of the background. Then I click [select>color range] (I set the fuzziness to 0) to select just the background color. Pressing delete removes the background, and now I can export it as a GIF.

However, if a GIF has to be blended against different backgrounds, that doesn't always work. That's why I use scanlines at times, especially when I work with gradients or large blurred areas.


Here, I added a scanline layer. For info on how to make one, visit this :FAQ:. I set it to multiply, so every other line of pixels disappears. Since that is a little bit too much, we're going to limit it a bit.

Click on the arrow in the layers palette, and then on 'blending options'.

There's a bunch of options here, but you need to look for two sliders which look like this:

If you move the lowest white triangle slider to the left like on the screenshot, you'll see that the scanline effect disappears slowly, starting at the brightest spot. What these slider things do, is that they limit the area where a layer is visible. The top bar compares the brightness of the layer itself to the amount of the sliders, the bottom one compares the brightness of the layers that are below the layer itself. The concept may be a bit hard to grasp at first, but after a bit of fiddling it'll become clearer.

You notice that the transition where the scanlines stop is a bit harsh. To smooth this a bit, you can hold the ALT key (I believe mac users use the OPTION key for that) and click and drag the white arrow, like in this screenshot:

The white arrow splits in two, so the transition is less harsh, creating a nice scanline effect. Since you only need the scanlines in the darkest parts of the picture, you can move the sliders even more to the left. The end result looks something like this, a lamp that blends nicely against both backgrounds.



Whee. Clear enough? Questions? Comments?

Edit: fixed spelling mistakes

[This message has been edited by mahjqa (edited 07-14-2003).]

sharma
Bipolar (III) Inmate

From:
Insane since: Dec 2000

posted posted 07-13-2003 16:47

mahjqa, really cool technique. thanks for that! i downloaded your psd and tried it out myself and it works very well. I just have one question. Why scanlines? Wouldn't some type of check type pattern work better? Here is my attempt with both scanlines and checks. Maybe you used scanlines for a reason though. Either way, thanks alot for the mini tut. It was extremely helpful to me.

mahjqa
Maniac (V) Mad Scientist

From: The Demented Side of the Fence
Insane since: Aug 2000

posted posted 07-13-2003 16:51

Yeah, both work. Maybe a checkerboard is even better, but I just thought the scanlines looked nifty (and a bit easier to see in the tutorial)

EDIT:

Also, another way I use this, is to add color to images. Most of the time when I draw something, I do so in black and white. (first picture below)
To add color, I use adjustment layers like hue/ saturation. Most of the time, 1 color doesn't really work well. (second picture.)
To tweak it a little, I often add more layers. In the third picture, I added a red hue/saturation layer. Using the blending options, the layer is 100% visible at the darkest places, and 0% visible in the lightest, so the yellow shows through. And the fun part of this is, I can draw below those adjustment layers, just using balck, white and greys, without having to worry about the colors.






[This message has been edited by mahjqa (edited 07-13-2003).]

eyezaer
Lunatic (VI) Mad Scientist

From: the Psychiatric Ward
Insane since: Sep 2000

posted posted 07-13-2003 22:23

Sweedish!

oops, no time for talk, back to PS.



holy crud. Nice big M. That was just too frikin easy.

[This message has been edited by eyezaer (edited 07-13-2003).]

eyezaer
Lunatic (VI) Mad Scientist

From: the Psychiatric Ward
Insane since: Sep 2000

posted posted 07-13-2003 22:39



I used the checkerboard pattern, and i must say... wow.

This needs to go in the FAQ if it aint already...

[This message has been edited by eyezaer (edited 07-13-2003).]

sharma
Bipolar (III) Inmate

From:
Insane since: Dec 2000

posted posted 07-14-2003 01:45

cool sig man! i like it alot. though i liked your original colors a bit better myself. still looks great though. transparency worked well too. real cool.

Emperor
Maniac (V) Mad Scientist with Finglongers

From: Cell 53, East Wing
Insane since: Jul 2001

posted posted 07-14-2003 02:50
quote:
This needs to go in the FAQ if it aint already...



Oh this does indeed scream for that I am just struggling for a title...........

Dithered transparency?

___________________
Emps

FAQs: Emperor

eyezaer
Lunatic (VI) Mad Scientist

From: the Psychiatric Ward
Insane since: Sep 2000

posted posted 07-14-2003 03:31

more like "perfectly transparent gifs" or i dunno...

"super amazing transparency that you must read!"

"flawless transparency on 2 similar backgrounds"

Something a with a little more pizzazz emps.

Emperor
Maniac (V) Mad Scientist with Finglongers

From: Cell 53, East Wing
Insane since: Jul 2001

posted posted 07-14-2003 03:54

eyezaer: Yes my naming skills do lack pizzazz (is that the plural of pizza?)

___________________
Emps

FAQs: Emperor

mahjqa
Maniac (V) Mad Scientist

From: The Demented Side of the Fence
Insane since: Aug 2000

posted posted 07-14-2003 08:51

"Even more farfetched GIF transparency tricks"
"How to deal with GIF; The ancient relic strikes back"
"Yes, we're nuts for having two different background colors. Stop bothering us"
"Project: Bike"
"Manual GIF dithering for blurred objects"
"How to deal with those pesky different backgrounds."
"GIF transparency for the tough'uns."
"If all else fails, use checkers"


trib
Paranoid (IV) Inmate

From: Den Haag, Netherlands
Insane since: Sep 2002

posted posted 07-14-2003 13:14

Howsabout just

"Transparency the Mahjqa way"


Bug-free software only exisits in two places
A programmer's mind and a salesman's lips

Emperor
Maniac (V) Mad Scientist with Finglongers

From: Cell 53, East Wing
Insane since: Jul 2001

posted posted 07-14-2003 15:54

I quite like:

"Manual GIF dithering for blurred objects"

If no one objects I'll sort it out later - if they do object well..........

edit: OK done:

:FAQ: Manual GIF dithering for blurred objects/transparent images

I tweaked the name following Suho's suggestions]

___________________
Emps

FAQs: Emperor

Suho1004
Maniac (V) Inmate

From: Seoul, Korea
Insane since: Apr 2002

posted posted 07-15-2003 04:36

Well, this is not really an objection, but I think we should keep in mind that an effective FAQ title would include words people are most likely to search for when looking for this technique, and not necessarily be a be-all-end-all description of the technique. With that in mind, I definitely think the term "transparency" should be in the title, and probably "dithering" as well. Just an idea.

« BackwardsOnwards »

Show Forum Drop Down Menu