Interaction & Interface Web Design

• Interaction Design is often associated with the design of system interfaces in a variety of media but concentrates on the aspects of the interface that define and present its behavior over time, with a focus on developing the system to respond to the user's experience and not the other way around.

• The system interface can be thought of as the artifact (whether visual or other sensory) that represents an offering's designed interactions.
• Encompass three distinct, but related constructs:
  • Usability – Interaction design – Usability - usually refers to the elegance and clarity with which the interaction with a computer program or a web site is designed
  • Visualization, and
  • Functionality (Vertelney, Arent, & Lieberman, 1990) – relates with interaction design

• 
  

• Tips for Designing Visuals:

  • select your visuals on the basis of age, culture, and education
  • icons should clearly and logically represent the content they are linking to
  • While a combination of visual/verbal information is suggested, do not overwhelm the learner with extraneous verbal information.
  • Use arrows or other visual cues to highlight important components of your visuals.
  • The largest item in a display will attract the most attention
  • Understand the directionality of visual elements and their hidden meanings.
  • Vertically-oriented visuals (e.g., city skyline) are best placed at the bottom of a page to draw the eye upward toward the instructional message.
  • Horizontal visuals (e.g., camera) are neutral and stable
  
  
• Tips for Designing Text
• • Avoid the use of all capital letters for body text.
  • Text items in bold face or other style will command attention. Contrasted colors may also attract attention.
  • San Serif fonts without feet are most appropriate for titles or bulleted items on charts and projected presentations.
  • Provide for adequate contrast between figure and ground (i.e., text and background).
  
  Tips of Using Colors
  • Avoid the use of too many colors on one screen, especially font colors.
  • Pay attention to the psychology of color (Holzschlag, 1999).
  • Dominant red colors evoke feelings of passion, aggression, or danger.
  • Blue symbolizes cleanliness and order or security and trust.
  • Green is often associated with luck or nature.
  • Brown can be used to represent the earth.
  • White symbolizes purity and sterility, but death in many eastern countries.
  • Black can be used to represent death and fear, or power and elegance.
  • Purple represents royalty or spirituality.
  • Yellow can portray hope and optimism or dishonesty and cowardice.
  • Orange can represent energy and balance.