Planning your Wireframes
Posted on 29 April, 2009 at 16:06 PM
There are already 16 Comments
About the Show
David shows you how to do a hand drawn plan of your wireframes to give you an idea of what the layout of your website will resemble.
Links mentioned in this post:
"Creating an Effective Wireframe"
"Creating an Effective Mood Board"
Related Shows
- (11) Episode 189 - Using Inspiration Effectively
- (21) Episode 187 - Design with the Lights On
- (16) Episode 186 - Apples and Oranges
- (15) Episode 185 - Design like a Dictator
- (8) Episode 179 - It's All About Themes
User Comments
Fabian 29 Apr, 2009 17:28:39 PM
Thanks for that David. I tend to make mine overcomplicated, your wireframing process is so logical:)
Devlin 29 Apr, 2009 22:14:34 PM
Thanks David for that. It is great to see everything brought down to the basics. Echoing Fabian, it's easy to get over complicated and overwhelmed with options when designing sites, this is a good reminder not to ignore the basics.
Rich97 30 Apr, 2009 11:26:37 AM
Awesome! Exactly the kind of things I am missing. I got all the design theory down I just suck at mapping it out and planning.
More of this please :) :P
Schalk Neethling 30 Apr, 2009 11:27:50 AM
Hey there David,
Nice one! Glad to see I am not the only one still using paper ;)
Cheers, Schalk
Mark McGee 30 Apr, 2009 21:19:40 PM
It sounds crazy, but this is the sort of basic design principles that a lot of web developers just don't consider doing. What was true for traditional graphic design is even more so for digital - resist the temptation to jump on the computer and get your notepads out!
By the way, I was taught that using a pencil shows underconfidence in your ideas and was always forced to use a pen (so that you can see your thought processes and not rub things out!).
Shouldn't this one be "From the Desk"?
Good stuff as always :D
Ricardo Chiappe 30 Apr, 2009 23:17:18 PM
David, perfect timming! I'm actually starting a design for a new BIG website next week. This should help work more organized.
Thanks mate :)
Saludos.
Cristian Pascu 01 May, 2009 15:20:28 PM
I just love the computer-free feeling that you get when sketching on a notebook. :-)
David Perel 01 May, 2009 16:38:10 PM
@Mark - I was thinking of calling this one From the Desk but for some reason forgot when doing the intro :P
@Ricardo - We read your mind before doing the episode mate... thats how we stay ahead of the game!
benry 04 May, 2009 17:33:17 PM
I take a similar, but slightly different approach. I first list all the items/information that needs to appear on the page, then determine it's priority on the page (is it near the top, bottom, is it large or small), then I flush out the detail of each part. I find this approach works well with clients too in workshops as it enables them to think about 'what' they want to have on the page before they begin thinking about the how it needs to look and work. Gives them chunks they can digest.
gitong 07 May, 2009 12:36:23 PM
thx, man. But i think you can give more detail for the wireframe planning. What to concern, pitfall etc. but thx anyway.
divinefusion 29 May, 2009 21:26:10 PM
great to see how everyone works their wire frames & planning.//
GIRIDHAR 27 Jul, 2009 13:49:52 PM
Very nice, basic and minimalistic explanation for starters.. nice work!


kyle steed 29 Apr, 2009 16:17:49 PM
this is actually really helpful as I am in the midst of a complete overhaul on my website. I've been journaling ideas and layouts already, but making a simple list of what I actually want on the pages is a great tip. When I finally get done I plan on taking all my preliminary (or wireframes) and making one huge post about the process.
thanks for the always helpful tips guys.
#rockon