Sarah was excited about helping her mother prepare Thanksgiving dinner.  She watched as her mother cut both both ends off the ham before putting it in the pan and then into the oven.

“Mom, why did you cut off both ends of the ham?” Sarah asked.

“That’s the way my mother always did it, so that’s how I do it.” said Sarah’s mother.

“But why?”

“I don’t know.  You should ask your grandmother. “

Sarah walked out of the kitchen to find her grandmother.   “Grandma, when you prepared ham for baking, why did you always cut off both ends?”

“That’s what my mother always did it,” said Sarah’s grandmother.

“But why?”

“I don’t know why.  She taught me to cook and I have always done as she did.”

Sarah was even more perplexed by this.  She found her great-grandmother in the living room and asked her.  “Great Grandma, when you prepared ham for baking, you always cut off both ends.  Grandma and Mom do the same thing but couldn’t tell me why.  They said they do as you did.  So I’m wondering, why did you cut the ends off?”

“Well,” Great-grandma said, “when your great grandpa and I were young, we only had one pan and the pan was too small.”

Do you know why?

So much of what we do as designers and developers becomes habit.  We do much of the same thing day in and day out, driven by process, influenced by experience.   There is a great deal of comfort and safety in process.  It allows us to control our development.  It allows us to review and create repeatable events and reusable deliverables.  It helps us become more efficient.   But it also strangles us and encourages the use of blinders.  Process can hinder and hamper and kill your projects.

Too much process is a bad thing

In an effort to become efficient, we have created a culture of non-thinkers and non-questioners.   We do things because we were told to do it a certain way or because that’s how it’s always been done.  While I am a big proponent of process, I am not a proponent of blind process.  Blind process is what happens when we rely so heavily on templates and the expected workflow that we forget to analyze, discern and improve.

No project is exactly the same as another.  No client is exactly like another.  No two needs or requirements are exactly the same.  The business need behind a technical requirement may be different which would require the implementation to be handled uniquely.  The audience may be different, requiring special handling or treatment.  If we rely on our repeatable processes and templates so heavily that we forget to think and envision and question, we are cheating ourselves, our clients and the audience who will be using the product, the website or the application we are creating.

Don’t get stuck

It’s important to question the whys and hows to make sure we are considering all options.  Processes and templates are tools meant to assist, not stifle.   The way it has always been done is not a one-size-fits-all solution.  Sometimes the reasons have changed or technology has progressed.  Perhaps there are ways to solve business problems or design solutions  that weren’t considered or weren’t possible in the past.  Even if something was determined out of scope, out of consideration, outside the realm of the possible, revisiting those whys is worth at least a passing glance.

Challenge the idea that it has always been done a certain way and get to the reasons behind the whys.  And if your pan is still too small, it could be time for a bigger pan.

If you are unfamiliar or uncomfortable with paper prototyping, I highly recommend this next video. Sometimes we have to go back to our less jaded days and revisit the simplicity of childhood.

You hear on the news that a new gourmet tea shop has opened. Your mother-in-law loves tea and is coming for a visit.  Your rush out to purchase this highly coveted tea but realize you don’t have a teapot.  It doesn’t need to be a fancy teapot; just an ordinary, every day teapot.  The color and material are not all that important. But you need a teapot and you need it now.

You run into the closest store, ignore the recommendations of the trained salesperson, and pick up a teapot from the clearance rack.  After rushing home you add the tea to the pot, pour in the boiling water and wait 3 minutes.  You present the tea along with delicious cookies to your mother-in-law and wait for the accolades.

Based on the picture above it seems rather unlikely that you will receive much in the way of accolades, don’t you think?

I want it now!

As an indy web team that develops sites for small businesses and ministries, we are often faced with the challenge of explaining the importance of sound design and usability.  A high percentage of our clients are less than tech-savvy.  They do not understand geek-speak. They don’t understand what goes into designing a website.  They just know they want a website.

To say that designing for small business clients is a completely different experience from designing for medium to large businesses and government is an understatement.  Large organizations have IT, Marketing and Brand Departments.  Large organizations tend to have a better understanding of trends, colors, design, web standards and usability.  Large organizations are also more understanding of process and shared responsibility for the success of the final product.

Designing for small business often requires us to educate our clients and to communicate in a different way.  When discussing usability with a former client I was told: “Don’t worry about all that. Just make it look good.”  Unfortunately it’s not quite that simple.  It has to look good and work right.  And often the “just make it pretty” folks can tell you exactly what they don’t like AFTER you have already delivered what you thought was the completed site.

But I like the marching ants!

We have encountered clients who really like animated cursors or auto-playing videos or music.  Steering them clear of these things can be a challenge. They genuinely like those things and believe it will make their site better.  Do not make usability and basic design standards the sacrificial lambs of your work.

In order to gain buy-in and trust, we use best-in-class examples for organization of information, navigation and design.  We walk through sites the client likes – some in the same business, some not – and ask what they like and do not like about those sites.  We talk about good web site experiences and bad ones, gathering information, but also, gently nudging the clients towards attractive AND usuable designs.

James focuses on design elements.  He engages and leads the client through the conversations regarding layout, content and branding.  I work to understand the business, the business owners and their customers.  I gather information about the elements of the business – their products and services, the feeling you get when you walk in the door or when you speak to the owner or someone who works there – to give me an idea of how we should approach the design.  I also look at the strength of the brand – if there is a clear brand involved – and how we support that and even build on it.

We use all the information gathered to create the conceptual designs we present to our clients.  The visual representations of those discussions are the most valuable pieces of work product we produce outside of the delivered site.  Working without those mock-ups would handicap us and increase the likelihood of rework down the road.

Now, about that teapot

The unusable teapot is what we get when we fail to engage our clients in a way that gives them the website they truly need.  In working with small business clients we have found that they often want a website but haven’t given it much more thought than that.  Our conversations elicit the responses that allow us to connect the want with the need and avoid the little red teapot above.

A quoi ça sert? (What’s it for?)

Asked by President Jacques Chirac of Prime Minister Tony Blair upon being shown the Millennium Dome – which has no discernible function.

Born to question

That I am an analyst is a predisposition, being both genetically imprinted with some random mutated analysis gene and further etched by the environments in which I have always existed.  My mother says I was always asking who, what, how and why so it started quite young.  My choice of careers (I’m on number 4 at this point) has also continued my grooming and maturing as an analyst.  I was encouraged to ask questions and to delve into the inner workings of things which suited me just fine.  It probably annoyed a lot of my family, but that curiosity and need to understand has served me well.

• Why is it done that way?
• Who decided it needed to be that way?
• How is this supposed to work?
• What are they trying to do?

Questions are good things in my line of work.  They are meant to spark discussions, to inspire, to energize and excite.  They are used to dig and probe and uncover.  Answers are meaningless without understanding the questions that lead up to the revelations.  When you’re designing things like products and websites, those questions and answers are the foundation for your work product and eventually, the realization of someone’s visions and dreams.

So I often ask myself – am I asking the right questions?

No stupid questions

We’ve all heard it and frankly I disagree.  There are stupid questions.  Asking the wrong question is asking a stupid question because it won’t lead you to the heart of the matter, to the golden nugget of truth that you need.  Pointless, stupid questions are irritating and distract us from the truth.

One of the questions I view as being rather stupid is “Why”.  I know it was my favorite when I was about 3.  It was always my mother’s least favorite question, although it led to what I believed was her favorite response: Because I said so. Asking my favorite question always seemed to lead to my least favorite response.

Let me explain about asking why.  Why stirs up a rather base instinctual need to defend our position, our choice, our feelings about what we want, need or believe.  Asking why doesn’t bridge a gap, it widens the gap.  Asking why puts you on one side and your client on the other, forcing them to defend their reasoning. And more often than not, asking why doesn’t get you to the answers you really need.

Engage to Envision

I engage in order to envision the need for, the usage of and the emotions behind the design.  Questions should not answer themselves.  They should lead to more discussion not less.  Questions should be starting points for visualization and creation.

I believe that design wraps around function which complements design.  This fusion of ideas should evoke positive emotions, be intuitive, useful, usable and beautiful. Many clients get emotionally attached to a certain way of doing things, the particulars of navigation or placement of text or an image that has always served them well.  It’s my job to use that emotion to inspire new ways of thinking, to broaden their reach, to heighten their awareness of how others think about and respond to something as simple as the shape and placement of a button and its corresponding text.  For me asking why doesn’t serve my clients and it really doesn’t serve me.

Asking the right questions, engaging and creating an environment in which ideas are brought to life is the very foundation of solid design.  The ideas and emotions I capture are handed over to the artists who breath life into the words and sketches.  To make it work I have to know I have gotten to the very core of the processes, thoughts and emotions.  I don’t want to find myself in Tony Blair’s position of needing to explain what something is for because it means I have missed the mark.

Refining the questions asked and the tools used to encourage and support the communication and creativity is part of my on-going evolution as one who seeks to make things better.  Reaching out to others who do the same is part of that process.  So I ask you: What questions should be asked to avoid those A quoi ça sert? moments?

What is the foot without the little toe?

Or the head without a heart?

 
Could you walk without your little toes?  Can you imagine thoughts without emotions?  That’s exactly what you experience when you visit websites created without design and usability as complementary components – emotionless thoughts, thoughtless emotions, footless toes and toeless feet!   

In “Form or Function: When Creativity and Usability Collide“, I discussed the often oppositionary principles of creativity and usability.  This is a subject near and dear to my heart because nothing irks me more than beautiful design that is not functional and functional design that is flat out ugly.  While it can be challenging to blend form and function, it is not only possible, it is necessary.

Did you hear what that crazy guy Sullivan said?

 
In 1896, architect Louis Henri Sullivan said, “Form ever follows function.”  Unfortunately, the simple elegance and beauty of this statement is lost and bastardized into meanings that Sullivan never intended.  Regardless of what you may have heard or been taught, this chunky little nugget of wisdom was never uttered to imply that function was more important than form.   It is also important to acknowledge that contrary to pop-culture “wisdom”, dying for one’s art is highly overrated, particularly when the art becomes the means to the end. 

Sullivan’s statement started the debate about form and function.  However, Frank Lloyd Wright made it perfectly clear by stating, “Form and function are one.” 

All ego aside, the naked truth is simply this:  Form and function are inseparably intertwinable. Good sites render an understanding of this ideal.  Great sites exemplify it.

A website should…

 
What is the goal of your website?  It should be to communicate.  How effectively you communicate will result in the amassing of fans or detractors.  That first impression is what keeps people on your site or drives them away.  Make no mistake about it: ugly and unusable sites do not attract return visitors.  Note the AND in that statement.

“Informational Mediocrity”

Most corporate and government sites are information-rich.  These sites succeed in making the information available to visitors, but quite frankly, the design is usually a bit “safe”.  The information is well-organized, easy to find, and you won’t likely get lost along the way.  It may seem silly to think that a corporate or government site should have an “attitude”, but brand is everything.  If your brand says, “Meh. Get your information and go”, that is exactly what the visitors will do. 

“Peculiar Pandemonium”

Some sites are all about the razzle dazzle.  There may be some function mixed in there, but the designer was obviously more interested in the purity of the design than he/she was in whether the visitors to the site would have half a clue how to get to the information they need.  Sites in this cateogry are often bloated with too much eye candy (flash apps, widgets and whats-its, oh my!) and rely solely on the “WOW” factor in an attempt to woo visitors into returning.  The problem here is that the information is scant or hidden, navigation and functionality BE DAMNED!

What is a great designer to do?

Elemental Organic Design

 
Before you hit me with choruses of “not another buzz phrase”, let me emphatically state that I abhor them.  Buzz phrases are overused and more often than not, misunderstood by those trying to impress you by using them in ordinary conversation.  However, simply put, great websites are organic. 

What is organic design?  Organic design is the harmonious blending of creativity and usability that integrates aesthetically pleasing imagery with intuitive navigation and organization.  In other words – it looks good and you can get to the information on the site easily.  Elemental organic design simply means that each piece of the website has a purpose, functionally and aesthetically, that maps back to the goal for the website which is communication.  No single piece or part can or should stand alone, and the whole site is greater than the sum of its parts.

Seems like a no-brainer, don’t you think?

How do we get there?

 
The concepts are easy to understand, but the practice of making usable beautiful sites is more challenging.  You can’t tie your vision of success to winning the perceived battle of usability vs creativity.   You must invest in the entire project, not just your piece of it, focusing on excellence over ego. 

What does success look like?  I will leave the usability/design blend article in this series for HG to craft.  He straddles the UX/UI and Design Geek line on a daily basis, operating as a bit of both in his “day job” and certainly both in our business.  We are constantly re-evaluating previously completed work in order to improve our work product and better serve our clients.  It’s a work in progress, and something every designer and UX/UI geek should consider.

Part III

The Two-Headed Beast – UX/UI Designer

The significant problems we have cannot be solved with the thinking used to create them.   Albert Einstein

The basic need of the creator is independence.  The reasoning mind cannot work under any form of compulsion. It cannot be curbed, sacrificed or subordinated to any consideration whatsoever. It demands total independence in function and in motive.   Gary Cooper as Howard Roark in The Fountainhead 

It is the pervading law of all things organic, and inorganic, of all things physical and metaphysical, of all things human and all things super-human, of all true manifestations of the head, of the heart, of the soul, that the life is recognizable in its expression, that form ever follows function. This is the law.   Louis Sullivan

Brand Me

Web Designers – those gloriously creative, kind of quirky but brilliant minds that visualize the possibilities in vivid colors and memorable effects.   These free spirits make your “brand” visible to the world and for many years had almost free reign to design and create and bring websites to life.

Use Me

Usability is a big word these days, so big in fact, that we now have usability experts and “Certified Usability Analysts”.  Entire departments and organizations are dedicated to usability or the so-called “Human Factor” in design.  Usability specialists want to make sure that when you visit a web site, you know what is on the site, how to get to it, and that you can get there without really having to think about how to get there.

Clash of the Titans

It is the designer’s job to give birth to visual beauty of the site.  The designer takes the visions of the company or the business owner and breathes life into them in a way that is visually appealing and unique.

It is a usability specialist’s job to be analytical; to evaluate the interaction between the product and the human. For a usability specialist the focus is on function, not form.

In the minds of many designers, creativity is the most important part of a website.  Creativity is required to connect experiences, emotions and understanding.  Designers connect all the bits and pieces and create something that is greater than the sum of its parts.

In the mind of many usability specialists is the belief that usability is the most important part of a website.  A site must be easy to navigate, easy to read, easy to use.  If it isn’t usable, it is worthless.

When creativity and usability collide, there is often a power struggle between the designers and the usability experts.  I believe this is due, at least in part, to a misunderstanding of the oft-quoted mantra: “form follows function”.  In truth, neither form nor function is the key to a well-designed website.  It is the balance of the two that truly makes a website a success.

Part II

Form and Function: When creativity and usability unite