11 February 2013

Inspiring Wireframe Sketches

While stumbling around on the internet, I came across an article which I found very useful and inspiring. Inspiring Wireframe Sketches is a short article that gives us an insight on successful wireframe and sketch development. It shows many awesome and well done sketches by designers such as Carolyn Farino, Mitch Shepherd and Rob Davis and Callum Chapman to name a few. These sketches are so detailed and well thought out, I must admit sometimes I want to skip the sketching stage. Most graphic design students view sketching as busy work, and do not realize the potential their designs will lose if you skip this crucial step. Sketching your work can lead to new ideas, it can inspire you in an enormous way and lead you too the most appealing and successful designs in the long run.

Personally, I have always wanted to skip the sketching phase of design because I found it hard to draw well, I'm better on a computer. Another reason as to why I found it difficult to sketch my ideas was that I had NO idea how to go about sketching. Do I brain storm and jot down a cluster of information, or do I draw something extremely detailed so I don't loose crucial information or details when I transfer my sketches onto the computer. Looking at this article and the examples of successful sketches/wireframes taught me a ton about how to effectively sketch. Some of the examples use templates, for either an iPhone App or just a simple web page. They are all somewhat simple with the exception of Roman Justado's sketch for an iPhone radio app. But simple is better, you can add notes and small bits of information as you draw, so you can remember later that you wanted the background to have a darker tint. This will save the designer time. Jotting down notes as you sketch is so important, you can explain briefly how pages will transition, or how the screen will react once someone has selected a certain item. Another smart thing to do while sketching and brainstorming is to use post it notes or different colors. It organizes your information a bit more which will payoff in the long run.

In conclusion, this article is an awesome insight on how to successfully sketch up your design ideas, whether its for a website, app or logo, you want to keep your sketches organized and consistent. It is also important to utilized the paper to take notes, use a template to help keep your sketches clean and organized and utilize colors and postit notes if needed to add information.


  1. These look like a great resource- sketching wireframes is something I haven't done much of so these really polished looking examples should be a good reference. You (or at least I personally) don't really think about apps needing sketches before they're made so this is cool.

  2. My sketches tend to be really quick gestural type drawings, but after checking out that article, I think I might want to spend a bit more time getting them properly detailed. There's no doubt that getting a sketch fleshed out like that would help all the rest of the steps go by much easier.

  3. I always want to skip the sketch process too. I kinda feel like it's because I wasn't taught exactly how to do it or maybe how to begin? The examples posted are very interesting though so I think it'll be easier for me to sketch having some kind of foundation now.