Planning Ahead: Ways to Improve Your Web Design Workflow

If you’re looking to up your game as a web designer, the planning phase is probably the single most “bang for your buck” skill-set that you could work on. Sometimes it seems that in the dizzying world of web design blogs, roundups, and screencasts, people just skim over the part of the process that makes everything else possible.

This post marks the first in a series where we’ll be examining the “planning” phase in web design. The goal: to better understand the role that planning plays in design; when it’s effective, and when it’s wasted.

Why Plan At All?

Some web designers feel that planning has become a somewhat irrelevant part of the creative workflow – “Why bother planning when I can dig right into the creative phase”?; this kind of attitude is great for the designer who doesn’t mind spending an extra 10 hours on a project for the fun of it, but for others it’s a waste of time to ignore something so integral to the design process.

Before we really dig in, it’s probably important to explain what kind of planning I’m referring to – I’m not referring to the type of plan that involves “guessing” and falls apart minutes after the project starts. What I am talking about is a plan that will eliminate guesswork, define goals, and establish a solid foundation for you to get creative with. The art of planning is more like a “brainstorm with a purpose” than it is a comprehensive technical spec.

It’s a waste of time to ignore something so integral to the design process

Planning is the formative phase in any project – it doesn’t hinder the creative process, it defines it. A good planning session doesn’t even require a lot of time or energy, but the benefits will last far into the entire duration of the project. A thoughtful approach to planning will help boost your creativity, save you time in the creative process, and make you look like a rockstar to clients!

When Should You Plan?

Before you even fire up Photoshop or your favorite code-editor. Design Planning is about setting the overall mission of a project, so it’s important that you define the ultimate goal of the website that you’re going to be working on before you approach it creatively. Some top level questions you should ask are:

• Why will people be visiting the site?
• What function does it serve you or your client?
• What needs to happen for this design to be a success?

Answering these questions early on will save time, energy, and money in the long run, but more than anything, it’ll help you to figure out exactly how your website design is going to rock! Something as simple as spending 15 minutes planning out your ultimate goals can help refine your purpose and make sure that you don’t miss the bigger picture.

What Should You Plan?

Planning is going to be a little different for everyone out there – some sites are straight forward and require just a few minutes of planning; others are big, complex, and can spend days, weeks and even months in the planning stages. I’ll be discussing these steps in more depth in future articles, but I can outline about 6 crucial planning steps in any web design project:

1. Define Success
2. Define the Content
3. Define the Features
4. Consider the Audience
5. Do the Research
6. Organization, Hierarchy and the Wireframe

What Does Planning Look Like?

The actual format of your planning can be anything from an elaborate creative brief document to a sketch on the back of a napkin. Honestly – use what works for you and don’t try to force it. If you aren’t ever going to go back and read an elaborate creative brief, then don’t bother writing one! The trick is to use a planning format that works for you and your workflow genetics. I happen to love the idea of hands-on notepads; especially those snazzy Action Books from Behance – but realistically, I know that I do my best planning using a simple text-editor app: no frills, no formatting, no distractions. Your planning method is going to look unique to you though – so take some time to consider what works best for your own personal style.

The actual format of your planning can be anything from an elaborate creative brief document to a sketch on the back of a napkin.

Know the Limitations of Planning

Let’s make one thing clear: designing a website is a lot like building something in a vacuum; Try as you might, you won’t ever be able to plan for every possible outcome when your site hits the web. The likelihood that your design will cover every possible scenario for the next 2-3 years of that site’s life are slim at best. The site will change, the visitors will change, heck, you or your client will change.

The planning stage isn’t for defining each and every tiny variable, it’s for painting broad strokes and establishing your overall strategy. Planning each and every detail will ultimately fail because it will force you to make guesses – and regardless of how educated a guess might be, it’s still just a guess. Keep your planning focused on the big picture stuff that will stay the same throughout the project.

In this series of articles, I’ll be introducing some tips, tricks, and other techniques to improve your own planning process. I’m going to be catering this series towards newer designers, but it’s my hope that everyone can glean some useful information!