Bucket List

Funky todo webapp which pushes people to get stuff done using annoying yet hopefully fun punishment concepts, sounds and general nonsense.

Design & coding
Created at
Side project
Apr 2014
Bucket List's main and lists screens


We probably all have that app or notebook full of things we should do. Someday.

Bucket List tries to seed emotion into the process of interacting with tasks, in an effort to increase tasks' completion rate.

Therefore, creating a task is dependant on the completion of past tasks. And almost all interactions with tasks aim to have a potentially-shit-storm-evoking emotion.

Sketches of Bucket List

Creation threshould

The amount of lists and tasks a person can create is only as big as the size of its device's screen. Got an iPhone 4? You get 8 slots; iPhone 5? 9; iPhone 6 Plus? 10-11, I don't know - haven't checked.

So when that moment comes when one gotta write down that movie she must watch later, she might realize that's gonna be the last movie she could have - because poor her hasn't watched any of the others so far.

The choreography other tasks perform to make room for their new neighbor

Talking tasks

Every time a task is created, it randomly picks up a personality which dictates its behavior throughout its lifespan (till death by completion). A task could be over cheerful and greet every new member on the list or be hideously awful and say good riddance for every task that leaves; possibly making one wanna keep that sweet pumpkin forever on his list or just get done with that annoying bitch.

Thoughtful dialog between the charming and the witch

Aging tasks

Lastly, tasks grow older every week, pile up dust and require ninja swipes to clean them before one could swipe to complete/delete them.

But, once a task reaches the age of 4 it becomes a dinosaur. It dresses up in reptile skin and annoyingly roars whenever one sees it. Actually, it roars on every app launch.

Left: Cleaning in action. Right: First time explanation of the aging concept once a task has aged

Complementary Tidbits

Setting a task due date is a matter of just stating it, like "Read all items on Pocket today" or "Update website footer before 1pm".

Bucket List's auto-detection of list icons

Icons help distinguishing between lists, but instead of having to manually select one, an icon is auto-picked based on the name of the list.

Undoing is contextual and neatly indicates what is about to be restored, all while being not too intrusive (tapping instead of pulling the ribbon reveals a quick explanation).

Small Details

Deleting a list requires a double confirmation. This behavior was planned long before the "pull-to-undo" which renders it uselss, but it still remains a rather theatrical scenario, just watch it.

Bucket List's pull up gesture to reveal real tasks age

Since it might seem as if one is on top of her stuff as she just regularlly clean old tasks, pulling up provides a glance into the actual age of tasks.

Bucket List's tumbleweed animation in empty lists
Bucket List's ever changing placeholders for tasks
Bucket List's echo effect when a lonesome task talks

Not-so-empty empty states:

Left: Empty lists are greeted with a cliché tumbleweed. Center: Placeholders are ever changing and suggestive. Right: When a lonesome task talk it's replied with an echo

Launch screen for iOS (a funky hack since sounds couldn't be played on an iOS webapp before any user interaction).

Bucket List's intro animation #1
Bucket List's intro animation #2
Bucket List's intro animation #3

Upon launch, lists enter screen in a slightly different choreography to spice things up, usually someone is always late.

Modals animate into and out of the screen according to user action

Somehow related work