Skip to main content ↓
designer block bubble

10 Practical Ways to Bust Through Web Designer’s Block

10 Practical Ways to Bust Through Web Designer's Block As a web designer, is there any feeling worse than being creatively uninspired and not being able to complete or start your design projects? It’s frustrating, depressing, and costs us income. Now imagine if there was a magical, surefire technique to make our creative block instantly disappear, giving us instant creativity and productivity.

That would be great, wouldn’t it? Well, too bad, because there’s no such thing. Designer’s block happens to all of us, and there’s no easy way out of it.

However, if you feel you’re in a situation where you just feel unable to create, here are a few things you can try.

1. Start from the Inside Out

Every serious web designer will tell you that you start out your layout with a nice grid and do a few wireframes to see how the text flows through the boxes and columns. Then you settle on a color scheme and a design theme, and work towards the smaller details from there. In other words, we’re taught to start from the big picture and work our way down to the details.

But we all know things don’t always (or, should I say, never) work out this way. Staring at a dull and empty grid all day is not helping you move forward an inch. Instead of inspirational site content that can give us ideas on what themes would work well with a company, the only text the client gives us to work with is “Lorem ipsum dolor sit amet” they copy-pasted from this ubiquitous site.

Why not break all the rules and start inside out? Design something as small as a form button or a “read more” link. Don’t worry about colors; you can always change them later.

Or pick a palette from kuler or COLOURlovers, and make something that looks nice; something that gives you a glimpse of the website that should go around it. Try designing a key detail first, and maybe the rest of the design will flow from it.Try designing a key detail first, and maybe the rest of the design will flow from it. Dribbble, a site that features small parts of design projects, shows us that it’s possible to get inspired by small components of an entire design, even if we don’t get to see the big picture. You can make that principle work for you, and focus on the small stuff first.

2. Solve the Problems First

Sometimes there’s a very specific reason why you can’t find inspiration, and you just need to step back from browsing website galleries to find it. For example, maybe you can’t get inspired because your client hasn’t provided you with any content and you’re working off lorem ipsum text. Or maybe the client’s logo is so awful that you’re unable to design something decent around it.

In these cases, it’s best to acknowledge the problem and solve it first. A lot of the time, we want to see ourselves as design superheroes that can make anything look good. But there’s nothing wrong with admitting that the quality of our output depends on the quality of the input we get (also known as the garbage in, garbage out principle).

How would you design a website around this logo?How would you design a website around this logo? So if the content’s quality is poor or non-existent, request your client to hire web copy writers; and if their existing logo looks awful, bring their attention to that and offer them additional services if you are able to also provide professional logo/brand design services. If you don’t deal with the real problem first, you run the risk of producing sub-par work, and the process will be very frustrating.

3. Code First, Design Later

In the complex process of designing a website, design usually comes before code. Things such as navigation menus or JavaScript effects are often done after a design has been finished. But If you’re stuck, on the first part (the design), it might be time to change that paradigm, even if just for when you’re experience design block.

Reverse the process by starting from code, and then designing for that code. This might seem unconventional, but one argument for it is that this method will ensure that form fits function, since function comes first in usable web designs. Code First, Design LaterLike solving a maze, design can sometimes be easier when you start from the end. Some practical things you could do are:

4. Start from Design Elements

One of the most common ways of getting inspired is simply finding something cool to use in your design. A lot of designs start when a designer finds a beautiful new font, a special texture image, an interesting set of icons, or a new design technique they want to use. Again, this may sound counter-intuitive because the “right” way would be to find design elements that are suitable for your project, not the other way around.

02 04 design elementsFont choice can have a big impact on your design, and can also be a great source of inspiration. But the truth is that we usually have a certain amount of freedom in our work, and we shouldn’t be afraid of following our gut instincts and going with the creative flow. Some of the best and most original designs happen when the creator is not afraid to follow his inspiration wherever it takes him. So assemble a library of fonts, brushes, textures, and stock photos, and the next time you’re stuck, just take a look through all of them.

This is one of the most effective ways of busting through designer’s block.  You can also check out one of my side projects, the Design Resources Search Engine, which lets you search through more than 150 design resources websites.

5. Think Outside the Box (Literally)

Most productivity/creativity guides will tell you that when you’re stuck, you should go look at pictures of sunsets and baby pandas on Flickr, or maybe go take a walk. While I love walking in the sunset hand in hand with baby pandas, I’ve found out the hard way that it does little for my productivity. Instead, here’s some solid advice on something to look at: boxes.

Package design is a great place to get inspiration from. Packages have been around for centuries, and both the art and the science of packaging are years ahead of web design. Any cereal carton is competing with 50 other packages for the shopper’s attention, so you know that no detail, no matter how small, has been left to chance.

Think Outside the Box (Literally)Blogs like The Dieline have tons of great packaging examples. So take a walk around your local supermarket, or maybe just browse these excellent sites, blogs, and blog posts:

6. Copy (But Don’t Steal!)

Now before you start writing a letter to your lawyer, let me make one thing very clear: I’m not advocating plagiarism at all. The key here is to understand what you are copying. Just copying isn’t enough; if you want to be successful, you need to analyze the small details that make things work.

Don't copy and paste, zoom down to pixel level to learn from the best.Don’t copy and paste, zoom down to pixel level to learn from the best. Let’s say you want to copy a shiny, “Web 2.0” button (although I don’t suggest adding one more of these to the millions already in existence). Take a screenshot of the page, import it in Photoshop, then draw a blank rectangle and try to approximate the gradients, glow, and shadow used until you get the right look. Experiment with these parameters and your new button will have kept the original look and feel while looking nothing like the source.

Recreate the principles that make something look the way it does, rather than the thing itself. Study the techniques, and you can learn something from your peers; or maybe even make it better than the original.

7. Switch to Another Project

Sometimes, no matter how hard you work on something, it just doesn’t click. This is the time when you should take a break and start something else. This is the essence of structured procrastination: using that feeling of not wanting to do something as motivation to accomplish something else.

And sometimes, the boost from accomplishing that second thing will even be enough to motivate you to do the original task!

8. Do Something That Makes You Feel Good

I promised I wouldn’t get into the new age, touchy-feely stuff in this article, but I have to mention this: Your frame of mind has a significant impact on your creativity. A sunny white sand beach... can you get any more cliché than this?

<p class='content-break'></p>
<p> I challenge you to find a cheesier stock photo than this one.” width=”550″ height=”362″ \/><span class=A sunny white sand beach… can you get any more cliché than this? I challenge you to find a cheesier stock photo than this one. If you’re in a bad mood, go play sports, cook, watch a kung fu movie — anything that makes you happy.

The risk here is that you might get more distracted instead of more focused, so I would only advise this as a last resort.

9. Get Feedback

This piece of advice doesn’t really apply to those cases where you’re starring at a blank screen. But if you find yourself stuck at a later stage in the design process, ask someone else what they think about the current state of the design. No matter what they say, it will help you move forward.

If they like it, use that positive feedback as motivation and as a sign that you’re going in the right direction. If they hate it, ask them why. Welcome the criticism and use it to improve your work.

Sometimes spending just 10 minutes fixing a key detail is enough to create a completely different impression and change somebody’s mind about the design.

10. Start Over

One of the biggest pitfalls of designers is that sometimes we become too attached and emotional when it comes to our designs. 02 08 start new Sometimes starting out fresh and feeling complete freedom for a few minutes is all you need to get unstuck, and you’ll find that you’re even able to use some or all of the work you’ve already done, whether it’s in this project or the next. So don’t be afraid to press Ctrl + N (or Command + N) and start anew.

You can always go back to your previous design if the new one doesn’t move you forward — so what do you have to lose?

Related Content

Make estimating web design costs easy

Website design costs can be tricky to nail down. Get an instant estimate for a custom web design with our free website design cost calculator!

Try Our Free Web Design Cost Calculator
Project Quote Calculator