HCI Track-A User-Interfaces:Devices Week36

Input and Output Devices in Human-Computer Interaction

Welcome to the second week of our Human-Computer Interaction (HCI) course. Today, we’ll delve into the practical aspects of human interaction, focusing on input and output devices. By the end of this lecture, you should understand:

• Input devices in terms of absolute and relative input, position, and rate control.
• How to classify input devices.
• An overview of display technologies and other output technologies.

---

Introduction to Input and Output Devices

Input and output devices form the bridge between humans and computers. They are essential for:

• Modifying the contents of a computer system (input).
• Conveying the state of the computer to the user (output).

---

Input Devices

According to Bill Buxton, an input device is a transducer from the physical properties of the world to the logical parameters of a computer system.

Common Input Devices

• Keyboards and Keypads: Traditional text entry devices.
• Pointing Devices: Manipulate and select objects in a graphical display.
• Physical Controls: Buttons, knobs, and sliders for specific functions.
• Contactless Input: Voice interaction, facial expressions, and gestures.

Examples and Key Points

Historical Evolution of Input Devices

• Light Pens (1960s): Early direct interaction devices used on screens.

• Computer Mouse (1964)

  Invented by Douglas Engelbart.

  • Introduced during “The Mother of All Demos” in the 1970s.
  • Demonstrated alongside keyboards, graphical interfaces, networking, and touchscreens.

• Keyboards (1970s): Became standard input devices, derived from typewriters.

• Digital Joysticks (1977): First introduced by Atari for gaming.

• Touchpads (1990s): Common in laptops for cursor control.

• Smartphones (2007 onwards): Touchscreens became ubiquitous.

• Voice Input (2010s): Emergence of Siri, Google Assistant, and others.

• Eye Tracking and Neural Interfaces (Recent): Technologies like Tobii Eye Tracking and Neuralink.

Keyboards and Text Entry

• QWERTY Layout:
  • Most common keyboard layout.
  • Myth: Designed to prevent typewriter jams by spacing out common letters.
  • Reality: A practical and efficient layout for typing.
• Dvorak Layout:
  • Designed for efficiency by placing common letters on the home row.
  • Myth: Significantly increases typing speed.
  • Reality: With training, typists can be equally efficient on both layouts.
• Projected Keyboards:
  • Advantages: Portability and space-saving.
  • Disadvantages: Lack of tactile feedback; no proprioceptive cues.
  • Example: Virtual keyboards on smartphones—while ubiquitous, they lack the tactile feel of physical keys.
• Split and Chorded Keyboards:
  • Split Keyboards: Ergonomic but lack standardization.
  • Twiddler (Chorded Keyboard):
    • Portable and wearable.
    • Requires memorizing combinations of key presses.
    • Challenge: Difficult to learn and retain proficiency.

Pointing Devices

• Mouse:
  • Invented by Douglas Engelbart.
  • A relative pointing device—movement translates to cursor movement on the screen.
  • Components: Buttons for clicking, scroll wheel for navigation.
• Touchpad:
  • Found on laptops.
  • Supports gestures like two-finger scrolling.
  • Relative vs. Absolute:
    • Typically relative, but can function as absolute if mapped directly to the screen.
• Light Pen:
  • Early direct pointing device.
  • Absolute control by pointing directly at screen elements.
  • Connected via a cord; not wireless.
• Touchscreen:
  • Absolute pointing device.
  • Types:
    • Resistive Touchscreens:
      • Two layers that detect touch when pressed together.
      • Advantages: Cost-effective, accurate.
      • Disadvantages: Limited to single touch.
    • Capacitive Touchscreens:
      • Detect touch via the conductive properties of the human finger.
      • Advantages: Supports multitouch (pinch, zoom).
      • Disadvantages: Requires conductive touch (cannot use with regular gloves).
    • Optical Sensing Touchscreens:
      • Use cameras to detect touch and gestures.
      • Used in large tabletop displays.

---

Hard Controls vs. Soft Controls

Hard Controls (Physical Controls)

• Provide tactile feedback.
• Users can operate them without visual attention.
• Examples:
  • Traditional car dashboards with physical buttons and knobs.
  • Flight simulators with physical joysticks and throttles (HOTAS systems).

Soft Controls (Software-Based Controls)

• Displayed on screens; can be reconfigured via software updates.
• Advantages:
  • Flexibility and customization.
  • Easier to update and add new features.
• Disadvantages:
  • Lack of tactile feedback.
  • May require visual attention to operate.
• Examples:
  • Modern car interfaces like Tesla’s touchscreen dashboard.

Discussion Points

• Trade-offs:
  • Safety: Physical controls are preferred for critical functions (e.g., steering, braking).
  • Usability: Soft controls offer versatility but may distract the user.
• Immersion and Realism:
  • Physical controls enhance user experience in simulations and gaming.
  • Example: Flight simulators using physical flight sticks and throttles provide more precision and realism.

---

Detailed Analysis of Input Devices

Physical Properties

• Linear Input: Moving devices along an axis (e.g., mouse movement).
• Rotary Input: Rotating devices (e.g., volume knobs, scroll wheels).

Control Types

• Position Control:
  • Absolute: Direct mapping to a position (e.g., touchscreens).
  • Relative: Movement relative to the starting point (e.g., mouse).
• Force Control:
  • Isometric Controllers: Do not move but sense the force applied (e.g., ThinkPad’s pointing stick, F-16 joystick).
  • Isotonic Controllers: Move freely; position corresponds to input (e.g., standard joystick).
  • Elastic Controllers: Return to a neutral position when released (e.g., game controllers).

Degrees of Freedom (DoF)

• 1 DoF: Single-axis controls (e.g., volume sliders).
• 2 DoF: Two-dimensional controls (e.g., mouse, touchpad).
• 3 DoF: Adds depth or rotation.
• 6 DoF: Position and orientation in 3D space (e.g., Wii controller).

Order of Control

• Zero-Order Control: Input directly controls position.
  • Example: Mouse movement translates to cursor position.
• First-Order Control: Input controls velocity (rate of change).
  • Example: Controlling the speed of a tank turret in “Gunner Heat PC” game.
    • Movement speed is controlled rather than direct position.

---

Comparing Pointing Devices

• Touchscreens:
  • Advantages: Fast, direct interaction.
  • Disadvantages: Less accurate due to finger size and lack of precision.
• Mouse:
  • Advantages: High speed and accuracy.
  • Disadvantages: Requires a surface; may not be as portable.
• Joysticks:
  • Advantages: Good for rate control tasks (e.g., flight simulators).
  • Disadvantages: Less precise for direct pointing tasks.

Control-Display Gain

• Definition: Ratio of cursor movement on screen to physical movement of the input device.

• Adaptive Gain:
  • Increases with faster movements for quick navigation.
  • Decreases with slower movements for precision tasks.
• Mouse Acceleration: An example of adaptive control-display gain.

Semantic Pointing

• Adjusting control-display gain based on the importance of screen elements.
• Example: Making the “Save” button easier to click than the “Don’t Save” button to prevent accidental data loss.

Clutching

• Necessary when physical input space is limited.
• Involves lifting and repositioning the input device without affecting cursor position.

---

Output Devices

Visual Displays

• Pixel-Based Displays:
  • CRT (Cathode Ray Tube):
    • Early display technology using electron beams.
    • Introduced in the 1950s.
  • LCD and OLED:
    • Modern displays with improved resolution and color depth.
• Display Parameters:
  • Screen Size: Measured diagonally.
  • Aspect Ratio: Ratio of width to height (e.g., 16:9).
  • Resolution: Number of pixels (e.g., 1920x1080).
  • Refresh Rate: Frequency of screen updates (measured in Hz).
  • Color Depth: Typically 24-bit color, allowing for 16.8 million colors.
  • Pixel Density: Pixels per inch (PPI); higher density for sharper images.

Anti-Aliasing

• Technique to smooth out jagged edges in digital images.
• Function: Adjusts pixel colors based on the proportion of the pixel covered by the edge.

Virtual Reality (VR) and Augmented Reality (AR)

Virtual Reality

• Head-Mounted Displays (HMDs):

  • Provide immersive environments by displaying separate images to each eye.
  • Refresh Rate: At least 90Hz needed to prevent motion sickness.

• Tracking Methods :

  • Inside-Out Tracking: Sensors on the headset track movement.
  • Outside-In Tracking: External cameras track the headset.

Augmented Reality

• Optical See-Through Displays:

  • Real-world view with overlaid digital information (e.g., HoloLens 2).

• Camera-Based AR:

  • Uses cameras to capture the environment and display it with digital overlays (e.g., Apple Vision Pro).

• Trade-offs :

  • Optical See-Through:

    • No latency but limited brightness and contrast of digital elements.

  • Camera-Based AR:

    • Better integration of digital content but may introduce latency.

---

Combining Input and Output: Practical Applications

Human-Centered AI Tools

• Importance of incorporating user interaction in AI systems.

• Human Concerns in AI:

  • Fairness: Avoiding biases in AI decisions.
  • Accountability: Ability to appeal or understand AI decisions.
  • Transparency: Clear understanding of how AI processes information.
  • Ethics: Aligning AI actions with human values.

Don Norman’s Gulfs

• Gulf of Execution: Difficulty in performing desired actions.
• Gulf of Evaluation: Difficulty in interpreting system output.
• Goal: Minimize both gulfs to improve user experience.

Example: TimeFork

• Purpose: AI tool for stock market prediction.

• Functionality:

  • Users input their predictions (e.g., expecting Netflix stock to rise).
  • The system predicts how other stocks might react.

• Benefits:

  • Interactive dialogue between the user and AI.

• Helps users understand and visualize potential market outcomes.

---

Assignments and Reminders

• Assignment 1:

  • Due Date: September 13th.

  • Task: Recreate a chat application interface using HTML and CSS.

  • Guidelines:

    • Timebox your effort.
    • Focus on understanding the complexity of creating UI elements.

• Assignment 2:

  • Release Date: Coming soon.
  • Task: Interact with a “wolf talk back” system to prepare for group projects.

• No TA Sessions This Week:

  • Utilize study cafes for assistance.

• Upcoming Classes:

  • Track B continues with JavaScript focus on Thursday.

---

Conclusion

Understanding the nuances of input and output devices is crucial in HCI. As technology evolves, the interaction between humans and computers becomes more sophisticated, necessitating a deeper comprehension of both hardware and software aspects. Remember to consider both the practical and theoretical implications when designing or using these devices.