Delicious Personas

Personas, for those not familiar with it, is a Firefox add-on from Mozilla Labs that allows you to easily reskin the browser. Sort of like a theme, but different.

This weekend I decided to make a bacon persona. It was really easy to do; I just made a couple of JPEGs and submitted them to the getpersonas.com site. Result:

If you want to try it out, just:

1. Install Personas from getpersonas.com.
2. Select “Bacon” from the Personas directory. It’s under the “Other” category. (At the moment, it’s also at the top of the “Recent” subsection.

Mmm, bacon.

Wheee!

On Monday I posted a Mozilla Labs blog entry discussing the APNG Edit extension I was releasing.

Just for fun, I thought I’d convert my favorite Firefox Flicks video to the APNG format….

The compression algorithms in APNG and AGIF are not really suited for straight conversions from video; doing so tends to result in large files (this one has about 340 frames at 86×75, weighing in at 990KB). Similarly, some images are better suited to JPEG or SVG… One just needs to use the right tool for the job. Hmm, <video> tag, anyone? 🙂

I also made a full-resolution (but still cropped) 230×200 version, although it’s a wee bit large (pun intended). So I’ll just link to it.

The conversion itself was a fairly simple process… I basically used “mplayer -vo png wheee.mov” to convert the QuickTime video to a pile of PNG images, dragged them into my APNG Edit window, and let it chew through them.

Chromatabs 2

I released an update to Chromatabs today… [Edit: It’s no longer in the AMO Sandbox.]

This version adds the ability to color tabs based on the site’s favicon. (This is off by default; you can enable it in the extension’s preferences.]

Here’s what it looks like with a few select sites:

It’s just averaging the pixels in the favicon, which is why Flickr’s color is purple (a blend of the pinkish-red and blue in the icon). It would probably be better to build up a histogram, and then select the most prominent color… But averaging works fairly well and is easy. 🙂 The code is smart enough to ignore pixels that are almost white or black, which would otherwise pollute the average color. I’ve noticed that a surprising number of sites have black-and-white site icons (eg BBC), so Chromatabs will fall-back to the old method of picking a color for the site in such cases. [Grayscale confuses it sometimes, though.]

I’ve found that using the favicon to determine colors for tabs seems more useful, because the color actually has some relevance to the site. Of course, for sites without an favicon it doesn’t help at all.

 

Oh, and one more thing (as Steve Jobs is wont to say)…

I’ve been thinking about some ideas to improve the visibility of the foreground tab, which is sometimes hard to pick out (especially with colored tabs, although I think even the default theme is too non-distinct). Here’s a mockup of what I’m currently thinking about — subtle gradients on either side, vaguely as if the neighboring tabs are curving into darkness.

(*cough* I just noticed I styled the wrong tab in the mockup, as the URL bar clearly says “www.blogspot.com” and not “www.flickr.com.” Oh well, no one is prefect! [sic :)])

A bit of bling

[Did I just use the word “bling”? I’m so, so, sorry.]

The Mozilla offices have been humming with activity this week, with the influx of folks arriving for the Firefox Summit. We’ve been having some fascinating discussions on a variety of topics and ideas for the future. On that note, a few weeks ago I wrote up some thoughts I had for an evolution of Firefox 2’s Live Titles (aka “microsummaries”), in the form of adding graphics to a traditionally text-based feature. [Wonder Twin powers activate.]

Here’s a mockup of what Graphical Microsummaries might look like:

Chromatabs followup

I’ve received quite a few useful comments from last week’s posting of Chromatabs, and I thought it might be nice to summarize some of it. Personally, I’m satisfied — though not thrilled — with the extension. The idea has merit, but the implementation exposed some issues… Which is exactly what it was supposed to do, as a labs.mozilla.org prototype! Here’s some of the common comments:

You are in a maze of twisty little tabs, all alike.

I had this idea for tweaking tabs floating around my head for a while, and last week I finally decided to implement it. The result is Chromatabs, and the UI aspects of it are discussed on today’s labs.mozilla.org posting.

I thought I’d write a bit more here about how it’s implemented, because it’s doing a few interesting things under the hood…