CS252. User Interface Design

Lecture Outline for Jan. 31
Typography and Text


1.     Choosing Typefaces
     Even the most advanced graphical display relies on text to convey information




     Typography:  the study of letter forms





     Terminology originates from when lead pieces were hand-aligned to form text
          Baseline


          X-height


          Cap-height


          Ascender


          Descender


          Type size

     

     Type measurements


          Leading: 


          Kerning:


     Examples of typefaces


          Typeface :


          Font :




2.     Choosing Other Text Characteristics
     We read by recognizing the overall shape of words   not by parsing each letter and then
          assembling a word



     Legibility depends on the tops of words



     Capitalization [Rehe 1974]
          Words set in all capital letters are monotonous   to hard to distinguish quickly


          Only use initial capitals in titles or for proper nouns


     Line length



     Alignment  [Trollip 1986]





3.     Guidelines for Displaying Text
     Adapted from [Dumas 1988]
     (1) Display text using mixed (upper and lower) case and with normal punctuation.


     (2) Keep lines to a reasonable length, and put a blank line between paragraphs.


     (3) Use upper-case words and boldface words only when you need to highlight them.


     (4) Left justify text, leaving a ragged right margin.


     (5) Avoid hyphenation of words between lines.


     (6) Use abbreviations and acronyms only (a) when they are significantly shorter than the full
     text and (b) when they will be understood by all users.



.
4.     The Importance of Words
     Thus far, we've talked about the form of text
          the choices of actual words can be just as important
     Let's think about portions of the interface that rely on words:
          button labels
          menu items
          checkbox lists
          command languages
     Vocabulary: the words selected to represent interface actions, objects, etc.
          Two key aspects: organization and ergonomics
     Organization:

          Lexicon


          Use of mnemonics


          Availability of glossary




     Vocabulary is the total collection of concepts and names used in an interface




     Typical problems with interface vocabulary: inconsistency, incompatibility, poor ergonomics
     Consistency




          Achieving consistency requires choosing a structure and sticking to it
          Examples: all menu items will be "action object"




          An example from command languages [Pancake 96]





     Compatibility
          Achieving compatibility means considering how things are said/done in English
          Example: early operating systems had "copy <dest>=<source>"

     


     Ergonomics