May 25th, 2010

Web site design process

Filed under: Essays — Ondřej Válka @ 09:07

Just a few notes on the Web site design process. Try to get all the books mentioned and go through them.

February 9th, 2010

Designing Web sites for iPad

Filed under: Essays — Ondřej Válka @ 00:32

Our life is easier when facilitated by computers, not when facilitating the life of computers.

Some of the Web site UI design principles that are likely to change in the emerging screen-only computer era. Remember that these principles are just as appropriate for standard Web site UI design as for the iPad specific design.

Rest in pieces

  • :hover effect is gone.
  • Tiny UI elements such as small links, tiny carousel controls are out.
  • Fluid width would never return again.
  • In pixels we trust, in type-only resizing we don’t.
  • Cash? No Flash.
  • Stop the pop-up windows.

Welcome home

  • Zoom together with details that matter.
  • A page fold redefined.
  • The neverending story of 1024×768.
  • Change of navigation (within a page—horizontal scrolling).
  • More standards and more AJAX.

And not only the design itself will change—iPad can become a suitable prototyping tool too.

Further reading

January 3rd, 2010

Visibility of system status

Filed under: Essays — Ondřej Válka @ 10:52

Original post Everyday Usability Heuristics: Visibility Of System Status was published at Usability post. Thanks Dmitry!

Two weeks ago, I was watching my 45-year old father browsing the Internet. Every time I watch him I learn a lesson in usability. I’m sure you know with situations like this one – valuable opportunities to learn from the ordinary users for whom we design.

As he is using Windows XP the very first thing he did was that he ran Firefox clicking an icon on the desktop. No response. Nothing happened so after a few seconds he clicked the icon one more time. With his eyes focused on the Firefox icon he clicked the icon again. Everything he got was three Firefox windows opened. Sounds familiar?

The moment I saw this process I realized how applications are launched at my Mac OS X. Being clicked, the Firefox icon starts jumping in the dock. It’s not just a fancy effect, but a really useful feature. Clicking an icon user gets apparent immediate response. Moreover realize what you do: anytime you want to click an element, your eyes sticks to it. You are not watching the pointer, you just use a mouse and click. The same did my father.

Mac OS X Dock

Is a small flickering sand-glass beside the pointer more apparent than a big jumping Firefox icon that user’s eyes are sticked to? Keep this in mind and try to design thoughtful user interfaces. It’s not just about applying the Nielsen’s rules.

Of course it doesn’t matter what, but it also matters how.

January 2nd, 2010

Web site design process techniques

Filed under: Essays — Ondřej Válka @ 22:10

Working on my bachelor thesis—redesign of a community Web site signaly.cz—I have collected a bunch of methods and techniques I should learn, apply and finally mention in my work. Here are some “mind maps” describing what every Web designer should know.

Be aware of the fact, that this is just a list of Web site design process techniques. It could serve as a springboard for intermediate Web site designers. Try to:

  • Read it.
  • Check the Resources section in the end of the article.
  • Study all the books and articles—I drew on just these resources.

Step 1: Briefs

Get a client brief from you business partner. Than form a creative brief and technical brief. Finally, try to figure out idea brief(s).

Briefs

Step 2: Research

Here is a huddle of methods that can be performed during the design part of process.

Reserarch methods and techniques

Step 3: Ideas

Organize a strictly moderated idea session or try one of these utilities.

Ideas part utilities

Step 4: Deliverables

Having collected all the necessary pieces of information, start creating deliverables—documents, that are useful in some way and describe the final design process product.

Deliverables

Tools

This utilities could be applied in any part of the design process. Try to figure out, if they are useful to you.

Web site design process tools

Resources

All the books and articles mentioned down there are stuffed with knowledge, describe techniques mentioned above and will help you with understanding them.