We asked world-renowned web designer Grace Smith to tell us a little about how she uses sketching to develop ideas for her design work.
Sketching & Design: a Perfect Combination
Sketching isn’t optional for me as a designer, it’s essential. I can’t go straight to digital at the start of a project, I always start off with some browser templates or Moleskine (and a few Derwent pencils!)
Sketching kick-starts my creativity and allows me to get ideas out on paper and is the fastest way to brainstorm and convey as many ideas as possible with the least amount of effort.
Staring at a blank Photoshop canvas is not a great way to start a project. Although it may sound exciting to just jump straight in, it can also be quite overwhelming. Sketching gets you over this hurdle and allows you to quickly explore concepts and ideas. I see it as the frame upon which I craft my projects.
Whether it’s a website design, logo design or iPhone app design, it all begins with a pencil and paper. Sketching enables me to break down ideas and fully explore design and layout options and I find putting it down on paper tends to raise questions and ideas, and leads to changes.
I focus on wireframing and layout when sketching for Web Design and iPhone UI Design, looking at the overall picture instead of minor details too early in the process. I usually start by jotting down the main points and goals of a project on a separate page, which I can then quickly refer back to when I’m sketching.
This is the exact process I used when redesigning my own site – Postscript5, which was recently relaunched. Brainstorming ideas and sketching out layouts for each area of the site led me down some creative avenues I wouldn’t have experimented with had I not taken the time to sketch!
I sketch quickly and freely as I’m not concerned with how it looks but on developing and exploring ideas. Plus usually no one but you sees the sketches so don’t get caught up in trying to draw a masterpiece!
My process for Logo Design differs slightly in that the sketches are scanned and digitally treated (in Photoshop or Illustrator). However before the sketches are treated they are shown to the client for feedback and revised, only at this point are they then scanned and given a design treatment. This allows for quick iteration and feedback and makes for a much more efficient design process.
As you begin sketching at the start of a project, you soon discover potential obstacles and problems that you may not have seen until much later in the design phase. I’ve therefore found that while the approach may differ slightly on each project, sketching has cut down dramatically on revisions later in the design stage.
As a designer it now means huge amounts of time aren’t invested in refining concepts and solutions which may not be in the right direction, as the sketch (or a sketch turned into a wireframe) can be shown to the client, for approval.
1. Sketching Resources for User Experience Designers
3. Collection of Printable Browser and Wireframe Sketching Templates
4. An in-depth look at my Wireframing process
Too many people get hung up on not being able to draw, but great drawing skill isn’t necessary to capture your ideas. Sketching should be fast and loose, you’re not trying to recreate a Picasso, it’s about transferring ideas from your brain to paper.
It’s the place where you make your mistakes and your discoveries and lay the foundations of your ideas.
Now excuse me while I go and grab my Derwent Pencils and Moleskine and get sketching!
Grace Smith is the principal designer of Postscript5, a small, boutique web design studio based in Northern Ireland, where she works with clients from around the globe.