Hacker News User Interface Example?

2 points by graycat ↗ HN
My opinion: The user interface (UI) example of Hacker News (HN) is in strong contrast to the UI in many millions of Web sites, sites where some common UI design ideas are causing many users to become angry and leave.

(1) Full Screen

E.g., via email a site sends me a code of a few digits and wants me to type the digits into their Web page, full screen, but I need at least two windows open, one for their site and one for an email program.

For a site that puts up a full screen window, my common reaction is to get angry and leave the site -- GALS.

(2) Cursor Tracking

Some sites track my mouse cursor and in response make major changes in the window as I'm trying to read it.

Again commonly my reaction is to get angry and leave the site -- GALS

(3) Overlays

Sites frequently cover up much of their main content with some smaller windows.

GALS.

(4) Invisible Boxes

Text boxes, single line and multi-line, are basic UI tools, but some sites make the boxes invisible until a user moves their mouse cursor guessing and clicking.

GALS.

(5) Elegant Text

Text that is so small/light it is difficult to read is frustrating and not elegant.

GALS.

(6) Long Text Lines

A line of text with more than 50 characters, each large enough to read, can easily have length greater than the width of the window, especially if the window is not full screen.

GALS.

So, usually flow the text so that the lines fit the window width.

(7) Missing Scroll Bars

Horizontal and vertical scroll bars are often useful or nearly necessary and when missing -- GALS.

(8) Swollen Head Disease

Windows commonly have some header material -- logos, links, text -- at the top of the window, but also commonly vertical space is in short supply with the desired, unique content reduced to 10% of the window height.

GALS.

(9) Dynamic Header Disease

So, I'm reading some content, scroll up to read some the content again, and, BAM, suddenly some header material appears and covers up just what I'm trying to read.

GALS.

More generally, once a Web site has sent a window to a user, it is the user's turn to read the window and respond; so, minimize or eliminate changes in the window that was sent before the user responds.

(10) Hyperactive Content

Some sites start with text, images, video, whatever, sometimes in little sub-windows, rapidly changing, flashing, too fast to review. Maybe the flashing is supposed to get the user excited and enthralled with the site.

GALS.

(11) Changing Key Functions

Some sites change the functions of the keys Page Up, Page Down, etc.

Fancy programming? Yes. Good UI? Nope.

GALS.

(12) Billions Already Know

Important UI controls include check boxes, radio buttons, push buttons, single line text boxes, multi-line text boxes, links and now are understood by billions of people.

When these controls are changed, the designer understands the new controls and billions of people don't.

GALS.

(13) Icons

Using the Roman alphabet. can type words, display them on a screen, print them, pronounce them, etc., but with icons can't.

With too many icons, GALS.

(14) Favors

Favors are usually just unwelcome interruptions in the work I'm trying to do.

GALS.

(15) Top of Z-Order

Each window needs an area in, say, the upper left (UL) corner of the window where a click will bring the window to the top of the Z-order.

Without such an area, GALS.

(16) Acronyms

We expect that the users of a Web page know less than the creator of the page. So, users may not know all the acronyms the creator knows.

With too many acronyms, GALS.

There are more such issues -- likely it's all common sense.

2 comments

[ 2.8 ms ] story [ 17.3 ms ] thread
What is GALS?
> get angry and leave the site -- GALS.

Since I posted, went to the Web site of my auto insurance company: The borders of their text boxes were so light they were tough to see. That is better than the Web site of my Internet service provider (ISP) where the text boxes are fully invisible until guess where they are and left click on that spot.