Tag Archives: hig

Weird App Store buttons

Screenshot of `App Store.app` showing title bar buttons out of place.

Why did Apple allow [the new App Store application][appstore] to ignore the [human interface guidelines][buttons]? It isn’t like the toolbar is doing anything radically different to other information browsers, nothing that might warrant exploring new interface ideas.

It just looks odd, an arbitrary inconsistency that would be simple to correct.

[appstore]: http://www.apple.com/mac/app-store/
[buttons]: http://developer.apple.com/library/mac/documentation/UserExperience/Conceptual/AppleHIGuidelines/XHIGWindows/XHIGWindows.html#//apple_ref/doc/uid/20000961-TPXREF51

Chrome’s annotated scrollbar

Google’s [Chrome Web browser][chrome] is very interesting: it breaks quite a few Mac interface conventions (for better or worse) and adds some extra, just for you.

Macintosh scrollbars work well. You can use the Appearance panel in System Preferences to change a couple things, such as whether to put the arrows at the ends of the scrollbar or at one end together (you can use [TinkerTool][tinkertool] to access more choices if you fancy) and those choices take effect immediately in a well-behaved Mac application.

Chrome is a bit naughty in that it will use your scrollbar settings but only looks at them when it starts. If you change the arrow setting while Chrome is running it will ignore your changes until the next time it launches, whereas a *proper* Mac application picks up those settings immediately.

Naughty Chrome.

In return for not honouring your settings immediately, Chrome’s scrollbars exhibit a fantastic behaviour: overloading the scrollbars with useful information.

If you do a word search in a Chrome window, you will see orange marks in the vertical scrollbar which indicate the location of all the matching words in the document.

Nice Chrome.

In [Jenifer Tidwell][tidwell]’s book [Designing Interfaces][di] she calls this design pattern the [“annotated scrollbar”][as].

[tinkertool]: http://www.bresink.com/osx/TinkerTool.html
[chrome]: http://www.google.com/chrome
[tidwell]: http://jtidwell.net/
[di]: http://designinginterfaces.com/
[as]: http://quince.infragistics.com/Patterns/Annotated%20Scrollbar.aspx