If you’re looking for a list of Ubiquity skins that you can install, check this out.
Every time I look at a screenshot of Ubiquity on the web, I flinch. UBIQUITY IS UGLY (just like that all caps text). Or rather, Ubiquity was ugly. I just finished up the basic infrastructure to enable skinning for Ubiquity. And already, we have one gorgeous new skin (thanks to Yatrik Solanki) that complements the ugly old one.
Unfortunately, this awesome skin only works properly on Windows. There are minor glitches on OS X and worse, transparency is not at all supported on Linux. But, instead of having a non-transparent default and depriving everyone of the eye candy, we’ll have different skins for different platforms. Here’s what the proposed Linux skin (credits to Yatrik again) looks like:
Although there will be minor changes before the 0.1.3 release, you can get started with skinning immediately. It’s really easy to create your own skins (just a single CSS file). Check out the skinning tutorial here.
Once you write the skins, you will be able to share them just like commands (without any scary warning page, though). And as soon as you install any skin, your Ubiquity will immediately be updated to the newest one. To switch back or to other skins, there’s the “Your Skins” page.
So, go create some Ubiquity skins! You can help make the Linux skin a reality.
Pingback: Yatrik Solanki » Updates to Ubiquity and More…
Thanks for the credits
I’ve been working on something a little more awesome for Linux, but the above is also a possibility.
For some updates, check the trackback above.
As for skinning support, I’m too excited!
For Linux, Are you talking about transparency in GTK+ ?
Can you possibly enable transparency when compositing is on or something? The drag images in Firefox on Linux are considerably inferior to their counterparts on Windows and OS X.
@Jigar Yes, transparency in GTK+.
@David Based on testing and asking around on IRC, I believe that transparent XUL panels are not supported at all on GTK+. But I’ll have to check again.
Awesome work Abi and Yatrik!
Just wondering, why specific classes for Google results? Also, can’t you use :focus instead of .hilited?
@David
Huh? Images with transparency in them are transparent when dragging here with Firefox and Gnome… That’s without Compiz running.
@Linux skin
I think something like this should do as a starting ground. I don’t have Ubiquity installed, don’t want to install it until the extension gets auto-update, and can’t check for myself.
http://phoenix.nox.googlepages.com/ubi.css
“Your command must have a name but all fields are optional.”
Command?
Might it be useful to host these CSS files at userstyles.org? (If you don’t already know, it’s a website hosting many of the user-created CSS files that are used to complement websites, and programs that support Stylish, such as Firefox)
@Nox Oops.. corrected that error on the wiki.
Also, thanks for getting started on the Linux skin but it’s messed up for me. To make it easier for you to test (without having to install hg and python), I have created a XPI with the latest skinning changes:
http://foyrek.com/ubiquity-skinning.xpi
The reason why we have specific classes for Google results is so that you can style the preview for the search results (and despite the class names, Yahoo search results are also styled with the same classes). We should probably also allow skins to style other previews like the map preview and wikipedia preview. But we have to discuss this. Do we want to style all builtin previews although we have no control over third-party commands? I’m actually leaning towards previews being visually distinct from the rest of the Ubiquity box. See http://abcdefu.wordpress.com/2008/09/04/on-commands-designers-and-the-magic-editor/
@Havvy Along with commands, skins will also be posted/hosted on Herd which will allow comments, ratings and other social features in the near future.
Nox: I mean alpha transparency. If you drag text, the antialiasing dies. Try dragging something in Windows. It becomes partially transparent, which is VERY useful. If your drag image is large enough, it is a serious usability problem that Firefox on Linux obscures the drop target.
abi: Can you work around GTK’s bugs then? Or complain loudly? ARGB windows are certainly possible in X with compositing.
@David
It’d be real useful to have ARGB up, and apparently easy. I’ll see if I can ask to get a trac ticket up.
@abi
Thanks for the XPI!!
I’m sorry but I found proposed linux skin much more uglier then the current one. I think its good idea to try to fix the transparency issues with linux. dont forget that linux useres are the most devoted
@David
Transparency done by GTK (afaIk at least)
http://phoenix.nox.googlepages.com/ubi-shadow.png
Though, it’s damn buggy and I agree that the partial transparency thing with images are really nice for usability purposes. If I remember correctly Compiz does that doesn’t it? (Can’t seem to get Compiz running at the moment so can’t test for myself, not that this is ‘on topic’ anyway…)
@abi
Thanks for the xpi, though I get an error message when using it and the commands refuse to load because of it.
Error: missing ; before statement
Source File: ubiquity@labs.mozilla.com/modules/sandboxfactory.js
Line: 1468, Column: 6
Source Code:
let suggs = noun_type_email.suggest(text, html);
Strange error… there’s only 103 lines in that file :-/
Installing and changing skins work though, but appears to be buggy(?)
When it comes to third-party commands, aren’t they able to use any html they want for the previews?
If so it could probably be left to the community to decide. Some “standardized” classnames would probably help, but otherwise the default style could be set by the command author and then it’s up to the one writing the stylesheet whether he want to customize specific commands or not.
@Irakli
You can always make one yourself, or wait for someone to make one that you like
wow.. great works….
Pingback: Ubiquity 0.1.3 Preview: Faster, Prettier at Toolness
Pingback: Aza’s Thoughts » Ubiquity: Visual Identity
Apologies for the late reply, everyone.
@David
There’s a lack of documentation here. I’ll ask around and file a bug for this. Btw, the visual glitches on OS X are reported in these two bugs:
https://bugzilla.mozilla.org/show_bug.cgi?id=445404
https://bugzilla.mozilla.org/show_bug.cgi?id=469007
@Nox
Use this updated XPI https://ubiquity.mozilla.com/xpi/ubiquity-latest-beta.xpi
It’s a release candidate and there *should* be no bugs in the error console. Changed how skins works a bit, so, I think it won’t be buggy any longer. Yep, we could have some more “standardized” names.
@Irakli
Due to the lack of a better skin, we decided to go back with the same default skin but with a opaque background rather on a transparent only on Linux. It’s hackish but it should do for now.
Pingback: Firefox Ubiquity Gets More Potent And Beautiful
Pingback: Mozilla Labs » Blog Archive » Major Ubiquity Update
DcrDuQ http://gdjI3b7VaWpU1m0dGpvjRrcu9Fk.com
Hello! I would love to give you a huge thumbs up for the awesome info you have here. I will be coming back to your blog again.