[Adium-devl] Adium tooltip redesign

Peter Hosey boredzo at adiumx.com
Mon Jun 18 03:35:34 UTC 2007


On Friday, while we were at WWDC, David, Colin, Devin Lane (DevG5 on  
IRC), and I set about redesigning the Contact List tooltip.

You see, it breaks on Leopard, and while investigating, Colin found  
that the current implementation of the tooltip just doesn't make  
sense. It has no instance methods whatsoever, draws into its view  
rather than having the view do that, etc. Basically, it's bad, and  
ought to be replaced outright. Doing so will hopefully fix the  
strange behavior on Leopard as well.

So there we sat, in the Compatibility Lab (thinking it was the UI Lab 
—oops), mocking up alternative UIs for the contact list. Shortly  
after we began, Andy Matuschak (creator of Sparkle) arrived and  
provided some user feedback for us. So we got a lot done.

In addition to David working in Photoshop, I drew sketches on a sheet  
in my sketchbook. Here are the two pages, showing the tooltip as it  
evolved on paper from what we have now to what we ended up with:

	http://flickr.com/photos/boredzo/559105967
	http://flickr.com/photos/boredzo/559105971

Since it shows everything, Chris (I showed it to him last night,  
after arriving home) found the sketch somewhat hard-to-follow. I've  
since added descriptions of what's going on, and here's a mock-up  
that I made in Lineform (also after arriving home) showing only the  
current plan for the tooltip:


Also, David's mock-up in Photoshop shows the tooltip and the selected  
row offset to the right by roughly 16 points. I'm not sure how I feel  
about that.

One idea that we had that isn't in that mock-up (it's in the paper  
one) is some buttons, with this appearance:

	
We whittled the list down to:

	New Chat ▼
	More Info…
	Transcripts
	Send File…

New Chat would eventually be a pull-down menu like the PDF menu in  
the Print sheet, but unless there's an audio or video plug-in  
installed, it'd just be a plain button labeled New Group Chat.  
Somebody suggested cutting out Send File as well, so that's struck  
out in the paper sketch.

Chris and Andy both were not particular fans of the buttons, though I  
will say that there is precedent (but I can't say what it is). And of  
course the New Chat button is bound to be at least as controversial  
as the PDF button.

We thought of several different ways to bring up the new tooltip.

⁃ One way would be simply hovering, like the current tooltip.
⁃ An application I cannot name (*cough*it'sinLeopard*cough*) has a  
simple “i” button (like that found in various toolbars, e.g.  
Xcode's) on each row of its table view; clicking that button brings  
up a view not unlike the one shown above.
⁃ David suggested that clicking once on the row should summon the  
tooltip. I further suggested that pressing right arrow while it's  
selected should bring it up (a small overload of standard outline- 
view behavior, though the tooltip would not necessarily be inline in  
the view). The disadvantage to a click is that it differs from the  
existing just-select-it behavior.
⁃ I think somebody suggested double-click, but we dismissed this  
quickly, since it would break the double-click-to-open-a-chat  
standard. I list it here for completeness.
⁃ Later, David also thought of having a little tab that protrudes  
from the row, probably on hover. That tab would have the “i”  
button in it. This is shown in the paper mock-up, on page 2. (The  
expansion effect depicted was posited separately, and would probably  
be applied no matter what method is used to summon the tooltip.)
___________________________________
\ Peter Hosey / boredzo at adiumx.com
PGP public key ID: C6550423 (since 2007-01-01)


-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://adium.im/pipermail/devel_adium.im/attachments/20070617/f55e0b90/attachment-0001.html>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: Adium contact list tooltip mockup 200706162257-nq8.png
Type: image/png
Size: 14005 bytes
Desc: not available
URL: <http://adium.im/pipermail/devel_adium.im/attachments/20070617/f55e0b90/attachment.png>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: Gray plastic button-nq8.png
Type: image/png
Size: 886 bytes
Desc: not available
URL: <http://adium.im/pipermail/devel_adium.im/attachments/20070617/f55e0b90/attachment-0001.png>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: PGP.sig
Type: application/pgp-signature
Size: 186 bytes
Desc: This is a digitally signed message part
URL: <http://adium.im/pipermail/devel_adium.im/attachments/20070617/f55e0b90/attachment.sig>


More information about the devel mailing list