Did you know that ants are omnivores? They eat both plants and animals.
And when I say "animals", I don't mean something just a little bit bigger than an ant, like a bee, I mean much larger animals, like… birds. If you have the nerve, google "ants eating a bird".
So, what does this have to do with web design?
Picture this: an African elephant lying on its side and sleeping. A very ambitious ant comes and bites the back of its leg.
Question: Does the ant have to chew?
I'm just joking 😀 The real question here would be,
Could an ant eat an entire elephant?
I mean, ants eat birds, so, technically, if there are enough ants…
But what if there is just one ant? Is it possible that it could eat 5.5 tons of matter alone?
Now imagine that elephant is actually that big scary web design project you're working on. Or even worse—the project you haven't taken, because it is big and scary!
When you look at it you feel like a tiny ant. You feel like an ant that couldn't possibly take apart the largest animal on Earth.
Paralyzed, you think:
Ugh, I'm just not smart enough, good enough, or fast enough to do even a simple job on odesk or elance. I'm kind of intimidated to go searching for paid freelance work at this point.
I totally get where you're coming from. I've been the ant a lot of times.
We all have. And our ant mouths don't grow that much during our lives. We don't get bigger. We just get wiser and our strategy changes.
But when you don't have a strategy, looking at a web design project is intimidating because of:
- The size of the elephant. You're thinking of eating an entire elephant. You've no idea how to do that and you get overwhelmed by the sheer volume of the thing.
- The size of your bite. You think you have to bite, chew and swallow an entire elephant at once—impossible!
How to eat an elephant (or "How to start and finish your first web design project")
Like an ant. With a strategy.
Remember our ambitious ant? Well, to eat the elephant it kept going back and tirelessly (we know how ants are) took small pieces, one by one.
In a day, one of elephant's toenails were gone.
In a month, the whole elephant was gone.
The ant eventually took it apart and ate it, piece by piece.
But not the pieces we normally think about like trunk, ears, legs… no. It worked at it in tiny, tiny bits.
If the elephant was sliced into pieces and you just knew that you had to carry 100 of these tiny blocks today from point A to point B, you'd be a happy ant. That's a clear and achievable task.
But if your task was "carry that elephant by yourself from point A to point B", you'll feel overwhelmed, because, you can't carry a whole elephant. You are just an ant. That would be impossible.
It's the same with a web design project.
If somebody could tell you "Pick a typeface that represents this adjective", then "Make this headline stand out from the rest of the text" and so on, your tasks would be relatively easy. Not because they don't involve actual work, but because they are simple and well defined. They are within your reach.
Well, that somebody is you. You are the one who has to determine what your tasks are.
And you have the power to make this easy on you.
Here's how you could go about a web design project without feeling overwhelmed:
Step 1: Chop
The first thing you need to do is chop your project into small manageable tasks. The tasks have to be so small and clear that you can do each of them in under an hour. The moment you do that, you'll feel comfortable. You'll feel like you're making progress each time that you scratch off a task.
There is no limit as to how small your tasks should be. The smaller, the better.
Do you think "Make a web site" is a single task? A task that is well defined and you know exactly what completing it looks like? I bet it is not.
Can you do it in an hour? Though you can make a website in an hour I doubt it is what you want it to be.
But "Using the brand's colour scheme Pick a contrasting colour that could be used for highlights and button hover states" is a small and clear task that can be done in less than an hour.
Step 2: Pack a dish of the finest meat first
Once you have the chopped pieces you will see that not all of them are of equal importance, value and taste. Not all of them are from the fine meat parts of the elephant.
Your next step is to pick only the finest ones, the ones that are the most important—their number will be far less than the total sum of elephant pieces. These are the tasks without which you won't have a website at all.
Focus only on these pieces. You want a very small number of teeny-tiny elephant pieces that you can eat in one session.
Make sure you don't overeat—a puking ant will be reluctant to get up and eat another batch of elephant meat tomorrow.
The goal at this step is to get to v0.1 of your project as fast as possible.
v0.1 of a website would just be you having the copy semantically marked up in an .html file.
So, the most important task at this point would be "Get the copy". It's not "Choose a font" or "Choose colours".
At the same time, having the contents of each page in HTML format basically gives you a website. You can ship it now. It is ready. Far from perfect, but it is able to serve the core purpose—get the content in the hands of the audience. Of course you would want it to be better than this. That's what the third step is for:
Step 3: Go back and eat another batch of elephant meat
So, you ate your first, most-important and most-precious batch of elephant meat. These were the delicacies.
If you have chosen correctly you should have got the core of the problem out of your way.
You got the v0.1 of your project. Pat yourself on the back.
The solution might be sketchy, but it is a solution. It may take some more rounds to release it, but every version gets better.
Going back and making it site better is another iteration. Which produces another version of that site.
Working in iterations is probably the most important, most basic skill you'll ever need as a web designer.
When you've done something many times (many iterations), every next iteration adds up to your knowledge of what worked and what didn't in the past. In the end you've discovered what you know works for sure.
By shortening the work cycles you also shorten the learning cycles. And because we learn the most when we look back at something you give yourself more opportunities to look back, assess and build experience. All in the same project.
Also, iterations help you get this out of your way:
OMG, I have. to. nail. this. design! I have this one chance to do it!
You don't. It's not set in stone. You can always go back and choose another font, experiment with the white space, switch the layout and so on.
But when you have a finished product (though not perfect), it's much easier to tune the details.
When you complete something you feel happy. And the results you get from having many iterations are what makes you feel successful.
- Don't pile a list of tasks that you think you need to do. Pick the most important set of tasks that will help you finish and release a version of your product.
- When you get the structure right, it's much easier to add detail and more detail, and more detail. Don't start with the details. Start with the structure.
- Each released version is a small win. Whether we like to admit it or not, we all have a psychological need to see our efforts rewarded. I do and you do, too. You have to be able to feel that you're making progress. And you are the one who decides what counts as "making progress". Hack your rules so that you win every time. To do so, lower your standards, because:
- Completing many small tasks creates momentum and puts you on a roll—you want to work more and more. Before you know it, you'll have eaten the elephant.
Go ant! You have the strategies and tools needed. Elephants are shit-scared of you now
P.S. Still not sure how to complete your first web design project?
No problem. You have the chance to peek over my shoulder as I work on chopping a small elephant and explaining exactly what I do and how I do it on each step.
All of that info will be in the ebook I'm writing—“Harmonious Web Design”