SelfControl (Good Design)

SelfControl logoSelfControl, the most intimidating icon in my laptop’s dock, is the key to my academic success, and, I will argue, an example of good design. It is a free, open source software that allows users to block their own access to websites for a set period of time. Procrastinating, compulsive checkers of social media can add sites that they know tempt and distract them to a blacklist, and set a timer. SelfControl then makes it impossible for users to access those websites for that amount of time; you can switch browsers or restart your computer, but nothing will allow you to check Twitter until your time is up. I find it useful and usable.

Screen shot 2015-01-31 at 2.54.36 PM

SelfControl is easy to use even for the first time, and users can always tell what is going on. When the program opens, you see a minimal screen with a start button, a time slider, and a button that says “Edit Blacklist.” This is an example of what Donald Norman called “affordances” in The Design of Everyday Things. Each of these three elements is a clue for using the software: to begin, you will need to set a time limit, create a blacklist of sites (or edit as necessary), and press the start button. That’s it.

That time slider is an example of good mapping. Sliding it to the right increases the amount of time, and sliding it to the left decreases the amount of time. It moves from “Disabled” at the far left to “A Day” at the far right in 15-minute increments. Further, it is well labeled and gives good feedback to users: the amount of time is visible at the bottom left of the screen and responds immediately to the slider’s movements. To be completely clear, perhaps, the slider should move up to increase the amount, and down to decrease, but I think the horizontal design is sufficiently clear, especially for those of us who read left-to-right.

Domain blacklistblacklisting tumblr

Before a user clicks on “Start” they, need to create a Blacklist of sites to block. You can see in the screenshot above which sites tend to distract me from my work. This screen is an example of good visibility, because everything that needs to be done is obvious. The plus and minus signs at the bottom are clear indications of adding and subtracting sites to the list. It is a simple screen, and with only the possible actions available to users: an example of what Norman would call “constraints.” To add a site, simply click on the plus sign, and a cursor will appear. Type in the URL of the website, and that’s it.are you sure you want to whitelist

I’ve discussed blacklisting – so what about a whitelist? Creating a whitelist means that users can visit all the sites on their list and no others. If a user selects “Whitelist” a warning screen pops up to explain the implications (see the screenshot below). “Import” is the one thing I don’t think is completely clear to average users. It allows a user to block outgoing and incoming email from their email servers. Though the labeling could be more clear to provide better visibility, users are given immediate feedback from the program, as it adds the email server to their blacklist. It is easy to remove anything from the list with a click of the minus button (before you actually start the timer!).

Once a user clicks on “Start,” a countdown appears. SelfControl is blocking those tempting websites, and will keep them blocked until the timer reads “00.00.” A user can close SelfControl to de-clutter their screen, but it will continue to work. One can check the time left by simply re-opening the program. The beauty of SelfControl is that its clarity and simplicity mean that there is nothing to distract or confuse while using the program. That’s perfect, because the whole point of it is to minimize distractions. Now I’m going to set SelfControl for a couple hours so I can work on a post about bad design.