September 26, 2017

We build stories and ideas, not just websites

Posted on the Range Blog in 2017

The other day I felt involved in something big – something bigger than a web project. This sparked a realization: at Range, we build more than a scope of work.

Sure, we receive detailed tech specs every now and then – we love geeking out over those.

But more often, our clients want something more. They want us to take adjectives and create nouns people can interact with. They want modern sophisticated translated into a brilliant homepage or warmly professional transformed into a it’s-so-easy signup process.

We do that. We build ideas.

We also build stories.

We meet companies where they are and guide them through design peaks, development valleys. They find who they want to be.

We meet users where they land and guide them past fears, doubts and what-you-wish-they-knew. They discover what they want.

Stories that define companies and stories that bring companies and clients together – we build these.

This is our favorite kind of work.

What story do you need to tell?

June 8, 2017

Urgent vs. Important (and other decision making notes)

Published on the Range blog in 2017

Whether you’re freelancing or working for someone else, you probably make decisions and organize tasks every day.

My particular role actually involves a heavy emphasis on these things and I’ve discovered I’m a better organizer and decision maker when I’m leaning on some frameworks, processes, and general awareness.

Urgent vs. Important

One of the first things I learned as a project manager is this: few tasks (fewer than we think) are genuinely urgent.

  • Urgent: (of a state or situation) requiring immediate action or attention / needing immediate attention
  • Important: of great significance or value; likely to have a profound effect on success, survival, or well-being / of great value, meaning, effect

Say you have two tasks on your plate right now: client A’s site is down (urgent), and client B just requested some estimates for new work (important). Which do you take care of first? Most people would say, “take care of the site that’s down!” I’d agree.

This seems straight forward and, for the most part, it is . . . once you know what urgent and important look like.

Organizing Tasks is Tricky

Beyond knowing the difference between urgent and important, the toughest part of task organization is threefold:

  1. Identifying what type of task is on your hands (urgent, important, or neither?)
  2. Making smart decisions about your to-do list (when to do what and how)
  3. Actually executing your tasks (following through)

With the two task example above, that’s easy. But most days of our work year aren’t that calm.

A more normal scenario: You’ve arrived for work and received a list of 20 items. You could just tackle the first item on the list and work your way down from there, but I bet you’d run out of time. A more efficient method would be prioritizing what’s urgent (and should be done ASAP), what’s important (and should be taken care of soon) and what you can delegate or tackle later. This way, you ensure you’re taking care of highest priority items first with the amount of time you have available.

So, how do you do that?

The Eisenhower Decision Matrix

There are many ways you can approach classifying tasks, but my favorite method is something called the Eisenhower Decision Matrix:

To use this matrix, you’d take each task (big or minuscule) on your 20 item to-do list and assign them to a quadrant. Once you’ve sorted all to-dos, you should have more clarity on whether you take immediate action, schedule the task for later, delegate, or ignore the item for now.

You’ll still need to make some smart decisions about how you handle those tasks, and your priorities may shift throughout the day, but this matrix can help you get on the right track.

On Smart Decision Making

Organizing your tasks (by any method) and then figuring out what to do with them is decision making. In order to make consistently smart decisions when it comes to your to-dos, it’s helpful to know about things that can skew your decisions.

Back to our to-do list example: Pull that list of 20 tasks back into your mind. On any given work day you’d dislike doing some of those tasks, but really like others. A few tasks you probably don’t mind may require you working with people you do mind. And one or two tasks likely have high stakes attached to their completion (or failure). Even if these factors shouldn’t influence how you prioritize your tasks, I bet they do. 

A non-exhaustive list of factors that can skew your decisions:  

  • Mindset: How we perceive our abilities and limitations (popularized by Carol Dweck)
  • Biases: Irrational preferences or inclinations 
  • Fear of Failure: I’ve never met someone who enjoys failing, but I’ve met plenty of people who are paralyzed by the idea of it. Fear-induced paralysis (or even a milder form, avoidance) can shut down our ability to rationally weigh options.
  • Personal Blind Spots: Personal strengths and weaknesses create inherent “blind spots” – aspects of our personalities, actions, and behavior we’re unaware of.
  • Decision Fatigue: When we’ve reached decision overload and no longer have the mental energy to adequately weigh options, that’s decision fatigue. We’re especially susceptible to biases when we’re this kind of tired.
  • Default Options: It’s easy to choose the path of least resistance. Sometimes, we select or go along with default options so we can avoid a decision altogether.
  • Physical Factors: Even seemingly small details like the time of day, how hungry we are, and our sensory experience can affect our decisions. (Example: I’m more likely to make a smart decision at 10am after coffee and breakfast than at 5pm when I’m hungry and ready to shut off for the day.) 

Whew. Our decisions can go rogue pretty easily.

Mitigating those Factors

Personally, I need help mitigating these. Two kinds of help I find particularly beneficial are:

  1. decision making processes
  2. good people

The process that most intrigues me is called PrOACT. Researchers John Hammond and Ralph Keeney propose this approach in their book, Smart Choices. The process considers eight elements: problem, objectives, alternatives, consequences, tradeoffs, uncertainty, risk tolerance, and linked decisions. (Read Chapter 1 for more details or buy the book on Amazon). Some successful folks have highly recommended this process and I suspect that’s for good reason. 

Equally important is surrounding yourself with coworkers, partners and friends who balance your thought process, are aware of your biases and blind spots, can help you navigate decision making pitfalls and practice smart decision making in their own lives. These kind of people are invaluable.

Execution Tips (Don’t Forget to Act)

Once you’ve organized your tasks and decided what to do with (or about) them, give yourself a big pat on the back and take a quick break. But don’t stop there.

How many times have you decided, unequivocally, that you’ll wake up early tomorrow morning and exercise? Or take care of that annoying fix? Or knock out that medium-sized home project?

How often to do something else instead? 

Making a decision doesn’t guarantee you (or anyone else) will actually act on it.

Some tips on moving from decision to execution:

  • Spend only a limited amount of time planning & prioritizing
  • Involve your coworkers
  • Schedule a time to act on important items
  • Communicate major decisions to everyone impacted
  • Set reminders via your phone, notepad, task manager, or Slack
  • Use something to track your tasks and to-dos (who doesn’t love checking things off?)
  • On a related note, don’t hide your to do list in your drawer
  • Ask others to follow up with you
  • And, especially if this is a smaller decision, just do it and move on

Putting it all Together

Navigating your to do list each day doesn’t have to be overwhelming. With some help from frameworks and smart decision making, you can grow more productive and efficient with your work days.

Resources & Further Reading

On Decision-Making:

And one good read on execution:

April 26, 2016

Introducing Spruce Planner

As an entrepreneur, I have a lot of ideas up my sleeve. The past 6 months I have been slowly working on one of those ideas: Spruce Planner. Spruce Planner is an app product formulated under my newly minted Spruce Media, LLC.
Read more

April 26, 2016

What I’ve been up to at Range

At Range, we've been super busy! I've taken on the title of "Managing Partner." This is exciting - I'm looking forward to leading Range towards further success and growth.

Read more

December 5, 2012

Parallax and Mobile

// re-blogged from Range

When we think about sites that have really neat parallax effects, do we ever stop to consider how they function on mobile? In making we saw the use-case for parallax scrolling: to tell their philanthropic story. We also needed the website to be extremely mobile friendly as the campaign spreads around social media. How can we get the best of both worlds?  Well, we decided that we would fight the uphill battle and sort this problem out once and for all.

The Parallax

I have always / loved / parallax / sites.  I dreamed of finding a client who the story-telling aspect would be perfect for. Its almost like directing a video. You write it like a script and play it out: the graphical and storyline interactions. The code part of this comes later. Thinking about the story you have to tell is the best place to start.

As for the code: we used Richard Shephard's JS / CSS on Github as our desktop parallax base. It looks great! But what about mobile? I pulled out all the tiny tablet-y devices and to my surprise the parallax kinda worked - but it had one major flaw: it was slow and choppy and needed to simmer down and become sleek and sexy like the desktop.

Luckily for us* we were already using _s for our theme base with foundation to help with the responsive bits. Minus the parallax sludge, mobile was already in a good place with some tweaking (like un-sticking the sticky navigation, etc). Now the question is being begged:

How do we disable and modify the parallax to speed up the site on mobile and tablets?

Enter Jetpack by Automattic! They have a nifty mobile detection system built right in that we can utilize. We leveraged it to disable the parallax JavaScript and load in an extra CSS file when tablet or mobile is detected. In that stylesheet we were able to load in smaller compiled versions of multiple background images, and utilize media queries to adjust them at different sizes.

Utilizing Jetpack:

[code lang="php"]
function range_is_mobile_or_tablet() {
if ( class_exists( 'Jetpack_User_Agent_Info' ) ) {
$ua_info = new Jetpack_User_Agent_Info();
return ( jetpack_is_mobile() || $ua_info->is_tablet() );
return false;

Disabling js and loading in the CSS:

[code lang="php"]
if ( ! range_is_mobile_or_tablet() )
wp_enqueue_script( 'parallax', get_template_directory_uri() . '/js/parallax.js', array( 'jquery' ), '20121114' );
wp_enqueue_style( 'tabletmobilecss', get_template_directory_uri() . "/parallaxdisabled.css", array( 'style' ), '3.1.4' );

Now that the css is loading in , we can begin to start the tedious finagling and image resizing process until perfection is achieved. But what is the secret to the sauce? We can also use that handy function range_is_mobile_or_tablet() to target our php in our theme files if we so desired.


I'm glad you had a little freak out there because I did too when I realized that I had ALL THE POWER TO MODIFY ANYTHING. But caution: power can be dangerous and evil (like if you put in so many conditionals on content that you can't keep up with modifications). Use sparingly.

*actually this was planned because we're genius

// re-blogged from range

December 3, 2012

Just Launched Charitable Giving Campaign:

// reblogged from

We're so thrilled to announce this years launch of! We designed and developed the site working with Christian & Small's Julie Ellis. Throughout the years, Christian & Small Attorneys has given back to the community in outstanding ways. This will be the third year that they decided to give donations to charities in lieu of client gifts for the holidays. But not only do they give their money, they also give countless hours of time as well as supplies. Really the involvement can't be measured.

We decided that we needed a site that not only achieves the voting, but also tells their philanthropic story. In terms of medium: we decided to use a parallax scrolling technique to tell what we couldn't say on a static page. Check it out, vote, and consider donating on your own to these great organizations!

// reblogged from

November 13, 2012

Site Design:

// re-blogged from Range

I had the great pleasure of working with Scott Berkun on his personal branding and website design. He wanted a clean modern look so we went with all white, the most awesome font Atrament Web, and colors that pop just like the cover of his famous book Mindfire. I love projects that end up being typographical based that really let the content shine. Screenshots below: or just visit

Development by: Shawn Johnston


// re-blogged from Range

October 2, 2012

Collaborative Branding & Site Design Launch: Jones Valley Teaching Farm

// Reblogged from
I love working on design for incredible organizations with amazing and talented people! This past spring, I was able to collaborate with Kelly Housholder, Cary Norton, and Jordan Sowards on rebranding for Jones Valley Teaching Farm in Birmingham, AL. Under the creative direction of Kelly, we collaborated on the rebranding, logo, and color palette.. which she then worked to produce some incredible messaging copy from Jordan, which is all pulled together by the brilliant photography that Cary took! All of this while working closely with JVTF's executive director, Grant Brigham.

I can't tell you how thrilled I am to be a part of this relaunch, for such a great organization  We renamed them from "Jones Valley Urban Farm" to "Jones Valley Teaching Farm" to more accurately portray what their main initiative is in our community: Education.

Continuing from the rebranding I collaborated on with Kelly, we then collaborated on the  website structure and design that just launched last Friday with the development by Andrew Norcross. JVTF has so much to say and so much to give back to the community. We started with wire-framing and information architecting and then went onto design. Kelly was extremely meticulous in working in every detail out with Grant and making sure nothing was overlooked. In particular, I really enjoyed working on the blog category structure & icons. Check out for yourself! (shortlink:

// Reblogged from - go there to view more screenshots or vies the site at

Sara Cannon is a Design and Digital Strategy Consultant, UX/UI Designer, Creative Director, & Artist.
Have a project I could help you with? Contact me at

Skip to content