THIRTEEN PRINCIPLES OF DISPLAY DESIGN(checklist)

Application: GMAIL CLIENT

A. Perceptual Principles

1. Make displays legible (or audible)- most displays are legible .

2. Avoid absolute judgment limits

Do not ask the user to determine the level of a variable on the basis of a single sensory variable (e.g. color,
size, loudness).
Gmail client provides the option of distinguishing folder labels by allocating them different colors. Some color differences are neary
identical almost indistinguishable. It would have been worse if they did not insert some text in the label. See the labels “my file” and
“docs”, “receipts” & “personal” below:

Image a: view after from the all mails folder

image b: view from the navigation side bar.

3. Top-down processing

If a signal is presented contrary to the user’s expectation, more physical evidence of that signal may need to be
presented to assure that it is understood correctly.

Image : pop up produced after a user discards an email

The pop up label “the conversation has been moved to trash” appears immediately after user has deleted a mail, just to confirm if the
action just done was understood correctly. It evens provides a “undo” option just in case the user did that unconsciously.

3. Redundancy gain(ok)

If a signal is presented more than once, it is more likely that it will be understood correctly.

The concept of organizing email into labeled folders has been emphasized by the same whenever you access the mail in non
classified folders such as inbox as illustrated below.

image1. Concept referenced on the navigation section

image 2: concept referenced again at the folder “all mails”

5. Similarity causes confusion: Use discriminable elements(poor)

The ratio of similar features to different features causes signals to be similar. For example, A423B9 is more
similar to A423B8 than 92 is to 93. Unnecessary similar features should be removed and dissimilar features
should be highlighted.
 The dates “Mar 26, Mar 27, Mar 28,Mar 29, Mar 30..etc.”” are similar:

 Assume that the emails below were received from the same sender and had the same subject titles, such that the only way to
differentiate between the mails is only the dates(I wish I had a good example for this, anyway). The idea is; the user will have a
had time picking a particular mail sent on a date x. see the image below.

Recommendation:

They should provide the famous “sort by ” functionality so that in cases such as one described above, user can ‘sort by ‘ , say,
“week1” nested in ” month 2” nested in ” year 1” and so on. That way the same would appear more dissimilar.

B. Mental Model Principles(ok)

6. Principle of pictorial realism

A display should look like the variable that it represents.

image a: clip icon for Attachments on mail

image b: search & refresh icons

 realism of the search icon; in the science world , inorder to view objects closely in more details, magnifying lense is used.

realism of there refresh icon; reload or repaint or refresh all because repeating ie. going back to th original/the previous state. no
other pictorial representation beats the circular arrow used here.

7. Principle of the moving part(poor)

Moving elements should move in a pattern and direction compatible with the user’s mental model.

image: Gmail client trying to load a given folder; see”loading…”

when in progress the load shows no movement, infact it appear same as in the figure above without any movement to indicate
progress. in this case the user is bound to wonder whether theres progress or the process has halted(just hanging).

Recommendation:

Replace with a more realistic element such as or .

C. Principles Based on Attention

8. Minimizing information access (excallent!)

A display design should minimize this cost by allowing for frequently accessed sources to be located at the
nearest possible position.

Gmail client has implemented this principle, I would say satisfactorily by placing the frequently accessed folders &
functions(compose mail, inbox, drafts & sent mail) at the same location(side navigation bar). illustration:

image: side navigation bar

9. Proximity compatibility principle(ok!)

Divided attention between two information sources may be necessary for the completion of one task.
Information access costs on this sources should be low, which can be achieved in many ways (e.g. close
proximity, linkage by common colors, patterns, shapes, etc.).

task: communication, sources: mail(compose & inbox), pc chat, sms chat.

 close proximity: all located on the side navigation bar, chats are more close; located next to each other.
 shapes: both the sms and pc chat hava the icon ie. same shape. see the image below
 

10. Principle of multiple resources(ok!)

A user can more easily process information across different resources. For example, visual and auditory
information can be presented simultaneously rather than presenting all visual or all auditory information.

CHATS: can be textual or voice or video( simultaneous audio and visual)

 image below: shows a chat that provide the option of using voice chat, video or the default textual chat.

D. Memory Principles

11. Replace memory with visual information: knowledge in the world(excellent!)

A user should not need to retain important information solely in working memory or to retrieve it from long-
term memory. A menu, checklist, or another display can aid the user by easing the use of their memory.

The client has given the principle numerous considerations on this by providing the following:

 menu in form of side navigation bar; we have seen that more enough times
 using already familiar pictorial elements eg. telephone, vcr recorder, human picture with a plus to represent voice chat,
video chat, and add people chat options; see the image below.

that way users need not recall how to; add people to chat, use voice or video chat. I mean all they have to do is just use
common sense and click on the icons.

12. Principle of predictive aiding

Proactive actions are usually more effective than reactive actions. A display should attempt to eliminate
resource-demanding cognitive tasks.

task: composing new mail; predictive suggestion of the email to use

client can suggest email address you might want to use from the commonly used addresses when composing a new mail. see the case
here;
That way the user need not type down the entire email addresses.

13. Principle of consistency(excellent!)

Old habits from other displays will easily transfer to support processing of new displays.

The client maintains the same frame format in different tasks; infact the only part that changes is the central part of the frame.
Navigation links, menu bar remain consistent. See the images below

image 1: compose new mail interface

image 2: access inbox interface