Making of: Prioritab, a Chrome Extension
Over the holiday season, one of my projects was to build a small Chrome extension. The idea was a new "new tab" page that would remind you of your short-, medium- and long-term priorities. On the last couple of days of the year, I managed to release this idea in the form of Prioritab.
Prioritab is the first (mini-)project that I've made available to a wider audience, but it was also just the right size to allow for rapid development and a relatively tight turnaround during a break. This post is meant to be a bit of a retrospective on the development of Prioritab.
Two realizations inspired me to do something like Prioritab. The first was that I look at my Currently new tab page so many times every day - and each time I do actually glance at the forecast on it. The second realization was that I do not always have a very clear idea of what my current priorities are. This has become especially noticeable in business school, where every day seems to be a lesson in life prioritization and time management.
So I thought, why not put my priorities on my new tab page, to remind myself of them constantly? I probably wouldn't be able to create something as beautiful and original as Currently, but at least I could strike a balance between usability and simplicity.
After Christmas, I dove right in. The original idea was to just add priorities lists to Currently: current time in the upper left, weather forecast in the upper right, and short- and long-term priority lists in the bottom half.
But, turns out making a new tab extension is a lot easier than my previous idea! Building off of what I learned last time, I was able to pull something simple together much faster than I thought. As expected, the design was heavily influenced by Currently's design, but in order to force myself to think about and understand what was going on with the design, I didn't peek at any of the underlying code for Currently (except, I think, to use the same font).
I made one major change to the original idea early on: I nixed the weather forecast section. One reason is that I was no longer convinced that the forecast really belonged on a page listing your priorities. It's a "nice to have", but doesn't really fit the theme. A second, more practical reason is that getting the forecast from a source like Weather Underground required API calls, which would cost money.
Instead, I came up with the somewhat tongue-in-cheek idea of showing users how much of the day, month and year have already gone by. This definitely fit in with the theme of encouraging people to do something productive with their time!
So eventually, I ended up with a new tab page that wasn't too far from the first release:
First version of Prioritab
Overall, coding the first iteration of Prioritab renewed my appreciation for how hard UX and design can be. I had some vision of what I wanted the UX interactions to be like, and the most daunting features were a) the ability to drag-and-drop reorder your list items, and b) a smooth UI for adding and removing priorities.
This felt like it should've been a solved problem more or less - I didn't want to spend too much time reinventing these features when I was pretty sure that a lot of other, more experienced programmers had done it already. Surprisingly however, I had a difficult time finding the right library(/ies) that did what I wanted; everything was either too simple or way too fancy. In the end, I found this code which drew on a bunch of jQuery libraries. The original author was totally cool with me building off of his code, so my primary work was to extend his code to work with the three-list design that I wanted.
That code gave me the drag-and-drop functionality I wanted, and a good foundation for the 'Edit' menu in each list to add an item or clear the whole list. There was also originally some "edit in-line" functionality, where clicking on an existing list item would make it editable. After testing it out, however, I decided that it was a bit messy and confusing, given the drag-and-drop and hover interactions that were already there.
Otherwise, creating the first iteration of Prioritab just took some more elbow grease and concentration. Chrome has an incredibly friendly developer environment; changes are easy to test, and you can easily walk through code with Chrome's inspector in debugger mode.
I sent off the first version to my friends. Unexpectedly, one friend immediately posted it on Product Hunt and Facebook (and he's a popular friend), which shifted me from a "look at this cool-ish toy I built!" mode into an "omg this is shipping and strangers are looking at it" mode. It helped uncover one majorly embarrassing bug (the kind that suggests you can't do math) and a couple smaller ones, which I quickly fixed and pushed a new version for. And, it also hastened my timeline for a major refactoring I had planned (to use Chrome's storage instead of localstorage, which allowed Prioritab to sync your priorities across Chrome browsers on different devices).
Luckily, I was soon about to travel abroad for a couple of weeks, which forced me to leave Prioritab alone for a while. Even more luckily, I think I left Prioritab in a stable, working and bug-free version. I'm mulling over a couple of ideas and pieces of feedback I've gotten, so when I return to the US I'll have a better idea of what to prioritize next!
Correctly sizing my motivating idea and the "next step" in the process can be really powerful. Prioritab was small enough and self-contained enough to really motivate me to focus on it and get iterations done quickly. In addition, the steps I broke it off into were just the right size to be motivating and to let me build up momentum. I didn't do this on purpose this time, but because it felt so good, hopefully in the future I'll be much more deliberate about this.
When showing friends, make sure you tell them what stage you're at. When I sent out the original version of Prioritab to my friends, I was not expecting it to get out to a wider audience so soon. In the end, getting pushed out of the nest was fine, but I could've communicated better the stage I was at and the kind of feedback I wanted.
You're never as "bug-free" as you think. I thought I was done, then a friend asked why we were only through 91% of the year given that it was December 30th (props if you caught this error in the screenshot above - the official screenshot in the Chrome web store is now fixed :) ). Another reported bug came from the fact that I was using a different zoom level than another user, something I completely didn't think about before.
Users will immediately begin asking for new features. In many senses this was a great project to practice mini-Product Management. I deliberately pruned out a lot of fancier bells and whistles in the first version in order to get some kind of MVP out there. But almost as soon as I released it, users were coming back with new feature suggestions. Some of these are great ones that I had thought of, but which I hadn't implemented yet because they are much more complicated for the incremental improvement - being able to drag-and-drop an item into a different list is one example. Others are great ideas in their own rights but fall outside the purview of Prioritab - for example, automatically creating your priorities based off of the other tabs you have open in Chrome. Given that the core "message" of Prioritab had been shaped up in the development process, it was much easier for me to prioritize different ideas and features in the "roadmap".
It's really hard to get qualitative feedback! The friends I showed were mostly tech-oriented people, so they gave some valuable qualitative reactions. I still suspect they were being too nice, however. And, aside from the feature suggestions mentioned above, it's difficult to get feedback from strangers, many of whom will just not use your project instead of telling you why. This is where a) collecting quantitative metrics on user engagement (not implemented in Prioritab, don't worry) and b) being able to collect high-quality, qualitative feedback are both useful skills.
Overall, making Prioritab was a great learning experience, and I'm excited about the positive feedback I've gotten regarding the idea. There will be some new features coming out over time, but please let me know if you have any feedback!
comments powered by Disqus