GNOME Foundation AGM: Design Team update

I didn’t really have any content-packed slides to show at the GNOME AGM this afternoon, but here they are anyway for anyone who wants to relive the excitement.

The quick summary for anyone who wasn’t there:

  • Over the past 12 months, the GNOME Design Team has collaborated pretty well with folks like the nautilus and control center devs to land the major design changes that those apps have undergone in 3.0, and the GNOME Marketing team to create the new website.
  • The GDT has participated in several real and virtual events including the Boston Summit, and the GNOME User Days and #gnome-design Office Hours on IRC.
  • SparkleShare continues to rock our world.
  • GDT will continue to take a design-led, holistic approach to improving the user experience in GNOME 3.2 and beyond.
  • The new HIG… still isn’t quite ready.

It’s fair to say I did feel like a bit of a fraud talking about the design team as “we”… it’s been a while since I’ve been much more than a small and increasingly-distant part of GNOME’s usability history, and I certainly can’t take any of the credit for any of the achievements I was talking about today. (Except the continued non-appearance of the new HIG, which is partly my doing, and we really do hope to have it out there in some form sooner rather than later.)

Finally, many thanks to Jon for helping out with the presentation after a slight logistical mix-up this morning!

VirtualBox 4.0.10

Today’s maintenance release of Oracle VirtualBox (4.0.10) spreads the GNOME 3 love a little further — following the fixes in 4.0.8 for GNOME 3 guests on Linux hosts, GNOME 3 now finally works glitch-free on OS X hosts in 4.0.10.

Small and fuzzy video evidence (.ogv file)

Guess this means I have fewer excuses than ever before for not knuckling down on the GNOME 3 HIG :)

Usability Team Update Update

Bastien pointed out after my Usability Team Update at the GNOME Foundation AGM today that I forgot to mention another nice little project that arose directly from the UX Hackfest in London Totem Chapters/Markers support, which is being implemented by Alexander Saprykin as part of this year’s GSoC.

I was also a bit lax in namechecking some of the people I’d intended to. So as well as Hylke Bons and Thomas Wood, who I did mention, and Bastien’s mention above, kudos also to Allan Day, Mo Duffy, Karl Lattimer, Garrett LeSage, Ivanka Majic, Jon McCann, Matthew Paul Thomas, Jeremy Perry, Charlene Poirier and David Siegel who have all been directly involved in the few highlights I had time to talk about today, and to the many others who’ve contributed to the usability effort this past 12 months.

And an honourable mention to Seth Nickell for his memorable contributions to the Hackfest :)

Whatever happened to fluid design?

I was intrigued by this Firefox heat map (which I came across via @smashingmag), showing which parts of the Firefox chrome users interact with most.

In particular, I was surprised by how much the horizontal scrollbar is used, with almost half of all users (and more than half of the Linux users) using it at some point during the study. I was also intrigued by why OS X users use the scrollbar so much less than Linux and Windows users. Darren suggested it might be because Mac laptops have had multi-touch gestures for horizontal scrolling for a few years now, which seems plausible—could also explain why Linux users made the most use of the scrollbars, as Linux touchpad drivers aren’t always as full-featured as their proprietary counterparts.

Anyway, it prompted this little rant about fluid design (aka liquid layout). This always used to be one of the number one considerations for good web page design. Horizontal scrolling in particular was meant to be avoided wherever possible, as it’s both physically more demanding (at least with a mouse or keyboard—less so with touchpad or touchscreen gesture) and more disruptive to task flow than vertical scrolling.

With web pages more likely to be viewed in a wider range of window sizes and screen resolutions than ever before, this tenet seems like it should be more important now than ever. Of course, the sorts of things we do on the web today are somewhat different from what we did ten years ago, and fluid design isn’t always possible or desirable for all of them. Nonetheless, many of the fixed width designs you see these days are just annoyingly unnecessary.

Sometimes it’s because designers or their clients are unwilling to have their pixel-perfect vision compromised by users deigning to view it into a smaller window than they’ve designed it for. Sometimes it’s down to inflexible or poorly-customized web content management systems, sometimes it’s inexperience, sometimes just laziness.

Anyway, next time you’re designing a website, just think about how and where people might actually want to use it. And bear in mind that grumpy old men like me won’t visit it very often if you make us scroll horizontally even just to see to all the navigation links across the top of your homepage, merely because we choose not to fill our entire screen with your website.

Incidentally, none of this is directed at the websites, which generally resize in a very sane fashion. So kudos to our designers for doing it right :)

Thoughts on Pattern Library categories

Most of you probably know that one of the things we’d like to do for GNOME 3.x, alongside a refreshed HIG, is produce and maintain a GNOME UI Pattern Library. (An example of what we mean by a GNOME UI Pattern is this semi-fictional example.)

I’m thinking we’d probably want a homepage that both allows you to search by text/tag, and browse by category (something like this quick mockup.) Which would, of course, mean picking some categories.

From a quick survey of other pattern libraries (which are mostly geared to web design) and the type of stuff the current HIG covers, here’s a first stab at what that list might look like.

  • Feedback: Showing messages, notifications and progress indicators.
    Examples: Alert messages, notification messages, InfoBar usage, status bar usage, focus indication, audio feedback.
  • Input: Enabling the entry of different types of information.
    Examples: Sliders, audio input, video input.
  • Layout: Arranging information and controls in a window.
    Examples: Frames, grouping, spacing, anatomy of creation vs viewer vs browser vs utility apps.
  • Navigation: Enabling users to move around and between documents and different parts of the application.
    Examples: Tabbed windows, sidebars, location bar, zoom controls, media transport controls(?).
  • Search: Enabling users to find items or information that may not be immediately visible.
    Examples: Find dialogs, in-place searching, filtering, auto-completion, Boolean queries.
  • Selection: Allowing the choice of one or more items from many.
    Examples: Marquee selection, keyboard selection, pattern matching.
  • Social: Maintaining contact information, and interacting with other users.
    Examples: Adding information to address books and calendars, Showing online presence, Initiating chat.
  • Workflow: Relating to the process/mechanics of using an application to achieve a particular goal.
    Examples: Desktop integration, undo/redo, drag-and-drop, extending open/save/print dialogs.

Feedback welcome… any obvious ones I’ve missed, or ones that seem redundant?

FWIW, I’m not sure nailing the list now is either entirely necessary or entirely possible. There’s no reason we can’t adjust them as the library grows, and I hope we’ll have some sort of tagging capability to handle the patterns that don’t fit neatly in a single category anyway. But it’s always good to start from as solid a foundation as we can :)

GNOME Usability Hackfest

Back in the Dublin office today after last week’s GNOME Usability Hackfest in London, during which I didn’t blog nearly enough.

My main goal for the week was to help figure out a plan to revise the GNOME Human Interface Guidelines, which I originally helped to write almost a decade ago, but which really haven’t kept pace with the changes in either hardware or software technology over the past 5 years.

The notes from all the discussions we had aren’t all that impressive to look at, but I think the key thing is the general agreement to have less monolithic text, and switch to more of a pattern library approach. This should allow us to react much more quickly to changing trends in GNOME UI design, maintain related patterns for different types of devices such as desktop, touchscreen and stylus devices, and even allow individual distros to customize the library with their own unique, in-house patterns if they so desire. (Which hopefully won’t be too much, but it’s clear that, for example, the GNOME-based Moblin UI is a different beast from the vanilla GNOME desktop, so the Moblin team will likely want to maintain some patterns of their own.)

I’ve already started to draft up a template for what a GNOME UI pattern might look like, and hope to flesh things out a bit more over the next couple of weeks.

Of course, many other things were discussed at the hackfest as well. Nautilus and gnome-shell were hot topics, as was the old chestnut of a GNOME control centre redesign—on that front, I ended up moderating a couple of card sorting sessions during the week where we had users categorize 100 settings into groups of their choice. Charlene from Canonical presented an Empathy usability report, partly to discuss the findings, but mostly to discuss how best to present such reports to GNOME developers. And of course, Seth’s vision of a future GNOME desktop hit the headlines, making it to Ars Technica almost immediately!

On the community front, some ideas for improving the tools we use to analyse and report usability data were also discussed. And there was a strong presence from the accessibility community, to keep us all honest when coming up with anything new.

Many thanks, of course, to Google and Canonical for sponsoring the event, and particularly to the latter for hosting us in a 27th floor office so we didn’t need to waste money on the London Eye :)