Category Archives: design

Sketching: A developer-turned-designer’s perspective

Even though I’ve been working on creating designs for the longest time, I’ve done it on Photoshop, or SnagIt or even mspaint: basically, some software tool or the other.

That probably is because I never went to design school… probably because I am an engineer who graduated from a software developer to a designer.

Being a software developer for 7-8 years just makes you more comfortable with using software tools and IDEs for enablement and for problem solving. Your computer becomes your comfort zone for work.

I remember my early projects as a User Interface developer. What was passed down to me generally was a screen flow document and (decently hi resolution) screen mark-ups, usually jpegs or bitmaps, of the screen that needed to be developed; with notes on there regarding transitions or state changes.  A designer or a design team generally handed those down.

As a developer, my impression of designers was : “They create screen-shots”

So when I finally decided to graduate to being a designer myself, it automatically meant: “I should now create screen-shots: jpegs, bitmaps or pngs” and i was totally fine with this.. did fairly well too.. all this time, until a couple of years ago. That’s when I decided to dig deeper into formal education for design.

I was surprised to see almost all design folks highly advocate the use of paper and pens for design. Reading articles, blog entries and listening to interviews from various designers reinforced the fact that designers use sketching as their primary design method.

Wow.. It had never really occurred to me that web designers, software designers could be working with paper and pens as their primary tools, sketching their designs and validating their approaches before they converted their prototypes into jpegs. I thought only fashion designers sketched!!

So then,  can you move back to sketching once you’ve started down the Photoshop path?

You can.. but it’s definitely not easy. It is hard to unlearn your habits be it everyday habits or design habits.

For starters, detailed insights like these will be of great help:

The messy art of UX sketching

An interview with Jason Fried

Second, I’d suggest to start small. Don’t try and tackle the whole of your next design problem with sketching. Gain expertise slowly.. Start with one section of one screen.. Try and sketch that piece or a simple dialog/pop-up  first.. then move on to larger chunks like sketching the entire screen and then as your confidence builds up,  take on the entire design problem.

Be aware though that when you start, your sketches will look all fuzzy and funny.. not perfect like the ones you saw in the tutorial. But they’ll get better as you practice..

As always, there’s no shortcut!


The iceberg

Everyone in the User Experience domain swears by Jesse James Garrett’s  Elements of User Centered Design.

If you’re from this field, the elements will  probably make sense to you the moment you look at the diagram above.

However, put yourself in your client’s or customer’s shoes and you’ll understand the need to translate the above into something that will make sense to them and at the same time emphasize the value these elements bring with them.

I came across this very smart representation of the Garrett’s model by Trevor Van Gorp, which he calls The UX Iceberg:

Like Trevor rightly puts it: “…  when the User Experience Iceberg is used to add context to the Elements, it illuminates the dark, unknown depths for project stakeholders who are new to UX. Because in the end, the unseen elements of user experience are the parts of the iceberg that will sink your project, while your stakeholders are busy focusing on the ‘tip’ “

Pull-out ads: Push-out users!

Probably due to the fact that users have developed “banner blindness” – a tendency to ignore the website banners and the ads that appear in that space, website designers and marketing teams are resorting to new ways of placing ads and making sure they get noticed.

Here’s what a popular news site has consistent resorted to doing:

This slideshow requires JavaScript.

What they don’t realize (or they probably do but are willing to take their chances anyway) is that such in-your-face advertising is a sure-shot way to irritate the end user… specially if your site is a news portal.

You cannot expect your users to be happy when for 10 seconds (more or less does not matter), you take away their capability to navigate to more news/content that they are really interested in and instead show them some dumb ad for products they probably don’t need or are not interested in!

This is not smart advertising… but it sure is an innovative way of telling your users they don’t matter!

Of doors and telephones

Ever since I’ve actively started screening my twitter stream, I’ve come across a lot of great articles on usability and good design principles.

A very interesting and standard pattern these articles seem to follow is that in order to bring out principles of good design, they pick up real world examples of bad design and explain why the design is bad; how it violates certain usability guidelines and how you can apply a design principle to make it a good design.

Another peculiar thing that I noticed is that almost invariably, most of these articles end up using two very common everyday objects as  examples of “bad design” : telephones and doors

I can sort of understand and agree that telephones can get intimidating to users specially when they try to use the advanced features like multi-way conferencing or setting up auto redial on no response.

But I was pretty surprised to find so many doors being cited as examples of bad design. A door is a pretty straightforward simple everyday object with absolutely no advanced behavior. All you can do with it is Open it and Close it by either a pull or a push. Even simpler ones are the sliding doors, which i’ve never even bothered to think about because I don’t have to do anything to get them to open or close. I can walk by and be sure they’ll automatically open and shut and let me in or out. Thankfully, i’ve never had panic attacks being trapped inside closed unlocked doors not being able to figure out which way it opens!

Things are about to change though. those very same doors that i’ve walked through innumerable times are in for a close scrutiny when i pass them next time. Indavertantly, i’m sure i’m going to stop and take a second look at them, review their design and slot them into good design/bad design buckets!


Smart Design.. or designer??

Well, what would you do if you were asked to create designs for bears? I mean, apart from telling me that i’m probably out of my mind!

Would you give it a try?

Take a look at this slide deck which i came across  in my twitter stream:

Lucy Spence makes it look so easy

… and so logical!

Logical it is. Most usability folks will agree that observation is the most important step in getting to know your users; even if they’re bears! Observe them and you’ll know what they need to get their work done; making it easier for you to give them what they actually want.. rather than second guessing.

I loved the uncomplicated and to the point sketches that get the point across very well.