http://colbowdesign.com/blog2/">

About Brad Colbow

Brad ColbowBrad Colbow is an independent web designer and illustrator living in Cleveland Ohio. He is the owner of Colbow Design and creator of the web comic, The Brads. If you’re looking for fun and practical website design Contact Me.

Follow My Blog

RSS iconWhat is that thing, can I eat it? That is an RSS icon. You can click it and subscribe to my feed. There are a lot of good readers out there, I recomend Google’s.


My Twitter Feed

More from Twitter

the brads

Attack of the Frankencomp - The Case for One Comp Design

June 15th, 2009

I’m a big proponent of the one comp school of design. Last week Andy Rutledge did an interesting writeup on the topic and bashed the idea of designing multiple comps. This post started out as a list of things I agree with and don’t agree with. After a second and third reading I can’t find anything I disagree with (other than his tone).

You can divide designers up into two groups. The first are the problem solvers — we can safely put Andy into that group. The second are the decorators.  For the sake of argument I’m going to put a younger version of myself into that category.

Younger Brad in trouble

Andy’s main point is simple: If your goal is approval you’re design will never be successful. The younger Brad was eager to jump in and start designing. I wanted to get in a quick phone call, maybe get an idea for what sites the client thought looked cool and then open up Photoshop to see what i could do. The problem solver takes a different approach. It’s built around the users and their needs.

Andy never brought up a problem I had with doing multiple comps and that was how much MORE time it took. You would think that giving several options up front would push someone in a direction more quickly, but that wasn’t often the case. The client was picking colors and design elements from all the comps and I was building something new with each iteration. The new designs never looked as good as the originals because good design is holistic, not patched together. I would just wind up with a Frankencomp with a bunch of unrelated pieces thrown together.

Frankencomp

The worst part of the Frankencomp was that it got the myself and the client focused on the window dressing and not the design problems we were trying to solve.

Here is what I do now. I put a lot more work into the pre-design. You can read a more detailed version of my process here. There is a lot more research upfront, starting with the content and working our way out. On a recent ecommerce site design I sat down with the client to talk about why they had such a high abandoned shopping cart rate. We talked about how their business worked off-line, how they took orders and how they interacted with customers. We quickly figured out that the reason why the shopping carts were abandoned was because the people creating the orders needed approval before placing the orders, they were building quotes. Armed with that new information we set out to build a site that dealt with their specific set of problems.

Another great example is the recent design of Microsoft’s Bing Travel site. The layout, fancy ajax and functionality is very similar to Kayak.com. Douglass Sims noticed something odd about the two sites. He was getting lower prices on the Bing Travel site. When he clicked through he couldn’t find the lower rates on the airline’s sites. Bing’s site wasn’t pulling over up to date rate information. When Bing travel was designed it pulled all the cool design functionality of Kayak.com over but they didn’t understand all the problems that Kayak.com has been working on for years.

What it comes down to is that you have to first have to understand the fundamental problems the design is trying to solve. From my experience creating a bunch of comps to see what sticks isn’t an effective design approach. That’s not to say that you shouldn’t experiment and try new things, or even present several solutions to one problem. But be careful thinking that just throwing out three comps at the beginning of every project is going to solve a problem you haven’t defined.

Design Questionnaire

February 3rd, 2009

I’m not sure why, but over the last few weeks I’ve gotten several requests from design students to do interviews. Since it seems to be a popular topic I figured I put up some questions I received yesterday along with my answers.

1. What skills/education did you acquire to obtain your current position?
I went to Kent State university in Ohio and takenstudied Advertising and minored in graphic design. Before going solo and starting my business I spent several years working at agencies building up my portfolio. Even as important was joining local groups and associations where I could meet other creatives and marketing folks who helped me grow as a designer and help me find work and clients over time.

2. How long have you been in the graphics career?
I graduated almost 9 years ago.

3. What was your hardest part in finding a job?
Early on it was the lack of work to show. twilightMy first full time web design position came as a result of designing my church’s website. My future boss was impressed that I wanted to spend my free time designing websites even though that design I was showing was absolutely terrible.

4. How did you find out about

the wrestler

your current position?
In Cleveland where I live the agencies don’t pay much (relatively speaking). Many of the good designers in this area usually leave town after a few years. The other option is to get out from company life and start your own. With a good portfolio and some know how it’s pretty easy to set yourself up as a freelancer.

5. What do you think was the most important thing that helped you obtain your current job?
Meeting people. I spent years going to work in the morning and leaving 8 hours later. Once I started networking after work and got out to meet other people dragonball evolution in my field in my spare time a lot of opportunities opened up. It took years to build a network but it’s been the most valuable thing I ever did.

6. What type of portfolio do you have?     Case?       Electronic?      Web Site?
I have a website. It doesn’t matter what you design, t-shirts, posters, print, web. You NEED to have your work online. Even if you don’t have your own domain it’s so easy to get a

wall e

Flickr account or post work on a site like Behance. At my last job I would scout talent at the local colleges and if we got a resume without any work we never contacted them.

The Design Process Step by Step

December 7th, 2008

Potential clients are often taken off guard when I tell them how much a new website design will cost. When they look through a portfolio they just see the finished design and not everything that went into creating it.  Below is my process, the steps I go through to create a visual design for a website.

Wireframes and contentiron man

Before opening Photoshop I need to know more about the content of the site. In a perfect world  the client would deliver all the content before designing starts, but that’s not always a realistic expectation. In this early stage I want to know dark knightwhat the primary objective of the site is and how the content will support it.

On a lot of projects I work with a copywriter or information architect since they can add a lot to  a project at this stage. For this example I’m using a wireframe I put together in Indesign since it was a small project.

The discovery stage is done to prevent surprises down the road. To get the client focused on the content instead of design I like to put wireframes

007 quantum of solace

together. The wireframes are pretty dull and they keep people from worrying about color and photos and focused on refining the purpose of the site. Below is a jpg of the home page in the wireframe, you can download a PDF of that page here.

First round design

When the content has started to solidify I can turn my attention towards the design. Sometimes I sketch and sometimes I just work from the wireframe. transporter 3Below you can see the first round of the design.

The design at this stage is like a colored in version of the wireframe. The site sells  handmade crafts from China. The logo has a touch of red in it so I decided to use red a the dominant color. The dark red really helps the logo stand out. Even though this design is kind of dull it establishes a lot of the topography and colors that will be used later on.

Adding some personality

The embroideries that will be sold on the site are beautiful so that’s where I turned for inspiration. I took a small swatch of one of the products and desaturated all the color from it in Photoshop. This would become the pattern that is used on the header and the footer of the site. The pattern’s layer style is set to overlay and at about 27% opacity.

Since these crafts are hand made I wanted to get some more texture onto the site that was more organic. I used some water color textures in places to accomplish this. In this early version I had a map of China in the background, but I was never happy with it. It seemed to distracting. I tried some other things (here are a couple examples 1 2) before settling on the final.

Here is the final design again without the map of China and a focus on the product.

As you can see there is a lot more to design than just making a site look better. For me design is a process that starts with a solid understanding of what a site will do. The site wouldn’t work for another client because all the elements that went into the design came from the product and brand of the products.

Let me know what you think about my process. Do you do something similar? Should there be more emphasis on the research and wireframes upfront or should there be less? How would you approach this project?

Seperating Cartoons from Content

November 30th, 2008

Over the last couple months my writing has gone down quite a bit as I’ve spent more and more time drawing The Brads, my not so weekly comic strip. I’ve really enjoyed working on the comic, it’s a fun outlet or my illustration. I’ve enjoyed it so much I’ve been working on getting the strip it’s own home online.

The site you’re reading now is my businesses’ website. As I added more and more comics I felt like it was sending mixed messages to new visitors who were looking for website design.  To clear things up I moved the cartoons over to BradColbow.com. Over the next few months there is a lot I want to do there. I’m going to add an illustration portfolio and maybe a little bit of ecommerce.

The Brads - @Twitter

November 14th, 2008

Twitter - the Brads

The Brads - At the Conference

October 22nd, 2008

An Event Apart - The Brads

The Brads - Nigerian Scammers

October 17th, 2008

the Brads

Tutorial: How to draw Me, Dielman and a pig

October 13th, 2008

Recently I had the privilege of writing a tutorial for VectorTuts. I walk you through how to ink and color a cartoon in Illustrator. Anyone can check out the full tutorial here, but if you have a subscription to the site you can download the fully editable final vector file.

If yo came here looking for the comics you can check them out in The Brads category of this blog.

Brad Colbow Brad Dielman