WPDFD Issue #45 - December 01, 2001

Interface Design Primer

Computers are pretty dumb devices. They can only count on two fingers, but they can do so incredibly quickly. When programmers communicate with their computers, they use languages that they can understand as well as the computer. These languages are not simple binary 0 and 1s, but they aren't plain English either, they are something in between, a bit like speaking in abbreviations. As long as the programmer and the computer know what the abbreviations mean, everything works fine.

A menu of hypertext links works very well. It is easily understood and fulfils the intended function admirably. Everybody knows that a chunk of underlined text is a clickable hyperlink. If you decide that you want to provide an alternative to this tried and tested interface convention, you have to come up with something that works just as well, if not better. Now, the term 'graphic design' does not always mean the same thing to different people.

The Tabbed interface

The very familiar, if somewhat tired, tabbed interface is clearly understood. It only requires two button states, on and off. The fact that it works so well as a navigational device shows that it is difficult to separate 'familiarity' in the positive sense with 'cliché' in the negative. You can't have one without the other. If you do decide that you want to be creative and stray from the straight and narrow, that's perfectly okay.

In this example, the current page is, quite logically, removed from the range of choices of pages that you can go to by 'ghosting' the link button. This mechanism requires that the destination page is clearly titled elsewhere using static text. Another way is to make the HOME button become the actual place name instead of a pointer to it. That is a fairly subtle distinction but many interface design mechanisms are subtle.

Latching radio buttons

This interface uses the 'latching radio button' concept but presents it in a more modern way where electronic switching supersedes mechanical springs and levers. Real electronic switches usually have a 'click' effect to provide 'confirmation of operation' even though it is not technically necessary. 'Touch' switches that provide no feedback can be very disconcerting. This navigational device uses the principle of 'latching radio buttons' but in a less literal way.

Adobe Illustrator 10

Once you get over the shock of Illustrator 10's new interface style, there are yet more surprises in store. Now that it has 'come of age', it is starting to care about its looks and the new toolbar of subtly coloured icons - some old and familiar and some brand, spanking new - certainly give the program a long awaited facelift. Underneath the makeup, there are lots of new functionalities, especially for Web designers.

New Masters Of Photoshop

Friends of Ed books are well known and highly regarded by designers who use Macromedia Flash. Now, they have turned their focus on Adobe Photoshop and the recently published New Masters of Photoshop shows every sign of meeting with similar success. If you are new to Photoshop and its many wonders and are looking for an instant tutorial, this is probably not the book for you. It makes no pretensions about being a shortcut to Photoshop proficiency, as some others do.

The 'Prestige'

One of the most popular effects used for animated logos in film and television is the 'prestige' – a spotlight or shaft of light that traverses the text, sometimes accompanied by sparkling highlights. This is not something you would want to do with an animated GIF, it 's too subtle and would require many high color-depth frames giving a huge file size. Using Flash, it is very easy! All you need is the static white logo on one layer, and a travelling colored mask on the one below.