{"id":119,"date":"2011-04-05T23:37:52","date_gmt":"2011-04-06T06:37:52","guid":{"rendered":"https:\/\/www.ussherpress.com\/blog\/?p=119"},"modified":"2017-03-08T20:01:29","modified_gmt":"2017-03-09T04:01:29","slug":"the-art-of-lil-todo-part-1","status":"publish","type":"post","link":"https:\/\/www.ussherpress.com\/blog\/?p=119","title":{"rendered":"the art of lil todo, part 1"},"content":{"rendered":"

This is the first in a series of posts of how I came up with the art and color scheme that I did for lil todo<\/a>. I\u2019m no expert at graphic design or product design, but I figured my little experiment with writing an app and trying to make it beautiful might help other developers out there. If you have any thoughts or suggestions, please post them in the comments below. Thanks for reading.<\/p>\n

When I first decided to write a Windows Phone app, I really wasn’t too concerned with how it would look. I just knew it should work well, should be simple, and overall it should just get out of my way. After researching other to-do apps, though, I started noticing a lot of, shall we say, aesthetically challenged apps. That’s when I decided I should put a little bit extra effort into how the app looks just to stand out.<\/p>\n

\"\"<\/a>\"\"<\/a>\"\"<\/a>\"\"<\/a><\/p>\n

Above: Some sample Windows Phone 7 to-do app icons. I\u2019m sure these are all excellent apps, but the tiles aren\u2019t very pretty.<\/p>\n

From the start, I wanted to go for a real-world theme. If you take a look at a lot of the nicer looking apps on the iPhone and iPad, for instance, they take a real world concept and idealize it in their imagery. Real-world objects in digital form can be just as desirable if designed right. Just take a look at these app icons and ask yourself if they don\u2019t make the apps more desirable:<\/p>\n

\"\"<\/a>\"\"<\/a>\"\"<\/a><\/p>\n

If you go further and take a look at the interfaces themselves, such as this one for Todo<\/a> on the iPad, you see an extension of a real-world concept. In the example below, a to-do list is converted into a planner binder. This is a kind of skeuomorphism<\/a> where the ornamentation doesn\u2019t really add to the functionality of the app itself, but it does make the app look nice, don\u2019t it?<\/p>\n

\"\"<\/a><\/p>\n

This doesn\u2019t always work, though, as anyone who\u2019s seen Microsoft Bob can attest:<\/p>\n

\"\"<\/a><\/p>\n

The above is just too busy. You really can\u2019t tell what\u2019s clickable and what isn\u2019t. The whole thing isn\u2019t very inviting and just makes you want to run away. Granted, back in the day that MS Bob was released, we didn’t have the processing power or rich displays that we do today.<\/p>\n

Of course, on a phone, you don\u2019t have a huge canvas to work with like on the iPad or a computer monitor, so you have to keep it simple. You can’t really create a binder in the limited canvas that you do have. OmniFocus<\/a>, an excellent GTD-style todo app on the iPhone, does a good job of keeping things simple but highly functional in a small space:<\/p>\n

\"\"<\/a><\/p>\n

Getting back to desirable imagery, the trouble with to-do apps is that the only real-world object you think of when thinking of to-do lists is a scrap piece of paper with a checklist of tasks. Usually, these are scrawled messily with pen and when you’re done, you check them off or cross them out and then chuck that sheet of paper. You can\u2019t really covet a scrap piece of paper like you do a Leica <\/a>camera or a Moleskine<\/a> notebook.<\/p>\n

That got me thinking, well, let’s pretend we’ve got a notebook to store all of our to-dos. People like notebooks.<\/a> I do. They\u2019re personal; they feel good in your hands. The bound paper feels steady, constant. It\u2019s reliable.<\/p>\n

Perhaps in the real world, most people don\u2019t use notebooks to keep track of their checklists, but there are beautiful little notebooks like Field Notes that can be used that way. Field Notes have a nice design that definitely makes them desirable. You want to just carry them with you, hold them, yank them out, and doodle in them. As they get worn, they start to develop their own story and character. They\u2019re gush-worthy.<\/p>\n

\"\"<\/a><\/p>\n

Moleskine notebooks are similarly gush-worthy. Certainly overkill for keeping simple checklists, but let\u2019s remember we\u2019re trying to come up with an idealized notion here. If you had lots of money, why not have fancy bound notebooks for keeping track of your daily to-do lists? It\u2019s a status thing, right?<\/p>\n

With this imagery and notion of a \u201cnotebook of checklists\u201d in mind, I decided to go ahead and design the app with these visuals. In the next post, I\u2019ll describe how I started to run with this idea and style my app around having notebooks of checklists. Stay tuned.<\/p>\n","protected":false},"excerpt":{"rendered":"

This is the first in a series of posts of how I came up with the art and color scheme that I did for lil todo. I\u2019m no expert at graphic design or product design, but I figured my little experiment with writing an app and trying to make it beautiful might help other developers … Continue reading the art of lil todo, part 1<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[132,133],"tags":[16,15,112,10],"_links":{"self":[{"href":"https:\/\/www.ussherpress.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/119"}],"collection":[{"href":"https:\/\/www.ussherpress.com\/blog\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.ussherpress.com\/blog\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.ussherpress.com\/blog\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.ussherpress.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=119"}],"version-history":[{"count":31,"href":"https:\/\/www.ussherpress.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/119\/revisions"}],"predecessor-version":[{"id":1417,"href":"https:\/\/www.ussherpress.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/119\/revisions\/1417"}],"wp:attachment":[{"href":"https:\/\/www.ussherpress.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=119"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.ussherpress.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=119"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.ussherpress.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=119"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}