eSites Network Website Design


A picture tells a better story than your site

A common theme that has been discussed about design is how design can tell a story and yet so often websites don’t do a good job of conveying that. Most design sites do a decent job of showcasing designs here that are more than a pretty design, but it is still hard to tell a great story when you have other stakeholders involved.

Looking at the picture above you subconsciously already have a story in your mind. It is amazing the effect a great picture can have on a person and yet when sites use images it is for pretty things or have absolutely nothing to do with the message. The great thing about the web was the promise of multimedia. If you went back to the 1960s and told an advertising agency, publisher or graphic designer that they would have a medium where they could create video, sound, moving image, beautiful photography, endless amount of content and user interaction, can you imagine how excited they would be? Could you even dream of the possibilities they would come up with?

We’ve grown to a place where we take the web for granted. We don’t understand what we have in front of us and I think only 0.0001% of the sites on the web have truly taken advantage of it all. Granted the medium is still in its infancy compared to print, but with so many people working on it you would feel that there would be better experiences.

Current offerings seem to fall under these categories:
  • Prettier brochures than the brochure-ware sites in the past.
  • Pure video mediums that offer nothing more than a video on a screen.
  • Photo books that aren’t complemented with words that will enhance the story.
It is weird to me that it seems that with everything that we have at our disposal, we feel that we need to separate them all.

Here is a simple page. Nothing more than a little bio and an image, but the image itself gives me insight into Kevin Rose that the words on the page could never do. Instead of competing against each other, they provide a nice complement to tell the Kevin Rose story. Stock photography can never tell the story and in fact usually detracts from any type of story trying to be told. This page could easily be enhanced with some audio or video, but could also be destroyed with their addition and therein lies the problem.

We have become so jaded with audio and video on a site that many times we shy away from it only because they weren’t used properly. Just because you have them at your exposure doesn’t mean you should use them, but these tools are so powerful it would be silly not to use them. Any great movie combines imagery and sounds to produce a great experience for the viewer. We are afforded more tools online and yet we don’t come close to emulating such an experience. I’m not sure why.

The web has to be more than just applications. It has to offer a better experience than what eBay, Amazon or Google offer by default. Does this mean that every site should be an epic experience shared with everyone? Not at all and that is the beauty of the web. It is so flexible, but most of the sites lean towards one of end of the spectrum when there should be more balance.

Imagine the story you could base around this picture? You have better stories for your next design, hopefully you find the right means to tell it.

The 10 Principles for Good Design

10 principles of good design that would help guide designers down the right path. These were written in the 80s before the proliferation of the web, but it is interesting to see how well they do apply to not only industrial and print design, but to web design as well.

1. Good design is innovative

This is probably something that the web could do a better job of, but unfortunately it is very limited to the tools at our exposure. By tools I don’t mean development tools, but the actual tools that we use to interact with the web. When you are so worried about making something work across a number of browsers it can be hard to push the boundaries of where you want to go.

Some argue that Flash is the perfect way to get exactly the same experience across a number of browsers, but Flash performance isn’t up to the level that many companies want their experiences to be.

2. Good design makes a product useful

Color. A very, very pretty design, but who actually found it useful? The design itself didn’t communicate the purpose of the application and therefore it failed.

The first versions of eBay, Yahoo, Geocities, etc. were hideous, but they did enough to make the product useful. This didn’t make them good designs, just effective designs. Color couldn’t get the effective (useful) part down.

3. Good design is aesthetic

For some reason this still seems to be a point of contention in all industries. I often hear people say that “good design just works”, which I don’t believe in. If that was the case then we would never need to improve anything because the majority of items that we use work as their intended function.

Craigslist was never good design. It was just a design that was able to build a community that worked in spite of its design. When it comes to some websites, community will trump design, but if you can combine both then you have a winner.

4. Good design makes a product understandable

I feel like I could reference Color all over again here, but instead I will do a bit of exploring. The very first Twitter homepage didn't do a very good job of showcasing the potential of Twitter or letting people know what it really was. Part of this was because the people behind Twitter didn't really know what they had.

Playing with an iPhone though the design helps to make a product understandable. Look at the simple lock screen. Have you noticed that there is a light that goes behind the words “slide to unlock” moving in the direction of where you should slide? It’s a very subtle design, but it subconsciously helps you to understand what you need to do.

5. Good design is unobtrusive

Adjective: Not conspicuous or attracting attention.
This one I am kind of torn on because aesthetic design attracts attention. Any Apple product attracts attention, but I guess the aesthetic itself doesn't attract attention away from using the device. It aids it. Many beautiful websites though do a great job of attracting attention on the design without having any focus on what the site should be used for.

It is very hard to gather how a design will pan out from a small 400×300 image, but a lot of the designs seem to be done to attract attention more than aid the functionality of the design. Good design is invisible as some would say. Of course there is a very fine line between invisible, attractive, hideous and plain.

6. Good design is honest

When I read this principle I think of Dark Patterns. Dark Patterns are intentional design methods used to confuse and guide user’s towards the desired goal of the company behind the design. They never have the user’s best intentions in mind.

There should also be honesty in the copy that you put in your design. Copy is just as much a part of the design as your icons and colors. Good copy is honest. It doesn't mean it is boring, but it doesn’t try to sell the user something that doesn't exist.

Good design doesn’t trick or deceive. Good design is what it appears to be. Nothing more, nothing less.

7. Good design is long-lasting

This one will be hard to fathom for web designers out there because rarely does a design last more than a couple of years on the web. Does that mean it was bad design? Not at all, but it might mean that the design was based on trends that have simply come and gone.

Long-lasting design comes more into play with regards to physical objects. I like to think that Apple and Honda create goods that are meant to be long-lasting. Companies don’t necessarily like long lasting though because it means you aren’t buying more of the same.

8. Good design is thorough, down to the last detail

Another principle in which 99% of the designers of the world will fail at. Some designers wish to see the forest before the trees and others want to see the trees before the forest. You have to be able to see the big and little picture at the same time when designing. It is a very tough skill to master.

How would you change your approach if every section of your site could be broken down? Imagine 20 different sections of your site separated into little boxes. Would each box be able to hold its own?

Careful though because there is a fine line between being a perfectionist designer that never ships and one that misses some of the little details because they are tired of looking at a design.

9. Good design is environmentally-friendly

Another principle that applies well to industrial design, but not as much to web design. Instead of thinking about the environment as the world, why not think of it as the environment of the body? Does your design cause a user to waste thought cycles or motions trying to figure out how to work your design? Can they save more and yet still get the same amount out of your design if you made a couple of small changes?

In this case, a splash page that is nothing more than a “start” button is an environmental waste. A form that has fields that are really necessary for the user to continue the experience is a waste.

10. Good design is as little design as possible

Ah, minimalism. As little design as possible. That is a powerful statement.

I’m just going to leave you with that.

What is Design?

What is design? This is a question that I get asked almost weekly and a site about design should have a sense of what design is. So often we post links to objects that are beautiful, but is beauty design? Maybe we will post a quote by someone that talks about the time, energy and patience that is needed to produce a quality design, but that doesn't answer what design actually is. If you are involved in the design process in any way it is a question that you have to continually ask to remind yourself of the philosophy behind your designs.

Your answer goes a long way in shaping how you approach the design process.

Look at the different ways people use the word design:
  • Jack Nicklaus designs golf courses.
  • There are people that design cars.
  • Landscapers design landscapes for your house.
  • Scientists will say that a skunks spray was designed to ward off predators.
In each case, the word design is being used in the same context. No matter what the person is doing, when they are designing, they are solving a problem.

Design and Beauty

I love the design of the Apple iPhone, as do many other people I’m sure. What do I like about it? I like the curves. I like the screen. I like the way you interact with it with your fingers. So from this we could say that design is how we interact with something. Maybe design is how we interact with a product or how an object interacts with its environment. However, I feel that design means more than that.

Digging even deeper we sometimes like the way something is designed because it is easy to work with. Making something easy to use is a by-product of great design. We don’t like to think too hard to solve a problem. Nature is the greatest problem solver of all. Looking at a plant, every piece of it can be justified. Nothing is extraneous, everything serves its purpose. Are all plants aesthetically pleasing? I don’t think so, but to me aesthetics is an opinion. Beauty is in the eye of the beholder as they say.

Going back to the iPhone example, what many people love about it is that it solves a number of problems in a beautiful device. The fact that you can make a phone call with the iPhone is secondary. The idea that you can store all of your music, watch movies, play games, find out how to get to that Mexican restaurant and many other functions all in a little handset is amazing. Apple never set out to create a better phone because it is hard to already improve on the functionality of dialing a number and connecting to someone else around the world.

It is a simple device. It is a joy to interact with. It is beautiful. All of these qualities by itself don’t make for a great design. It is the whole of the iPhone that makes for a great design. Although for some features, like turning it off you might have to read the manual, the overall usage of an iPhone is pretty easy. They say the quickest way to get from Point A to Point B is a straight line and in many ways the iPhone’s design encourages that. So in this case maybe we can say that design is the process of finding the quickest way to complete a task.

Then There is Emotion

Emotional design is not a new topic on this site. In fact, it is probably my most favorite topic about design to cover because it is so misunderstood and underutilized. Engineers like to solve problems without taking into account the aesthetics of things. Yes I am generalizing, so please forgive me if you are an engineer with an eye for the aesthetic. You really can not blame engineers though for solving a problem in the best way they know how. To them emotion probably doesn’t play a part in the solution of a problem, but human nature doesn’t seem to agree.
The main issue is that emotions have a crucial role in the human ability to understand the world, and how they learn new things. For example: aesthetically pleasing objects appear to the user to be more effective, by virtue of their sensual appeal. This is due to the affinity the user feels for an object that appeals to him, due to the formation of an emotional connection with the object.
Not sure if it gets any scarier than this.
You already know what an apple looks like. It looks appealing enough to eat. It has an aesthetic about it that invites you in to take a bite. We have no fear biting into an apple because of how it looks. A rambutan on the other hand would make most people want to stay away.

The Answer

Design is the process of finding the most elegant answer to the question of ‘how do I…?’
How do I get a huge hunk of metal in the air to fly across the ocean? I must design a way. How do I get someone to signup for my service they don’t know anything about? I must design a way. Both of the questions could be answered with ugly solutions. They could find old and archaic ways to solve the problems, but that isn’t what design is about. The elegant solution takes into account all aspects of the design. Taking the practical solution, the function, and adding the aesthetically appealing aspect to it, the form, and there you have a solution to the problem of ‘how do I?’