My Design Process —Defining The Problem And Planning A Solution

Posted: 21 Oct 2013 05:30 AM PDT

My design process is always evolving. I make changes to improve efficiency and quality and I adapt the process as technologies for building websites improve, such as the industry shift toward responsive design the last couple of years.

I recently mentioned design processes in regards to starting down the path toreduce costs in your freelance business and I wanted to share where my process is today and where I think it’s going.

A pen laying across the bottom of a notebook

My Evolving Design and Development Process

Every project is different, but for the most part when tasked with a new design or redesign of a site I go through the same process with a handful of distinct phases.

Problem definition
Solution planning
Design
Development
Deployment

As I started writing about each of the phases above in more detail and how they’re changing, I realized I had a lot more to say than I thought so I’m going to break up this conversation into 3 parts.

Introduction to my process with details about the problem definition and solution planning phases. (This post)
The design and development phases, which are the two phases that have seen the most change recently.
The deployment phase, where I think the process could be improved in the future, and some general observations about how my process evolves.

Problem Definition

You can’t solve a problem until you know what it is so the first phase of any design process should begin by defining the problem. This phase starts from the moment a potential client contacts me and asks for a price.

Organizing content and content types helps me better understand the site and business.

We begin a conversation so I can understand what they want and they can understand how I work. I try to gather as much information as possible about the client, the client’s goals for their business and site, their market and audience, their budget, etc. I ask some open-ended questions and listen, often listening between what they’re saying. I try to speak only in reply to a question they asked or if I need more clarification about something.

I prefer a phone call to get started and before the call I’ll create a simple text file to which I add any information the initial contact provided along with some cursory research about an existing site if there is one.

While on the phone I’ll continue to take notes all the time seeking the root problem the client wants me to solve whether it’s a more modern site or to improve how many widgets they sell or to improve the client’s brand or whatever. I’m writing down things that suggest more possibilities and I’m writing down things that add constraints to lead the solution.

After our initial conversation I begin my own research. I’ll look at industry sites to see what others include and don’t include. I’m mining the industry for ideas and inspiration and I’ll often be able to pass on some thoughts to hopefully give my clients ideas and inspiration for their site and business.

One part of this phase is gathering as much content as possible. Ideally the client will be sending me what content they have while I’m researching, but more likely all I’ll get is information about the content will be.

I want to bring up content as soon as possible to get the client working on it. While I’d ideally like to have all of it, what I really need is information such as what content will be included, what are the different content types that will need to be on the site. I don’t just mean sales copy and articles. I also want to know will we include a copyright notice? is there a tagline for the logo? What are the calls to action? I want to know as much as I possibly can about the content.

Solution Planning

Somewhere after the initial conversation, my research and any follow up questions I have, I start to think about how I’m going to solve the design problem and I start planning possible solutions.

I’ll think through different concepts for the site. I’ll begin sketching potential layouts. I’ll organize what I know about the content and start thinking about navigation. I usually begin all this thinking with more text files. The first ones almost always begin with the content.

Organizing content and content types helps me better understand the site and business. It leads to higher level thinking about what doesn’t need to be included and what isn’t there that should be. My goal here is to think through how best to structure the content and also what kind of navigation will be best to access the content. I’ll pass my thoughts to the client and keep them thinking about content.

There are other text files I’ll create to help me get down my thoughts for a concept and possible solutions.

Typography — I’ll list possible fonts and makes notes about what each communicates. I’ll group fonts in different pairings that might be used. I’ll begin making typographic choices and start testing size, line-height, measure, scale, and proportion of different fonts in a browser and record which values I think work.

Color — I’ll think about possibilities for a dominant color and try these colors in different color tools to develop a color palette for the site. I might scan sites like ColourLovers looking for existing color schemes to see if any work or just for some inspiration. Along with the different values I record, I’ll add notes and thoughts about what each scheme communicates.

Layout — I’ll usually begin thinking through layouts visually by making quick sketches with pencil and pen in a notebook. My sketches are about as rough as a sketch can be. Much of the time I’m building the site on a grid so I’ll start thinking about how many columns the grid will contain and working through a little math based on the given content and how I’m thinking of laying out the site.

The files, along with the number of sketches, grow for awhile as I include more thoughts and research. At some point I start refining all my thoughts and notes into fewer workable possibilities. I might take some sketches and work them up a little more as a still rough wireframe in Keynote.

None of the above is shared directly with clients. I used to work up more detailed wireframes to send them as a first deliverable, but where I wanted them to focus on the layout, they tended to focus on the details. I’d end up going through several rounds of refining the wireframe(s) over more time than I wanted to spend on them.

Since I’m not sending much to clients at this point, but I do want to keep them engaged, I ask more questions. I ask them to send me sites they like and don’t like with reasons why for both. I’ll usually have some specific questions as well.

Because it’s easier for me to make decisions about type, layout, and color when I can see the possibilities on the screen and because it’s easier for clients to offer feedback on what they see, the notes in my text files eventually become one more working web pages.

Sometimes these pages are just a few headings and paragraphs to show typefaces I’m thinking of using. Sometimes they include some color swatches. At this point they usually don’t include much in the way of layout, but at times they might.

It’s my version of a style guide or style tile and it becomes the first deliverable to show clients. Somewhere between creating the text files and turning them into an html and css style guide/tile, I enter what most think of as the design phase of the project, which is where I want to pick up next week.

Summary

Your design process should evolve as you evolve as a designer and developer, as the industry changes with new techniques and methodology, and as a way to improve your business.

My process has been changing a lot the last couple of years for all these reasons, though mostly due to the shift toward responsive design.

The process starts the same way at always has by gathering as much information as possible to define the problem and then spending time thinking, researching, and exploring possible solutions to the problem. These phases are dominated by pen and paper or typing into text files. While these may not be the most exciting parts of the process to consider, they are by far the most important.

If I had an hour to solve a problem I’d spend 55 minutes thinking about the problem and 5 minutes thinking about solutions.
— Albert Einstein

Next week I’ll walk you through the phases of my process that are changing the most and I’ll share how my design and development phases are become one fuzzy phase instead of two distinctly separate phases.

If you liked this post, consider buying my book Design Fundamentals

The post My Design Process —
Defining The Problem And Planning A Solution appeared first on Vanseo Design.