Archive for the 'Theme' Category

GNOME Summit 2010

Monday, November 15th, 2010

First and foremost I want to thank J5 for organizing this year’s event. Lacking any sort of organizational talent (have hard time organizing my own day), I appreciate the effort one has to put into making an event like the Summit happen. In addition it has been great to see the sponsor support for an important event like this, Collabora in particular (for the best kind of sponsorship ;) .

It’s always a bit amazing to walk the premises of MIT with a slightly unfair feeling of belonging there. The new media lab building is like time travelling to the future. Including the fear of robots attacking me in the hallways.

My private agenda has been quite successfully met. I have found a partner in crime for the execution of the visual theme for GNOME3 in Matthias Clasen, who has fiercely hacked at the most important bits of the widget theme to play well with the window decorations. And while it may sound like a bit of a setback to continue on “dead end street” of theme engines, we are actually going to see the work of Carlos Garnacho land and the final theme being executed solely CSS style, by designers rather than engineers. While Matthias has exposed some of the things I’d like to draw in gtkrc through the clearlooks engine, there is still things that aren’t yet achievable (such as drawing gradients for all the widget states rather than one). Also worth noting is that we’re standing on the shoulders of Benjamin Berg, Hylke Bons, Lapo Calamandrei and Thomas Wood here.


Forgive the lack of hinting on the font

You may have heard we’ve gotten the amazing Dave Crossland aboard and work on getting Cantarell ready to be used as a default screen font on GNOME3. It has been my pet screen font for quite a while despite some rough edges as it’s a typeface with the right pedigree (passionate designer understanding the collaborative free software culture rather than a commissioned work). I’m happy to have it be part of the GNOME3 identity.

System Settings work has also moved forward despite (or maybe due to) the lack of my contributions.

In the Gnome Shell land, Florian’s relayout branch is getting ready to land. Florian was quicker implementing the newest iterations than I was able to produce comps for them. It was fun to see an actual demo of something I planned to introduce.

The summit has successfully injected more enthusiasm for GNOME3. I hope the end result will show the amount of love that went into making it happen. We’re getting there!

UX Hackfest in London

Sunday, February 28th, 2010

Didn’t manage to write anything during the London UX hackfest as it felt more appropriate to steal some family time for that. Revitalizing, that’s what it was.

Engineer <> Designer

I haven’t had much time to focus on GNOME work lately. The people who made that work fun either moved on to other projects or suffered from the same lack of time. During the past week it was great to see many GNOMErs share the same design principles and being motivated to push things forward. My interest in gnome-shell shot up 1000% after talking to Jon & Jeremy.

The ever-cheerful thos walked me through the release process so I’ll be taking care of releasing gnome-icon-theme more often than we used to. 2.29.0 is out so people will finally start seeing the fruits of our long lasting labor.

The UI design sessions were awesome but we also got some visual design work done. I’ve talked to everyone about how necessary the widget-theme-color-aware symbolic icon style is and the reactions were overly positive. We’ve started on the essentials with Hylke and illustrated how these might fall in place for network manager for example:

We’ve also brainstormed some ideas for the window decoration and widget themes. Arstechnica has more details.

Big thanks to everyone making it happen. Check out the London set for more photos.

openSUSE 11.2 — the art of GNOME

Thursday, November 12th, 2009

As of today is the day you can enjoy a fresh new release of openSUSE, the mothership of projects like Banshee, Evolution, F-Spot or Kiwi.

While 11.2 defaults to KDE, we have a solid GNOME release as well. GNOME ships on both the DVD and a separate LiveCD. Now you can actually put the ISO on a USB stick or an SD card and boot from that.

Styling of 11.2 may be a bit different to what you’d expect from SUSE and is a bit of a return to the golden Ximian days. Darker, less saturated shades of the background let your content get all the attention. It’s still green though :)

Gilouche has been the openSUSE theme for a while now and 11.2 introduces a new default, Sonar. Sonar is a metatheme consisting of window manager decorations and a widget theme. Unfortunately a key element didn’t make it in time — the icon theme. By default you still get the familiar Gilouche folders. You can, however, install the Sonar icon theme from Factory. It’s also the first time we’re using the openSUSE font, 5th Leg, for window titles. 5th Leg is the result of openSUSE’s Hackweek and have to express my gratitude to Novell for this event yet again.

    

SUSE Moblin

Sonar isn’t the only new theme addition though. Building on top of some great design coming from the openedHand/Intel team working on Moblin I’ve experimented with a simple glyph style (although slightly less minimalistic) and an easier workflow for creating such an icon theme. While the font approach ended up as a failure, the SUSE Edition of Moblin is now shipping a theme based on the foundation of the hackweek experiment.

Unfortunately the theme isn’t independent of the widget and WM theme color yet (if any hacker is interested in figuring out how to best recolor the SVG glyphs based on gtk colors, please step forward ;) . The good news is that you can try the complete package on the desktop even if it was designed for a small netbook screen (with a clumsy touchpad). It works quite well if you have enough screen estate.

You can grab the latest and greatest moblin-cursor-theme, moblin-icon-theme and moblin-gtk-engine from my personal repo.

Go ahead, try openSUSE 11.2. We love GNOME too!

Gwibber

Wednesday, February 25th, 2009

I looked around for a decent dark theme for Gwibber today. And since I haven’t found any, and saw that most of the themes go with the horrid table based layout, I went ahead and made one.

It needs to have proper gtk color support, hopefully soon(ish). At least I have a master to go to :) .

To install, untar to ~/.local/share/gwibber/ui/themes/.

But it’s just a mockup…

Wednesday, June 25th, 2008

From time to time I get asked why has GNOME become so conservative when it comes to widget theming. I generally answer that’s a good thing and simply an effect of the default theme to have matured and becoming usable to the majority of users.

At the same time, you don’t see many designers interested in theming gtk+. Maybe due to the inefficiency of the theming functionality in gtk, or rather ignoring its target audience. Themes in gtk still lie on the shoulders of theme engine hackers. While there are exceptions to the rule, usually those are the people who have their ‘good enough’ limits in visual design set very low. To show this more clearly, those are the people who call this a rounded rectangle:

.

In addition they would not find addressing corner case situations where one needs to remove a 1px padding between certain elements worth their time. In summary they should NOT be working on widget themes. While the following seems to be a general knowledge, I haven’t seen anyone summarize what we are actually lacking in the field of gtk+ theming. Here’s my suggestions based on my theming experience.

  • Drawing / box model. It should be possible to do some basic draw operations in a theme. A typical designer will be familiar with the web/CSS box model. From the theme it should be possible to draw a border, add a margin and padding to a widget/part, specify corner rounding solves most of the drawing needs if it’s accompanied by next item.
  • Bitmaps. Most important is being able to use an image as a background. In addition to the CSS tiling and positioning, it would be beneficial to be able to stretch the bitmap to the size of the box/widget.
  • Gradients. Drawing gradients as background/fill and box borders.
  • Compositing. An extremely important feature would be to properly composite objects with alpha transparency. We should be allowed to use RGBA bitmaps, setting a global opacity of a box/widget and being able to use alpha transparency in gradients.
  • Selectors.This one is slightly controversial, as the theming is already using a functional matching syntax, yet for a designer a CSS-like selectors would be much more understandable and approachable. With a tool described below, this may not be as important.
  • Debugger. For a web designer, one word would sum it up — Firebug for widgets. Being able to visually select a widget on a window and be able to find it in the widget tree(?) and see its associated style properties would be a dream come true. A tool to help form efficient selectors. A tool to measure speed implications of certain operations.

And if somebody would like to rewrite theming from ground up, I would suggest form/functionality separation. Having actual layout and positioning functionality in the theming, it would stop being a pain to conform to the GNOME interface guidelines. Application developers would worry about what type of input widgets they would like to use, not how to indent labels or how many pixels is the suggested padding between X and Y.

Update: Turns our Rodney has touched the topic around 3 years ago. While I do refer to CSS a lot, I’m putting the basic drawing capabilities to theme authors in front of all the other items. Having an intermediate layer in the form of a specific theme engine as cimi mentions in the comments is a good-enough short term solution I guess.

openSUSE 11 Installer

Thursday, February 14th, 2008

hackweek

I have spent most of my hackweek mocking up and styling the new Yast installer for openSUSE 11. Coolo’s implementation of the old mockup I made for 10.3 really showed things can be done.

I must say I am very impressed with Qt CSS-like styling (yea, proper documentation ;) . It felt very refreshing compared to the usual minor gtkrc tweakage I need to pull off from time to time. The stylesheet remains very readable to people with web experience. You can do funky things on top of the common CSS attributes – use gradients on fills and borders, RGBA colors (yea, things really composite well), and combination of both. Coolo also added scalable backgrounds hack for the extra abuse we might need.

.
Work in progress – avoid color banding. I know, it’s GREEEEEEN.

The slight limitation is 16bit color, so all the gradients needed to be dithered, but I’m quite fond of the result (still WIP, mind you).

.
Not a mockup, this is an actual rendered YCP template.

You can see some scaling artifacts which should be gone with smooth filtering enabled now. Now on to fix some of the sucky images of the slideshow. openSUSE 11.0 is gonna rock.

Dark Themes

Tuesday, November 27th, 2007

I’m excited to see interest in dark widget themes. I’ve grown to love a dark environment as I usually work on graphics or photos and dark neutral gray just makes the content come alive.

#
Darkilouche theme.

It has been suggested to ship some dark themes in gnome-themes in the past, but I would go a step further and propose using a dark(ish) theme by default in stock GNOME. Having a dark theme would make perfect sense for vanilla GNOME. It would expose theming issues which are easily ignored when all you run is a light background. It will not really affect huge number of end users as most distros ship their custom themes though. But the core developers will have it up their faces :)

No other desktop I know is using dark widgets, it would make up for a distinct GNOME visual style to an extent the nature-theme we discussed at Guadec ever would. Let the distros be held down by conservatism, let’s be bold and go dark!

Bluescreen High Res Images*

Wednesday, October 31st, 2007

While I can’t disagree with reasoning why this is bad, I also find it kinda neat that Apple did that in a world full of fake political correctness.

bsod
Graphic on the left © Apple, Inc. Inappropriate use of the Windows logo on the right, me.

Having a bluescreen is actually just as recognizable as using the windows logo, which they likely can’t use due to trademark (just like us). The association is just as strong, the metaphor works (Well, if it was the CIFS protocol that was the important bit and not the fact it’s a remote share). BSOD *is* Windows, just like bucket of mayo and a few chips is Belgium even if there’s plenty of countries that consume more of each.

* Some refer to those as icons which I still can’t make myself to.

Miro TV

Thursday, August 9th, 2007

Miro

This is the sort of groundbreaking application that I’d love to see us shipping by default in future. Most comfortable viewing of videocasts, easy searches on youtube or even your local drive. It tops iTunes by a large margin. Sadly the mac client is tons more polished than the Linux one.

You may know it under its former name, Democracy player. It has gotten a very nice face lift recently, including the app icon from John Hicks. Too bad the few tango icons are horribly broken. I smell Adobe Illustrator involved.

Darkilouche 0.2.2

Monday, February 26th, 2007

With some help from the nice folks at #gnome-art, I’ve updated my dark gtk theme, Darkilouche, to use symbolic colors. The theme appears to look very similar to my previous effort, but symbolic colors make gtkrc much more bearable to live with. It became a lot more readable – shade (0.6, @selected_bg_color) will tell you a lot more than
#ff7423. And for the user it’s absolutely lovely to be able to define a basic set of six colors and have the theme shade appropriately. I love that about metacity themes.

#

Local Gtk Themes

Since I brought up metacity, I’d like to throw a bone if some art-inclined hacker feels compelled to pick up.

Observing stars is better in the rural areas and not in a light-polluted city. Similarly Darkilouche is sweet for artwork/photo editing apps. It brings up the actual content, not the background/widgets. That’s also the only thing I don’t like about flickr, photos tend to get lost in the shining white surroundings.

Majority of web pages use a white background, and editing documents on light grey feels unnatural to many people. So a dark theme doesn’t work so well for those applications. Gtk+ allows to launch an application with custom gtkrc file. To launch F-Spot with Darkilouche:

GTK2_RC_FILES=$HOME/.themes/Darkilouche/gtk-2.0/gtkrc f-spot

But there is something that bothers me about using Darkilouche for GIMP, Inkscape and F-Spot only. Good metacity themes don’t hardcode colors, but make use of the colors defined in the Gtk theme. Metacity currently doesn’t consider local themes, so the window border is usually a lot lighter for the ‘dark apps’ and creates an unnatural frame.

I have a dejavu feeling about it, but I’ve filed a new enhancement bug for this on metacity.

Maybe a workaround in making Devil’s Pie forcing a theme with hardcoded colors for the specific app windows would be a more
feasable approach?