Human/Computer Interaction & Interaction Design Methodologies: Goal Driven Design, Usability, The Five Dimensions, Cognitive Psychology, and Human Interface Guidelines
- standups
- Methods of human/computer interaction could include GUI, Terminal, or using the eyes in the case of a disability
- Intersection of computer science, behavioral science, media studies, physchology, cognitive science
-
The loop of interaction has several aspects to it including:
- Visual Based :The visual based human computer interaction is probably the most widespread area in Human Computer Interaction (HCI) research.
- Audio Based : The audio based interaction between a computer and a human is another important area of in HCI systems. This area deals with information acquired by different audio signals.
- Task environment: The conditions and goals set upon the user.
- Machine environment: The environment that the computer is connected to, e.g. a laptop in a college student's dorm room.
- Areas of the interface: Non-overlapping areas involve processes of the human and computer not pertaining to their interaction. Meanwhile, the overlapping areas only concern themselves with the processes pertaining to their interaction.
- Input flow: The flow of information that begins in the task environment, when the user has some task that requires using their computer.
- Output: The flow of information that originates in the machine environment.
- Feedback: Loops through the interface that evaluate, moderate, and confirm processes as they pass from the human through the interface to the computer and back.
- Fit: This is the match between the computer design, the user and the task to optimize the human resources needed to accomplish the task.
-
Methodologies:
- Based on user activity it should be more streamlined
- User focused design. Who is the user? Diversity and inclusion should be considered. Accessibility issues should be considered (example: contrast checker).
- Consistency
- Structure - one input simple
- How do we get feedback from the user? Is the form easy to find?
-
Thirteen Principles Of Design:
- Christopher Wickens et al. defined 13 principles of display design in their book An Introduction to Human Factors Engineering.[19]
- These principles of human perception and information processing can be utilized to create an effective display design. A reduction in errors, a reduction in required training time, an increase in efficiency, and an increase in user satisfaction are a few of the many potential benefits that can be achieved through utilization of these principles.
- Certain principles may not be applicable to different displays or situations. Some principles may seem to be conflicting, and there is no simple solution to say that one principle is more important than another. The principles may be tailored to a specific design or situation. Striking a functional balance among the principles is critical for an effective design.[20]
-
Perceptual principles:
- Make displays legible (or audible). A display's legibility is critical and necessary for designing a usable display. If the characters or objects being displayed cannot be discernible, then the operator cannot effectively make use of them.
- 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). These sensory variables can contain many possible levels.
- Top-down processing. Signals are likely perceived and interpreted in accordance with what is expected based on a user's experience. 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.
- Redundancy gain. If a signal is presented more than once, it is more likely that it will be understood correctly. This can be done by presenting the signal in alternative physical forms (e.g. color and shape, voice and print, etc.), as redundancy does not imply repetition. A traffic light is a good example of redundancy, as color and position are redundant.
- Similarity causes confusion: Use distinguishable elements. Signals that appear to be similar will likely be confused. 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. Unnecessarily similar features should be removed and dissimilar features should be highlighted.
-
Mental model principles:
- Principle of pictorial realism. A display should look like the variable that it represents (e.g. high temperature on a thermometer shown as a higher vertical level). If there are multiple elements, they can be configured in a manner that looks like it would in the represented environment.
- Principle of the moving part. Moving elements should move in a pattern and direction compatible with the user's mental model of how it actually moves in the system. For example, the moving element on an altimeter should move upward with increasing altitude. Principles based on attention
- Minimizing information access cost or interaction cost. When the user's attention is diverted from one location to another to access necessary information, there is an associated cost in time or effort. A display design should minimize this cost by allowing for frequently accessed sources to be located at the nearest possible position. However, adequate legibility should not be sacrificed to reduce this cost.
- Proximity compatibility principle. Divided attention between two information sources may be necessary for the completion of one task. These sources must be mentally integrated and are defined to have close mental proximity. Information access costs should be low, which can be achieved in many ways (e.g. proximity, linkage by common colours, patterns, shapes, etc.). However, close display proximity can be harmful by causing too much clutter.
- Principle of multiple resources. 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.
-
Memory principles:
- Replace memory with visual information: knowledge in the world. A user should not need to retain important information solely in working memory or retrieve it from long-term memory. A menu, checklist, or another display can aid the user by easing the use of their memory. However, the use of memory may sometimes benefit the user by eliminating the need to reference some type of knowledge in the world (e.g., an expert computer operator would rather use direct commands from memory than refer to a manual). The use of knowledge in a user's head and knowledge in the world must be balanced for an effective design.
- Principle of predictive aiding. Proactive actions are usually more effective than reactive actions. A display should attempt to eliminate resource-demanding cognitive tasks and replace them with simpler perceptual tasks to reduce the use of the user's mental resources. This will allow the user to focus on current conditions, and to consider possible future conditions. An example of a predictive aid is a road sign displaying the distance to a certain destination.
- Principle of consistency. Old habits from other displays will easily transfer to support processing of new displays if they are designed consistently. A user's long-term memory will trigger actions that are expected to be appropriate. A design must accept this fact and utilize consistency among different displays.
-
Helpful links:
-
Homework:
- Apply concepts of UX design and user focused coding to capstones and zombie site. Who are the users?
- Color contrast ratio is the numerical value assigned to the difference in light between the foreground and the background
- Is the perceived visual weight (the amount that colors stand out). An example is sans serif vs. serif fonts.
- We don't want our users to think. Make it easy for them. Elements, contents, and interactions shouldn't require much thinking.
- Patterns including, header, footer, sidebar, and navigation bar. Web elements are the core framework of your website and they should be kept in the same place to ensure a consistent user experience. Usability of your website should be logical and this can be accomplished with consistency.
- Different paragraph font (Creepster, etc.) to promote consistency
- Move cards to the top under title (Featured items on top) to promote balance
- Move toothy zombie to the bottom and possibly float it to the left so the text is on the right to promote balance
- Work with color contrast
- Implement four suggestions in the zombie app
-
Empathize with your users:
- users don't like to wait
- an example is the Uber app. How much more difficult is it to use the uber app than other apps?
- put yourself in their shoes
-
Define your users' needs, their problem, and your insights
-
Ideate by challenging assumptions and creating ideas for innovative solutions
-
Prototype to start creating solutions:
- some start building
- some do mock ups using tools like draw.io
- MVP means minimal viable product. Solve business problems, developer problems, and user problems. Do this while taking the shortest amount of time. Do what makes the most financial sense.
-
Test solutions:
- does it solve the problem?
- does it work?
- Apply the five principles of Design Thinking to the zombie app. What do your users want? What does the "business" want? lets try to solve those.
-
Standups
-
What is a chron job?:
- service set up with a timer
- if an event happens launches javascript
- wgit from website
- set up a service that goes out and does something on the computer or the web
- schedule a service to run that runs a script
- basic trick. write a script to run code to do a certain thing at an alloted amount of time
- words
- visual presentation
- physical objects or space
- time
- behavior
-
Words covers the direct communication with users. This happens by conveying useful information that should be clear and concise.
-
Visual presentation includes UI elements such as images, typography, and icons, etc. These supplement what is communicated with words.
-
Physical objects or space usually means the actual device or environment that users interact with. This could be a smartphone or laptop, and the environment can vary depending on where the user is.
-
Time is a dimension that used to measure how long the users spent interacting with the interface through words and animation, or any progress they made through their interaction.
-
Behavior refers to the ways in which users respond to a product, based on the previous four dimensions. Studying users' different reactions enables programmers to create better interactions for them.
-
Resources: