Tamir Khason – Just code

Line-Of-Business vs. Beautifulness or two dogmas comparison as exemplified by two Twitter applications

Today I want to speak about two dogmas: design and functional driven programming. As the example of those two approaches, I want to introduce two Twitter clients: *Chirp by thirteen23 and TwitterFox by Naan Studio

As you can see, *Chirp is state of art application with outstanding user interface, and well-defined usability studies. While TwitterFox is wacky grey boring kind-of-grid only. However, you cannot judge app by only how it looks like. Let’s try to understand first what’s for you need twitter client?

Defining application goals by user story

I’m using twitter as quick and handy business tool to write my thought, feelings and everyday events. It is not my main (not even secondary) task during the day, so I want to be able to open, write and forget. Thus, I need an application, that can be invoked by one click and dismissed after writing. Also, I do not want background application to gasp valuable space in my screen, when not in use. Thus it should be background process with reduced workset and one textarea, to be focused when the main window become active. Also the application should hide itself when unfocus, yet be able to notify me about events without disturbing.

Let’s see how it done in *Chirp:

• 140MB workset
• No ability to hide
• Bouncing thingy at left upper corner to disturb you – it designed as you main desktop beautifier.
• No ability to know that new twittes arrived without showing main window
• Twit process required to click additional button (named “Update” for some reason)
• If you not finished typing, you can either dismiss all text of post it.
• Strange 140 characters countdown on background absolutely esthetical, yet very disturbing.
• You cannot type more, then 140 characters – this restricted by textbox. If pasted bigger text all additional characters truncated.
• You need mouse to operate an application

Now TwitterFox:

• 10MB workset
• You can hide it by hitting escape or clicking X button
• Small and portable without disturbing elements – it not designed as your main everyday app.
• New twits counter over small icon in browser tray, all other notifications can be disabled
• Once focused text are become active, expanded automatically and ready to write
• If you’re hiding it without clearing area, all un write text remains – you can clear it by one click
• Small 140 characters countdown which is visible only when typing
• You can type more, then 140 characters – counter becomes red, and you cannot post, however you’re able to fix, by dismissing unnecessary spaces or characters.
• Can be operated by only keyboard.

Bottom line: *Chirp designed to show how good it looks, while TwitterFox to twit only. Thus for my specific user story TwitterFox won!

Defining functional specifications

Next task defined for Twitter is read other twits. I used to read all my following and followers when I have free minute. Sometimes I retwit things, rather often reply followers and read replies and rarely send direct messages.

*Chirp provides twit area without scrollbar, yet not restricted to number of twits. Other words, you can scroll with mouse wheel only or by holding somewhere inside and dragging unlimited up and down. When the mouse is over specific twit, it fades and show three buttons: reply, direct and retwit. Also each twit contains the name of the client was used (just like in regular web interface). When clicking user avatar it brings to special internal screen with last twit of the user, information and statistics about him, three functional buttons: UnFollow, Fave and Block and huge button Get User’s Tweets. When clicking the line displays the time of the twit it puts twit url into clipboard.

Also *Chirp contains five main functional buttons: Faves, Home, Direct, Update and Refresh. When Home tab unfocused (for example you’re on other screen), it also displays a number of new twits.

Error screen of *Chirp is really odd. It contains everything you not really need to know and beautiful whales moving on screen.

TwitterFox is much simpler. It contains two buttons on mouse/keyboard over – reply and fave. When clicking on user’s avatar it opens it’s page in Twitter with all necessary information. Main TwitterFox window contains three buttons: Recent, Replies, Messages.

No doubt, that *Chirp provides much richer functional spec, but wait, am I really need all this? I told earlier, that I used to read twits and replies, while *Chirp has no such view at all. You can easy copy twit url into clipboard, but what for? Also, you can read  bio and statistics of people you following whenever you want without opening browser window. But how often you’re doing that?

TwitterFox concentrated on functionality – twit, read, reply, read replies (and direct messages) – base tasks , Twitter designed for. It also marks replies with contrast color in public timeline, while *Chirp has inline reply functionality with threaded discussions support (which is very odd for Twitter)

Bottom line: *Chirp is enriched with not useful features, while TwitterFox contains only things, you’re use. Thus for my specific functional requirements TwitterFox won again!

Developers vs. Designers final round

So, we already understand, that *Chirp is an application, designed to show how skilled thirteen23 designers are. And it achieved this goal. The application is state-of-art, looks and designed very well with taking into account even small details, however it huge, unusable for everyday twittering and extremely slow. This is a general example about Designers’ doctrine.

TwitterFox is very ugly, but concentrated on functionality, tiny and reactive. It includes only features are necessary for twittering and has no other goals. So, this is a general example about Developers’ doctrine.

Is it possible to messmate those doctrines? Probably it is. And it is really simple. Each one of actors should do his own work. Designers should design and Developers – develop. I spoke about it a lot during my lectures, I’ll speak about it also at 11th February in user group meeting. By now, when you know how I see Twitter, you can start following me. Also, I’m interesting to hear your ideas about Designer-Developer intercommunication. It is not just about Microsoft way

Have a nice day and be good people.

You may also be interested with:

1. WPF Line-Of-Business labs and Silverlight vs. Flash
2. Open Source licenses comparison table
3. Quick Silverlight (and WPF) tip: How to write program without XAML
4. Consultants for charity
5. Finally I can reveal stuff I working for last half year!

January 30th, 2009 · Comments (7)