Thursday, February 26, 2009

Fullscreen Flash Flickering

Something's been bugging me ever since I made a Flash site go completely 100% browser window. In Internet Explorer, when I would resize the site, the browser window's content would flicker black all the way from full size to as small as I could make the window. The site was more than usable, but the flickering was enough to annoy the hell out of me, and make me wonder if someone was going to call me out on it. I checked through all of my Flash code and I couldn't figure it out. You could still hear the site, but not see it, nor were any of the buttons clickable. Resize a little more, the site comes right back. Resize as small as the window goes? Gone again. I swore it had something to do with my full Flash black fade, but I removed that layer and it persisted.

This only happened in IE, so it made me wonder if it was an HTML issue.

Anyway, the short of it, I added two lines to my body CSS (which are also in my HTML CSS):

height:100%
width:100%

The flickering is gone. Whew.

I could sit here and tell you that it has something to do with the way that Internet Explorer renders its viewport, that the body is really just another container within your HTML hierarchy, so making sure both your body and HTML CSS have these percentage values..blah blah..blah....

But then I'd be making things up. I really have no clue.

Saturday, February 21, 2009

"Allow Smoothing" on all bitmaps in library

http://mrsteel.wordpress.com/2007/06/12/flash-jsfl-script-allow-smoothing-on-all-bitmaps-in-library/

The JSFL file located at the above link lets you enable "allow smoothing" on all of the bitmaps in your Flash library. You can also adjust it to make all your bitmaps lossless, or jpeg, or whatever you need. This probably saved me an hour.

Update:
This code is awesome, but be aware exactly what it does.

Here's the code:

var libItems = fl.getDocumentDOM().library.items;
for (i = 0; i < libItems.length; i++){
if(libItems[i].itemType == “bitmap”){
libItems[i].allowSmoothing = true;
libItems[i].compressionType = “lossless”;
}
}

With this line in place, it adjusted the compression on all of my objects to "lossless". Meaning my site went from 1.5 megs to 4.5 megs!! Lossless is great, but expensive, and on some objects, it just doesn't make sense.

I got the site back down to 2.5 megs so far (and falling!)

Monday, December 29, 2008

Website Pimpin' #1 - Kenny Bellew and soundObjects

http://www.kennybellew.com/tutorial

Every time I find myself needing to use soundObjects in Flash, my Googling always leads me to Kenny's website. Kenny breaks down soundObjects into really simple and easy to use tutorials. Everything I've ever needed to know about soundObjects was within his site, and everything that isn't there was easy enough to figure out once you step through his tutorials and learn how everything works.

Monday, July 14, 2008

Photoshop Feature Request #3

I'd like an option, somewhere under "Window", to see all of the fonts used in a PSD file listed, as well as their true filename. There are times I'm asked for "Helvetica", when I have 20 different versions, both TTF, OTF, etc., on my machine. Plus, I'm often dealing with a few hundred layers, I don't really have the time to go through them all looking for fonts I used, or fonts someone else might have used if I'm opening their PSD file.

Saturday, May 3, 2008

Need that logo in vector?

If you're like me, companies and brands seem to never want to give you their fonts, logos and other assets on time. So you end up either having to work with some bitmap you found on Google Images or you try your luck at Best Brands of the World (http://www.brandsoftheworld.com/). Best Brands can be a lifesaver (although it's legality is questionable), and most designers know about it and use it. The problem is, often the logos are very good, but even more often, they're missing the exact one you need or it's a bit off.

A technique I've learned lately is pretty much spot on. Basically, Google the name of the company and limit your file type to PDF (filetype:pdf). If you keep an eye on the URL, you'll often end up snagging a PDF document off of their website, in which their designer obviously used the official version of their vector logo. Download the file, and open it in Adobe Illustrator, deleting everything you don't need (or just copy and paste where you want it).

I realize this can also be abused, but as a designer, this holds priceless value. Now if only you can be lucky enough to find a true RGB version of that vector logo. Google doesn't let you limit your search to colorspace yet.

Tuesday, April 22, 2008

Mobile Phones and Gradient Banding

Most of the design work I do nowadays ends up on mobile phones. Lately, the screens for these phones have more vibrant colors and pretty amazing LCD displays. But some of the phones, even new ones, have difficulty rendering gradients. A lot of the time, gradients end up banding on a phone (color steps), and your once beautiful design ends up chunky, degraded and completely artifacted.

In the past, your choices were to either adjust your gradient (either shortening the length it takes from one color to get to the next or making the colors less drastic), or remove it all together and go flat. I really don't like either of those choices, because, as a designer, it's really limiting. Or you could just leave it.

It seems as though these issues are directly tied to the color depths LCD screens can produce (24 bit compared to 16 bit that most LCD screens see). I won't get into details on why certain phones use X depth compared to Y, because it all truthiness, I don't know.

After some digging around the internet, I came across a tool called DepthDither, by Graphest. It's a free plugin for Photoshop that allows you not only to target a specific color depth (and show you on screen how it will look), it gives you three dithering methods to try fixing the banding. I have to say that the results so far in the last 6-12 months I've been using this tool have been amazing.

Original



At 12 bit (and how a lot of phones would render it)



With DepthDithering applied at 100%



Get it now while it's still free. I imagine the more mobile our world becomes, the more this tool will be in high demand.

Friday, April 11, 2008

Photoshop Feature Request #2

The File menu in Photoshop. Can we move Revert away from Save for Web and Devices? Maybe up there by close? It's too dangerous of a button to be right next to my most used function.