Posts Tagged ‘product layout’

Remember The Milk – Pushing the AJAX Envelope

Tuesday, January 6th, 2009

Anyone who has read Getting Things Done by David Allen knows that a to-do list, or rather several different to-do lists, is an essential part in proper time management. However, even people who haven’t adopted GTD’s methods, use lists as an intuitive way to remember day-to-day tasks.

Remember The Milk (RTM) is a web-based task manager that allows us to manage our to-do list from any computer, using many types of appliances, do it either online or offline, and also sends us reminders to our email box, IM or mobile phone.

I signed up to RTM and started using it immediately. I was impressed with the clarity of the product’s implementation and by its ease of use. I was also very delighted to see a state-of-the-art web application that takes advantage of the full scope of the browser’s capabilities, coupled with an asynchronous client-server communication via AJAX.

Following are my thoughts and impressions on RTM as a product.

Name: Remember The Milk
Website: www.rememberthemilk.com
Type: Task manager, to-do list
Remember The Milk is a task- and time-management web application. It allows users to manage tasks from any computer as well as offline.
Remember The Milk

Value

We all make lists – grocery lists, task lists, guest lists, play lists… It’s how we’re used to converting what needs to be done from our head to a recorded media. All it usually takes is a pen and a sheet of paper, and that’s how the vast majority of people manage their lists nowadays.

Taking a commonly practiced task such as managing a to-do list and creating a product out of it requires something very important: it requires a basic understanding of how people usually perform that task, and trying to create the right usability so that it would fit that same thought process.

RTM recognizes this basic need to make to-do lists, and enhances the widely practiced paper-age technology in two major respects: quality and accessibility.

Quality

Task detailsPaper and pen have a very limited feature reach – it only goes as far as writing down what’s in your head. Digitizing to-do lists allows us to improve the quality of our to-do lists in two ways:

  1. Structure. A digital companion for our tasks suggests and even asks for data items on our to-do list items that we normally wouldn’t think of, or otherwise wouldn’t take the time to write ourselves. Things like due date and location are probably more common in our task-listing thought process, but recurring, time estimation, and number of times postponed is usually not. This kind of structure helps us create better quality tasks, with more pertinent information that actually helps us perform them.
  2. Assistance. RTM, as a data-based application, takes our task information and uses it by actually helping us perform that task. It does that by organizing these tasks according to categories (personal, study, work), sorting according to due date (or overdue date), and sending us reminders (through many channels – IM, mobile phone, or email)

Accessibility

You can take your paper list with you, but it’s no match to the availability of the web or your cellular network. Pairing the higher quality of information that RTM has created for us with the ability to access it from anywhere, using many types of devices in our arsenal (mobile phone, BlackBerry).

What else?

RTM does a very good job in answering our need for higher quality tasks with better availability in managing them. This is something that another task management system – Outlook – doesn’t do to the full extent. These advantages would definitely drive me to abandon my old paper and pen, and maybe even my Outlook Tasks and adopt a more valuable solution.

The one thing that’s missing here is the ability to assign tasks to people. RTM went a long way when defining different categories for tasks, such as personal and work, but didn’t provide any means to collaborate on tasks properly. Sure – I can share my tasks with other people, but that particular feature’s value is much smaller than actually collaborating on a specific task.

Other applications, such as Toodledo or KonoLive, allow me not only to manage my tasks, but also takes task management to the corporate level, allowing me to manage tasks with other people. Some of these tools are quite complex in terms of task and even project management, but one does not need to go that far when concerning a popular application like RTM.

Providing a simple assignment of a task to one or more of my contacts would be great. Of course, this opens up a can of worms – deciding when the task is done, task administration and so on, but I think that if you make tasks of higher quality and easily accessible, they should also be social in a sense where the basic functionality extends to my contact network.

Needless to say that this will also improve the application’s viral nature.

Pro account

RTM offers a pro account to those who pay $25 a year (a sort of “golden price” – an amount we accept to pay annually for services). The pro account provides me with more connectivity options – to my mobile, BlackBerry, etc.

One could argue for and against it – the basic functionality is good enough for me to use the product, while the advanced features are more suited for a more mobile, and most likely more professional (big assumption here) user.

However, creating a pro version by adding new functionality could be dangerous, simply because a competitor might come along and start a feature-battle with you. This means that if a competitor comes along and provides the same functionality for free – people may move to the other side.

PTPOne curious element of the pro account is the Pro Tester Program, giving access to pre-release versions. It seems curious to me that I am expected to pay an annual fee to become a beta tester… Beta testers should be encouraged, if not paid to.

Value summary: Improves the quality and accessibility to my tasks, allowing for better task management. Does not allow me to assign tasks to other people.

Usability

This is perhaps RTM’s forte. The application’s usability is definitely on the right track of becoming a highly valuable product. Here are a few highlights:

The web on your desktop – AJAX at its best

The guys at RTM have done something amazing – they’ve created a web application that feels like a desktop application. Only a few other applications have achieved what RTM have – applications like GMail and Netvibes immediately come to mind. And it makes perfect sense – all of these apps are tools where I manage my own content and use daily.

Reading about RTM at LifeHacker, I’ve learned that co-founder Emily Boyd and her colleagues were impressed by GMail as an AJAX application, and went on to create their own. And I say well chosen and well executed! I believe that all web applications that position themselves as a tool should follow their lead.

When navigating through the app, the things you notice immediately is that there are no page reloads; however, the application data stays updated at all times. It’s as if the browser and the RTM servers are communicating without refreshing the display – exactly how an AJAX enabled application should work.

Usability flow

In terms of actually working with the application, RTM went ahead and considered the user, by making things easier for us. When adding a new task, no dialog box is necessary – a new line is created in the task list, and you simply need to fill in the task name. Then, to fill in the details, you simply click a field on the task details box, and type away.

This is great. Dialog boxes and popups are annoying, and in most cases unnecessary. RTM did a great job not only avoiding them, but mainly making us feel as if we’re really operating a dashboard rather than a window-happy application.

Formalizers

Another huge advantage is the use of formalizer fields. I’ve discussed formalizers before a couple of times, and RTM appears to know their stuff when it comes to text recognition. When filling in the due date, for example, there’s no need to fill in a form or play with complex calendar controls – you simply type the date and the text recognition engine accepts it. You can also type relative dates, like “tomorrow” or “in a week” – and RTM will understand. It even accepted “every fortnight” in the repeat field and converted it accordingly. That’s awesome!

Date formalizer

Keyboard shortcuts

Another leap forward RTM has made, which is not hugely difficult technically but very useful, is the use of keyboard shortcuts. Certainly this is something that by its nature is aimed for more advanced users than novices, but it certainly shows that RTM are serious about making their product resemble a desktop application even more.

Undo

A proverbial cherry: undo. There’s nothing that says desktop application more than undo. RTM allows you to undo many of the actions you took, like editing fields, for example. This is simply wonderful! And that’s all I have to say about that.

Mashup

RTM allows you to add a GMail widget as part of GMail Labs. This is a very clever idea, since many people already use GMail as their main mail client. With Google Calendar and the RTM widget placed on the same page as your mailbox, you have an ample substitute-Outlook experience, online, accessible from everywhere, and – most importantly – free of charge.

Offline

Nice one! You don’t have to be online in order to work on your task-list. Probably one of the biggest problems with web applications is that they require you to be online, so for the traveling breed of us it is basically unusable as a tool that we depend upon.

Go offlineWith RTM, you can simply go offline and keep on working, and once you go online the data will be automatically updated with your online RTM service. So, if you’re on a plane and work on your to-do list, you can still use RTM as your main tasks application.

Notes and suggestions

Note: The whole concept of formalizers is not to force people to think like computers but to make computers think like people. So if you’ve already summed up the courage and went for such an advanced feature, you better go all the way.

Suggestion:

  1. Not all date-time-related natural language terms were accepted; the “time estimate” field didn’t approve of “a day” or “four hours”, which is only part of the terms that were left out. Those needed to be addressed as well.
  2. I would also add holidays: “next Christmas” should be popular, or “Memorial Day.”

Note: Also, understanding the human thinking process, as said before, is most important in an application such as this. Tasks sometimes pop into your head in chunks rather than one by one. If your kid has a birthday, for instance, you might need to do several things in order to arrange it – find a venue, buy a cake, select a present, and look for a clown. So a flow of tasks start pouring out of you.

RTM’s way of adding a task is by clicking the Add Task link; however, when the task chunks start flowing, this might be one click too many.

Suggestion: I would place a Quick-add textbox right above the tasklist, so that I can immediately fill in a task name and it’ll be added to the list once I hit Enter; the cursor will then focus on the text box again, ready to receive the next task.

Note: Some features, like delete task and set priority, are placed under a dropdown menu, very similar to GMail. GMail’s choice of placing the Delete function in a relatively hidden place was to state a point – with GMail you don’t really need to delete emails, since you have such a huge mailbox. Here, this feature is absolutely necessary and should not be hidden.

Suggestion: common functions, such as Delete and Set Priority should be located at a prominent place. I would add a rollover toolbar, that shows itself once you hover on a specific task, with a Delete button next and a Priority gauge.

Usability summary: Very advanced desktop-like behavior, which serves the purpose entirely.

Layout

RTM’s layout is great – it’s simple, usable, easy to navigate through and generally makes perfect sense.

Layout

The screen is generally divided into a main panel, located at the left, and a details panel at the right. The main panel shows the “meat” of the application’s content – in this case the task list (with other information on different screens), and the details side-panel displays contextual information on the items we’re now watching.

A main menu at the top-right, a sub-menu as tabs located in the screen’s main area is a simple and effective way to manage navigation.

One thing that should be noted is the contextual info box; it’s located on the details side-panel, and provides helpful information in relations with the action you’re currently taking. This is extremely helpful to us users by providing both useful assistance, and sometimes displays a call-for-action.

Layout summary: Simple and elegant. The contextual info box helps with tips and calls-for-action.

Design

Here, we hit a bump on the road.

I’m not talking about the brand; the logo, with the product’s name written in blue script located next to a comics-style cow’s head could be either liked or disliked, for many reasons on both ends. Think as you may about it – at least it’s iconic to the point where it’s memorable. This, according to many, is what makes a brand work. It’s instantly recognizable and associative to the product’s name. At the end of the day – it’s a matter of taste.

However, the actual user interface element makes a grand statement:

It’s white. There’s white as far as the eye can see, with only the text to keep it company. As white as milk.

So what? Well, white in itself is not a problem at all in product design, as long as the functionality aspect is not impaired by this decision.

I see two main issues here with the decision to make the site’s design as plain as it is:

1. No focal points

This is not just a website – it’s an application people use on a day-to-day basis. Normally, saying something like that about a product is a great thing – it means it brings value to people and therefore succeeds in it first task as a product. But an application needs focal points – visual markers that help the user use the application better and more easily.

This is a particular problem with the selected design, especially since the chosen media – tasks – is so text based. There are no images or videos to serve as contrast. If we compare it to another successful, yet white, application – Flickr, we realize that the decision to make the surrounding layout as plain as possible was to counterpoint the (hopefully) vivid nature of the displayed images.

White...

Each task has specific fields – due date, repeat, time estimate, location, etc. However, when looking at the main tasks manager, and even when focusing on a specific task, these fields are not easily discernable. They don’t stand out of the blank exterior, which makes them very hard to locate and even harder to read.

By selecting a clear design, RTM broke an important rule in product development – never allow the design or the technical implementation to damage a product’s usability. Important data fields, such as due date and location, should be easier to find, and not intermixed with less important fields, such as URL or tags. They definitely should not be listed so plainly one after the other with no distinction.

2. No personal touch

Once again – RTM is an application, not a website, and should therefore be customizable. It should conform to something we’ve gotten quite used to by now – personalized look and layout. We’re already personalizing themes on our Windows desktop for who knows how long, and many web applications have followed suit.

RTM’s product layout works, with different page sections representing different roles the user takes when navigating and manipulating the product. On the other hand, it is expected, in a tool such as this, to allow the user to customize their own layout (place different screen elements on different locations), and to select color schemes that are more appealing to them.

Design summary: Too plain to the point where it causes important information to disappear, with no personal customization.

Under the hood

Who doesn’t like AJAX? For a web application product developer, it has ultimately changed the way we see user experience. Also, it allowed RTM to create an application that has a desktop feel to it.

One annoying aspect of such applications is that they live inside a web browser. Like it or not, we have already gotten used to navigating inside websites using the “Back” and “Next” buttons. However, an application like RTM has a separate navigation mechanism, since the entire application is downloaded as part of the page, and clicking on the menu-bar simply toggles a view rather than requesting a page from the server.

Therefore, once you navigate through RTM, say you go from the Tasks page to the Settings page it doesn’t go to a different page entirely. Therefore, if you click the Back button, then the browser would go to the previously loaded page, which is not the Tasks page. That creates a serious problem concerning site navigation.

RTM attempted to tackle this with changing the address line: once you move to a new page, the page adds a suffix to the address line preceded by the pound sign (#).

http://www.rememberthemilk.com/home/username/#section.tasks

Though I’ve read somewhere that this should solve the issue of creating parmalinks (allowing you to copy the address line and using it as a direct URL to get to that same page), it doesn’t fully solve the problem of Back and Next buttons. GMail managed to solve this issue, and I would love to try my hand in this.

Anyone has an idea how to solve this issue?

Bottom line

Remember The Milk is a superb desktop-like application. Apart from a few issues that I believe should be solved, it actually presents a better alternative to the commonly used practice of writing down task-lists – either on paper, or using Outlook.

The direction that RTM took – making this web application acting like a desktop application – actually makes it possible for us users to abandon client-side, expensive solutions and use RTM as our primary to-do list.

In one word – brilliant.