Toodledo UserStyle

Toodledo.com is one of the best To Do list software/services available, but their user interface leaves a lot to be desired. I built a Userstyle that works with the Stylish browser plugin to completely change the appearance of the web app and make it resemble a native MacOSX application.

I’m a big fan of the web-based To Do list service, Toodledo. I prefer it to local software because everything is backed up in the cloud, so it’s accessible from anywhere with a web browser and an internet connection. They also have a great API that enables great iOS apps like 2Do to sync with Toodledo. These options make it the best To Do list service available, in my opinion.

The biggest drawback of Toodledo, and what steered me away initially, is the sub-par user experience of the website. They seem to have spent more time working on the back-end functionality and didn’t put the same level of effort and work into making an attractive, intuitive user interface.

That’s where browser plugins like Stylish come in handy. Stylish allows you to use custom CSS stylesheets for websites to override the default appearance and completely change the look of the site.

Toodledo.com MacOSX Version 2

A year ago, Toodledo looked awful. It was mostly pink, purple and green with a confusing maze of menus which used up entirely too much screen space and poor design choices that made the app look cluttered and busy. I really wanted to use the service because of the plethora of features, but I hated the aesthetics and poor usability. I decided to build a complete Userstyle in the style of a native MacOSX program.

It was a big success. Over 3,000 people installed it and at it’s peak was averaging a couple hundred installs per week. It was quickly the most popular userstyle for Toodledo.

Then in July, Toodledo released a complete redesign. It broke every feature of the userstyle. I suppose it should be a complement that they incorporated many of my UI elements into their new design. Things like the left side tabs for the folders, fly out menus for sorting and filters, and a single consistent toolbar across views. The new Toodledo design was a huge improvement, but it was still fairly ugly, so I decided to update my MacOSX style to work with the new design.

I started from scratch and wrote all new CSS to work the the design. I’m still tweaking the code, but it’s functional on the main Task page and the Search page. I hope to improve it to redesign all of the Toodledo.com pages eventually.

Install the Toodledo MacOSX Version 2 Userstyle