5 tips to avoid rabbit holes

I found myself spinning wheels. I found my mind going over the same thing again and again. It feels like I'm going down a rabbit hole just like Alice in Wonderland.

A rabbit hole is when you are working on a project and you find yourself going over the same thing again and again, or you find yourself going down a branching tree of decisions. It happens when you haven't scoped a feature properly and you don't have criteria for when you are done.

An example

Today I caught myself on the descent. I was working on thumbnails for Youtube and I thought, "Oh, I'll use Canva. Pick a template. Modify and done."

After scrolling forever without finding something I liked, I moved over to Figma. I'll make it myself and just be done with it.

No, Canva had the images coming in from Unsplash. Wait, I need to watch some videos of what I should include. What thumbnails convert with videos? Where should I put the title? Should I include my picture?

50 decisions later and I still didn't have the thumbnails I set out to do. I was spinning in circles.

Why is this even a problem

You may wonder why I think this is even a problem. I hear you. You may think this is just the nature of complex work. You're right. Partially.

It's like callback hell.

fs.readdir(source, function (err, files) {
  if (err) {
    console.log('Error finding files: ' + err)
  } else {
    files.forEach(function (filename, fileIndex) {
      console.log(filename)
      gm(source + filename).size(function (err, values) {
        if (err) {
          console.log('Error identifying file size: ' + err)
        } else {
          console.log(filename + ' : ' + values)
          aspect = (values.width / values.height)
          widths.forEach(function (width, widthIndex) {
            height = Math.round(width / aspect)
            console.log('resizing ' + filename + 'to ' + height + 'x' + height)
            this.resize(width, height).write(dest + 'w' + width + '_' + filename, function(err) {
              if (err) console.log('Error writing file: ' + err)
            })
          }.bind(this))
        }
      })
    })
  }
})

callbackhell.com

This sort of thinking yields cognitive overload. You have so many choices to make, you end up making none. Each choice you have to make affects the other choices. As your mind maps out each pathway, you start to lose track of what you've already worked out.

Smashing has a great article about this.
Reducing Cognitive Overload For A Better User Experience

The 5 tips

To avoid this cognitive overload pathway, I've laid out 5 high level strategies. Hopefully you'll find these tips helpful. When I've followed them, I have been incredibly productive. When I haven't, well. You can guess.

Know what you want to achieve

It's hard to finish something if you don't know what you're doing. What do you want to achieve?

I'm serious. You won't do the thing if you don't know what the thing is. You need to articulate it.

Examples you might start out with:

Improve the speed of your site
Test your authentication components
Write a blog post

These are a pretty good start, but they're more like directions. Who doesn't want a faster site? Who doesn't want tested authentication components?

Right. So better. Know what I want to achieve. Got it.

I think.

Let's rephrase those examples into better examples using specificity.

Improve the speed of your website by compressing 10 large images
Test your login authentication component with Cypress to confirm it is working properly
Write a blog post that's at least 1000 words and has a few well placed memes

The difference with this approach is it has very clear success and failure criteria. You are compressing a specific number of images, you are only testing the login component, and you have a target number of words and memes. (I hear 3 tops)

So, set your goal. Make it specific.

To reframe my story earlier, I wanted to create artwork for a video. Let me specify, I wanted to create artwork for this video.

When I caught myself in the rabbit hole, I ejected.

Sorry, I had to 😀.

In all seriousness, I was disappointed I still didn't have a thumbnail for that video. I knew I wanted one, and roughly what it would look like, but I had not created it yet. I was in cognitive overload.

I moved on to the next strategy. Maybe a little time pressure would help me get the thumbnail produced.

Set a time frame

After landing safely outside the rabbit hole, I assessed the situation. I had gone deep(ish) into what made a Youtube thumbnail successful and had several false starts creating it.

I had lost my time frame though. That's how I ended up with a few hours of nothing to show. (I'm not going to call it unproductive, maybe I'll mention why at the end)

Don't be like me. You need to set a time frame. Here's what I suggest.

Pomodoro Technique

Set a block of time to achieve a specific thing.

I wanted a .png at the end of it, so the goal was to have one in 25 minutes.

Audacious.

When you set a tight deadline though, something miraculous happens. You start cutting out unnecessary stuff. It changes your scope.

Set a scope

The scope is tightly coupled with the time frame you have to achieve your goal in.

Let's go on a side quest and look at an example from earlier.

Test your login authentication component with Cypress to confirm it is working properly

This one is still a bit open ended, and we haven't set a time frame on it. Based on arbitrary thoughts and feelings I rank the difficult of this one at a solid 5 out of 7. This is an arbitrary scale as well.

The login component is pretty darn important for your application and you need to make sure it's working well. Let's give ourselves a half day to implement this (don't worry, the rest of this article isn't half a day long).

Before you start coding, grab a notebook and a ☕. Sit in a different spot away from your computer. Imagine yourself going through the login process. Write down everything you would do to log in.

Now, start a new page. Write down everything you would do wrong.

Finally, imagine you are your grandmother 👵. Write down everything she would do wrong.

If you have 5 or more scenarios, rank them in order of importance and cut the other half. Don't throw away your notebook though.

Start testing. You should have the happy path that you would use to log in. Make that happen first to catch any changes to the login process. Skip what you would do wrong, and write tests to prevent your grandma's problems.

Pro tip: you probably realized there's some structural changes or messaging you need to add. Developer-testers are a double threat.

Back from the side quest.

We didn't explicitly design a scope here. We implicitly designed one. The major point is we created a ranked list of items to work on and that's our scope.

We are avoiding scope creep by just cutting it. Testing is a rabbit hole that could probably go so deep down that you are worried about how your site appears on every single browser for every single device ever built. STAHP!!

via GIPHY

Basically, keep your scope nice and tight so it fits in your time frame. You can always come back.

Eliminate distractions

Hello fellow mind worker. It's like you're always in your head. Me too.

Everything you do as a developer occurs in your mind. You have to be able to hold the part of the program you are working on in your mind or you can't manipulate it.

You manipulate it in your mind first, and then bring it about in code after the fact.

I'm a really big fan of this blog post by Paul Graham, founder of Y Combinator. I read it several times a year as a reminder of how to work well.

Holding a Program in One's Head

I'm just going to dump a bunch of tips here as this article is getting kind of long.

Eliminating distractions

Close every tab
Put your phone and social on silent (I'm looking at you Slack!)
Move to a quiet place
Headphones and music make a huge difference (I'm using Brain.fm**)
Use a todo list app, and look at it before you start work
Read Shape Up
Read Getting Things Done
Read Deep Work
Eat, Drink and Be Merry
Take care of yourself like you are a friend you care about
Separate exploratory work from getting things done
Set a pattern for when you work

** This is an affiliate link. I'm listening to it right now though.

There are probably hundreds more but in the interest of cutting scope 😉 I cut it here. These are what I found most helpful.

Forgive and iterate

Forgive yourself and iterate your approaches. If you're in development or design, then you will have thousands of approaches over your career. You don't have to get it right in your next creative endeavor. You just want to be moving in the right direction.

Folks, we are not machines. We may think of ourselves as computers, but we are not. You can't give yourself instructions like you would a computer. Have some compassion for yourself.

Forgive yourself when you hit the bottom of the rabbit hole or catch yourself on the descent. It's painful to pull yourself out of it if I'm honest.

Every time you catch yourself though, you get better at catching yourself. Think of it as a repetition in weight lifting.

Iterate your approaches. I could talk about the definition of insanity, but I'm not going to. Change your approaches if they aren't working. Simple?

This is where a development notebook comes in handy. If you've got a short list of your goals written down, you'll be able to spot trends of where you get stuck repeatedly.

Whew

👏 If you've made it this far, wow. I barely did.

We're at 1700 words and I set out to write like 500. I guess I had more to say on this than I thought.

I really hope you've found this helpful. I'm into productivity hacks in all areas of life as you can see. Some of it isn't hacking though. Sometimes it's planning.

Hit me up if you have something to say about this article.

The best way to reach me is by email at me@chrisellis.dev.

If you’ve got a more casual question, the best place to get in touch is on Twitter @slingingdivs.