missig.org/julian/projects/jabber/iChat

iChat Thought Bubbles

This document is intended mainly for Jabber client developers (Gabber2 developers in particular) who either have not been fortunate enough to use iChat extensively or do not understand what exactly is so good about iChat. Apple has taken the initiative to release one of the most usable instant messaging clients to date—I would like to see Jabber's clients improve because of it. Hopefully Apple will warm up to our open instant messaging system and allow users to completely use Jabber as a normal instant messaging service, rather than simply through Rendezvous.

Messaging

This shot is of a typical conversation in iChat.

msgsend1

The first thing everyone notices is the speech bubbles. Yeah, they look pretty lickably silly at first. :) However, the speech bubbles are on alternate sides of the window—personally, I've never been much of a fan of right-aligned text, but it ends up working really well here. The alternating sides not only more clearly define the difference between my text and hers, but it allows the window to exist in my narrower space and still be readable.

The use of icons (avatars) instead of names is also very nice. Names take up a lot more space than these icons do, and when people actually use icons it's much faster to determine who you're talking to. For those buddies who have not set icons, a standard one is used and the name is in the title of the window.

The typing notification eliminates the need for a status bar, and is much clearer than flashing an icon. The little thought bubble disappears if I erase all my text. If she sends a message, it will appear after my thought bubble (to indicate that I started typing before I received her message—ingenious), but once my message is sent the thought bubble above her message disappears and my message appears beneath hers.

msgsend2

The placement of the timestamps is also of note. It's one of the least obtrustive uses of timestamps I've ever seen. They appear in small text centered at the top when the chat starts, and whenever there is a gap of about 5 minutes or so (I haven't determined the actual length) if a new message is sent, a new timestamp is printed.

This is bad. Very bad. Technically, I understand completely why Apple did this. However, user interface design should not be catering to the technology. Sure, it's nice to know someone left the chat and all, but I cannot send a message now. I have to go back to my buddy list and open up a new chat. This becomes very annoying for my iChat-using friends because I close chat windows a lot. I've had to change my chatting habits to leave lots of windows open. It's not so bad since minimizing the window uses the buddy icon in the dock (very cool), but we cannot duplicate that in Gabber. We will have to figure out a better way to handle closing off direct TCP connections than this.

Claire would also like to note that most of their emoticons are too happy. "They need evil stuff!"

msgrecv1

It's somewhat hard to tell, but this recently received message is in fact pretty translucent. Like the fruity speech bubbles this is deceptive. :) This seems to be a happy medium between having no window pop up at all on a received message (ICQ-style that Gabber stole with the flashing roster icons), and always popping up huge messages all over your screen.

msgrecv2

When I click the teeny window, this is what I get. This allows me to read more of the message(s). As soon as I send a message, the window grows to normal size. I can also, of course, just resize this to view the messages without responding. If I do not respond to her message, the window will return to teeny-size when I change focus, allowing me to have a lot of received messages on my screen without getting very much in the way or minimizing them.

Buddy List / Roster

Ah. The core of any Instant Messaging client.

buddylist1

The first thing I noticed was the buddy icons right there in the roster. I would like to take this time to state that Mike Lin and I thought of that two years ago. So ha!. Well, Jabber still doesn't support avatars, so neither of us implemented it, unfortunately. Again, adding the graphical element of buddy icons allows me to very quickly glance at the buddy list and pick out the person I want. No reading required.

The status icons suck. They look like lickable little mood dots of some kind, yes, but they ignore one of the primary design requirements of icons: different outlines. To be sure, there is actually a preference to change the dots to shapes (triangles, stars, squares) for the colorblind. Er...

When a buddy signs on, the buddies below them slide down and the newly-signed-on buddy slowly fades in. It takes about 5 seconds or more before the buddy has completely faded in, allowing me to see who just came online. When they change status, the buddy physically moves and rearranges as appropriate. They don't just disappear and reappear lower in the roster—that's probably why I can stand the status-based sorting in this client.

Yes, each person on my roster is taking up twice the amount of space they would normally take in Gabber, but I think it's damn worth it. I don't have to mouseover or view someone's information to find out a little bit about their status message! Sure, you can't fit very much in there, but it's a heck of a lot better than not having it at all in my opinion. Note the use of Jabber's ability to have status messages set even when you are "Available" - yey. :)

buddylist2

This is one of the more elegant solutions to the problem I've been pondering for at least a year now—how the heck do we let the user set custom messages? It saves the most recent ones for later use. You don't have to tell it do do so, and ...

buddylist3

You don't even have to type in a separate dialog. Pretty nice, except I miss being able to have longer messages and multiline messages. With Gabber2 I'll probably pick something in between Gabber's current model and this.

As a final note, yes, they do sort by user status. Of course, you can also set the sort method to first name or last name.

File Sending

Drag a file to someone on my list (Yeah, jer's been bugging me about that for a long time), and this is what comes up (after confirming that yes, I want to send Claire "Interpol").

filesend1

It's pretty much your basic file transfer dialog. I think Gabber's current one is slightly better (thanks to Jimbob).

User Info

I don't really want to end on a down note, because iChat really is one of the best Instant Messaging clients I've ever used, but I want to point this out.

userinfo1

Ugh. Yes, tabs suck and all, but come on. The "Show" pull-down gives me the options of "Address Card", "Actions", then a gap, then greyed out "Accounts" followed by this option "Chutwig". Geez. I'd rather have my tabbed user info dialog, thank you very much. The "Buddy's AIM Profile" box is way too small and does not have a scrollbar. Yes, there is more text in his profile than appears there. Let me repeat: despite the trough for a scrollbar, no scrollbar appears. In that tiny little box. I have to highlight text to scroll. I'm sure this was some sort of mistake or something and will be fixed in future versions, but let this be a warning to all you client developers out there: I will hate you if you make me scroll a tiny little box by highlighting text. Especially when it contains links. Claire just pointed out that the cursor does not even change to indicate that it is over a link. That makes it even worse.

That's it for now. I may add some information on preferences and other things later, but these are the most important parts to learn from. Thank you Apple for helping to push Instant Messaging client development into the world of usability—AOL/ICQ certainly didn't seem to care about it very much.

Thanks Claire. :)

missig.org/julian/projects/jabber/iChat
Julian Missig
Last modified: Thu Sep 19 20:45:49 EDT 2002