Preserved Topic: sig things (Page 1 of 1)

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).]

hahah!

it... su-ck-SSS


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

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).]

.





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

bloody smoke... nevermind.



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

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 .

"dissolve"

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

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).]

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.

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.

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).]

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.

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).]

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).]

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).]

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.

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

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.

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

___________________
Emps

FAQs: Emperor

"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"

Howsabout just

"Transparency the Mahjqa way"


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

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

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.