Zero to One-Eighty » ui

A little energon and a lot of luck

Adrian Cooke — Sun, 06 Sep 2009 20:26:20 +0000

One wonders: is Mac OS X’s icon for an installer package supposed to look like an Energon Cube?

Venus wi-fi trap

It’s the little things, Camino

Adrian Cooke — Sat, 22 Aug 2009 19:09:42 +0000

The Little Browser that Yes-We-Cans

It’s the little things that make me want Camino to succeed. There’s an attention to detail that even the Safari team can’t match sometimes. This is my new favourite: when you’re browsing with no location toolbar, just type ⌘ + L and you get a location bar drop-down sheet that disappears when you type into it and hit Return. (By contrast, Safari’s behaviour under the same conditions is that ⌘ + L knocks you out of hidden location toolbar mode, so if you want things the way they were you need to re-hide that toolbar once Safari has fetched the new page.) With Camino, the main things that you can do with the location toolbar you can do with keyboard commands and nice touches like this one. It’s the minimalist’s browser. F.y.i., I’m using version 2.0b3.

Sketches for iPod (and iPhone)

Adrian Cooke — Wed, 08 Jul 2009 05:54:25 +0000

Sketches is fun. Working with the canvas using gestures is both intuitive and clumsy at the same time. The minimalist interface doesn’t let you do much, though it’s a lot considering the small number of UI elements. I made this in five minutes, during which time I realised that clip art isn’t inherently depressing, it just becomes that way in the hands of the Microsoft Office engineers.

Navigation via the link element

Links: captioning, accessibility, reading, etc.

Adrian Cooke — Mon, 24 Nov 2008 03:28:19 +0000

This is how the web gets regulated #: Timely article on A List Apart by Joe Clark about the (appalling) state of captioning on the web, and the possibility of a legislative requirement soon in Canada and Australia. It’s pretty dismal currently despite the fact that WCAG+Samurai and WCAG 2.0 require (yes) captioning for video. He mentions, and criticises, YouTube’s closed captioning model.
Blue Beanie Day II #: Blue Beanie Day II is coming up. Show your support for web standards and accessibility by wearing a blue beanie on Friday, November 28, wherever you lurk on the web. Here’s some photos from the inaugural BBD last year.
The 100% easy-2-read standard #: Another touchstone article about usability and web text by Oliver Reichenstein, author of the reasonably infamous “Web Design is 95% Typography” essay. This one is just as thoughtful, more practical and very easy to read :P (Via Joe Clark.)
Notepad++ and E Text Editor #: I’m looking for a Windows text editor for occasional use on my work PC. According to a couple of Mac-to-Windows switcher threads on Ask MeFi, Notepad++ (free, donations accepted) is pretty popular. E Text Editor, “the power of TextMate on Windows,” looks pretty nice in the promo video, especially the way that code completion works in HTML mode (US$35).
Some thoughtful UI on ffffound.com #: Ryan Singer looks at Ffffound’s use of keyboard shortcuts to navigate images on the site. “J” skips you down the page to the next image, “K” back up, and if you get to the end of the page the same key requests the next or previous page instead. Rad. (Via John Gruber, who notes that the same shortcuts work within posts on The Big Picture.)
Social Media Classroom #: SMC is a Drupal application that provides a set of tools for web-based collaboration (wikis, blogs, media collections, Twitter and Delicious integration). It was developed by Howard Rheingold with the goal of increasing and facilitating media literacy. It looks like it would make Drupal an even better tool for communities who need to meet and work together online. My friend Brian Christiansen worked on the UI.

Future of Web Design NY

Adrian Cooke — Wed, 12 Nov 2008 06:48:06 +0000

The Future of Web Design in New York hit the high notes again this year.

Derek Powazek’s talk on group-generated intel^† was a standout, particularly his discussion of James Surowiecki’s The Wisdom of Crowds and how it relates to designing web applications. I bought the book on my way home, and just a few pages in the enjoyment factor is high. I also really liked Paul Boag’s presentation on how to work with clients, a healthy mix of energy, sarcasm and Pommy hubris.

Chris Lea, Joe Stump, Ryan Sims, Daniel Burka and Liz Danzico.

Liz Danzico led a panel discussion at the end of the day on how designers and developers communicate with each other. This was rowdy and good. One thing came through loud and clear over the banter: communication works best when issues are framed in terms of problems to be solved, rather than as requests for a given solution.

† Crowdsourcing, ew.

State of the Web 2008

Navigation via the link element

Adrian Cooke — Tue, 01 Jul 2008 03:58:00 +0000

Pretty much every navigation menu on every site is different. They have commonalities, but obviously they’re not exactly the same. The minute you want to find something else on the site you’re viewing a small part of your brain energy goes into figuring out what’s available to get you there. You probably look for a navigation menu, some persistent pattern of options that outlines the site’s scope and allows you to move across, down into, or up and out. Unless the designer hates you, you’ll probably find the navigation in the same place on each page. It will take you time and effort to move your mouse there. Not much, but some.

Opera’s Navigation Bar.

Another way to provide navigation is through the page’s meta information. If you mark up the head of each page with link element relationships to nearby documents then visitors with a capable user agent can navigate to nearby stuff using their application controls. Opera is one such browser. Note the available Home, Previous, Next and Author buttons on the lower toolbar in the screenshot. There’s also a Firefox plugin called Link Widgets that works in a similar way. The blue arrow buttons are Top, Up, Previous and Next though there are others you can add by customising your toolbar.

Link Widgets for Firefox 1.5⁺.

In this scenario you expend some brain energy seeing which options are available, and some time moving your mouse to the one you want, say the “Previous” button. But the next time you come to a site that supports this type of navigation, you know those buttons are in exactly the same place, the same distance from each other, the same distance from your Reload and Back buttons, i.e. not far.

In HTML4 this was the intention of the link element: to provide a way for the browser to render links through the user interface (though I just learned about it). Opera’s implementation is quite addictive—fast the way a feed reader is when you’re skipping through a list of posts. I’ve no idea how widely supported this is, but it’s another tick for Opera. I think they are slowly winning me over.