Skip to main content

human-computer-interaction

Principles and practices of human-computer interaction design

Source facts

Repository
ffsshhttiikk/opencode-agents-skills
Last source activity
February 28, 2026 at 22:51
Detected SKILL.md language
English
Stars
3
Forks
2

Install options

The review-first prompt is selected by default. You can switch to a direct command or download a local copy.

Review the source files

Read SKILL.md and any companion files shown by SkillsMP before deciding whether to install.

Showing SKILL.md

SKILL.md
Source instructions · Read-only preview
name
human-computer-interaction
description
Principles and practices of human-computer interaction design
category
interdisciplinary
difficulty
intermediate
tags
["ux","design","research","usability"]
author
OpenCode Community
version
1
last_updated
2024-01-15T00:00:00.000Z
# Human-Computer Interaction ## What I Do I am Human-Computer Interaction (HCI), the multidisciplinary field studying how people interact with computers and designing interfaces that enhance this interaction. I combine principles from computer science, psychology, design, and ergonomics to create user-friendly technologies. I focus on usability, accessibility, and the overall user experience. I employ research methods like user testing, contextual inquiry, and cognitive walkthroughs to understand user needs. I inform interface design through mental models, affordances, and feedback loops. I advocate for users throughout the design process, ensuring technology serves human needs rather than creating friction. ## When to Use Me - Designing user interfaces and interactions - Evaluating existing products for usability issues - Planning user research and testing - Creating accessible applications - Improving workflow efficiency - Designing new products or features - Training UX researchers and designers - Academic research in interaction design - Accessible technology development ## Core Concepts **Usability**: Ease of use measured by effectiveness, efficiency, and satisfaction. **Affordances**: Visual cues suggesting how objects can be used. **Mental Models**: Users' understanding of how systems work. **Feedback**: System responses confirming user actions. **Fitts's Law**: Time to reach target based on distance and size. **Hick's Law**: Decision time increases with number of choices. **Cognitive Load**: Mental effort required to use a system. **Accessibility**: Design for users with diverse abilities. ## Code Examples ### Example 1: Usability Testing Framework ```python #!/usr/bin/env python3 """ Usability Testing Framework """ from dataclasses import dataclass, field from datetime import datetime from typing import List, Dict, Optional from enum import Enum import json class TaskStatus(Enum): PENDING = "pending" IN_PROGRESS = "in_progress" COMPLETED = "completed" ABANDONED = "abandoned" @dataclass class UsabilityTest: test_id: str participant_id: str task_name: str start_time: datetime end_time: Optional[datetime] status: TaskStatus success: bool time_on_task: float errors: List[str] comments: List[str] satisfaction_rating: Optional[int] @dataclass class UsabilitySession: session_id: str participant: Dict tasks: List[UsabilityTest] overall_satisfaction: float completion_rate: float average_task_time: float total_errors: int class UsabilityTestingFramework: def __init__(self): self.sessions: List[UsabilitySession] = [] self.task_definitions: Dict[str, Dict] = {} def add_task_definition(self, task_id: str, definition: Dict): self.task_definitions[task_id] = definition def create_session(self, participant_id: str, demographics: Dict) -> str: session = UsabilitySession( session_id=f"session_{len(self.sessions) + 1}", participant={ 'id': participant_id, 'demographics': demographics, 'created_at': datetime.now().isoformat() }, tasks=[], overall_satisfaction=0, completion_rate=0, average_task_time=0, total_errors=0 ) self.sessions.append(session) return session.session_id def record_task_start(self, session_id: str, task_id: str) -> str: task = UsabilityTest( test_id=f"task_{len(self.sessions[len(self.sessions)-1].tasks) + 1}", participant_id=session_id, task_name=task_id, start_time=datetime.now(), end_time=None, status=TaskStatus.IN_PROGRESS, success=False, time_on_task=0, errors=[], comments=[], satisfaction_rating=None ) self._get_session(session_id).tasks.append(task) return task.test_id def record_task_completion( self, session_id: str, test_id: str, success: bool, errors: List[str] = None, comments: List[str] = None, satisfaction: int = None ): session = self._get_session(session_id) task = self._get_task(session, test_id) task.end_time = datetime.now() task.status = TaskStatus.COMPLETED task.success = success task.time_on_task = (task.end_time - task.start_time).total_seconds() task.errors = errors or [] task.comments = comments or [] task.satisfaction_rating = satisfaction def generate_report(self) -> Dict: if not self.sessions: return {'error': 'No sessions recorded'} total_sessions = len(self.sessions) total_tasks = sum(len(s.tasks) for s in self.sessions) completed_tasks = sum( len([t for t in s.tasks if t.success]) for s in self.sessions ) all_task_times = [ t.time_on_task for s in self.sessions for t in s.tasks if t.status == TaskStatus.COMPLETED ] all_errors = [ len(t.errors) for s in self.sessions for t in s.tasks ] return { 'summary': { 'total_sessions': total_sessions, 'total_tasks': total_tasks, 'completion_rate': (completed_tasks / total_tasks * 100) if total_tasks > 0 else 0, 'average_task_time_seconds': sum(all_task_times) / len(all_task_times) if all_task_times else 0, 'total_errors': sum(all_errors), 'sessions_analyzed': total_sessions }, 'task_breakdown': self._analyze_tasks(), 'error_analysis': self._analyze_errors(), 'recommendations': self._generate_recommendations() } def _analyze_tasks(self) -> Dict: task_analysis = {} for task_def in self.task_definitions: task_times = [] task_successes = [] for session in self.sessions: for task in session.tasks: if task.task_name == task_def: task_times.append(task.time_on_task) task_successes.append(task.success) task_analysis[task_def] = { 'average_time': sum(task_times) / len(task_times) if task_times else 0, 'success_rate': (sum(task_successes) / len(task_successes) * 100) if task_successes else 0, 'completion_count': len(task_successes) } return task_analysis def _analyze_errors(self) -> Dict: error_counts = {} for session in self.sessions: for task in session.tasks: for error in task.errors: error_counts[error] = error_counts.get(error, 0) + 1 return dict(sorted(error_counts.items(), key=lambda x: x[1], reverse=True)) def _generate_recommendations(self) -> List[str]: recommendations = [] report = self.generate_report() if report['summary']['completion_rate'] < 80: recommendations.append("Review task flows for complexity and clarity") if report['summary']['average_task_time'] > 120: recommendations.append("Consider breaking complex tasks into smaller steps") error_analysis = report.get('error_analysis', {}) if error_analysis: top_error = list(error_analysis.keys())[0] if error_analysis else None if top_error: recommendations.append(f"Address most common error: {top_error}") return recommendations # Example Usage framework = UsabilityTestingFramework() framework.add_task_definition("login", { 'description': 'User should be able to log in with valid credentials', 'success_criteria': 'User reaches dashboard within 30 seconds' }) framework.add_task_definition("search_product", { 'description': 'User should find and view a specific product', 'success_criteria': 'User views product details page' }) session_id = framework.create_session( "participant_001", {'age': 25, 'experience': 'intermediate', 'device': 'desktop'} ) test_id = framework.record_task_start(session_id, "login") framework.record_task_completion( session_id, test_id, success=True, errors=[], comments=["Easy to find login button"], satisfaction=4 ) print(json.dumps(framework.generate_report(), indent=2)) ``` ### Example 2: Accessibility Checklist ```python ACCESSIBILITY_CHECKLIST = { "Perceivable": [ { "item": "Alternative text for images", "description": "All meaningful images have alt text", "priority": "critical", "wcag_level": "A" }, { "item": "Captions for multimedia", "description": "Videos have captions and transcripts", "priority": "high", "wcag_level": "A" }, { "item": "Color contrast", "description": "Text has 4.5:1 contrast ratio", "priority": "high", "wcag_level": "AA" }, { "item": "Resize text", "description": "Text scales to 200% without loss of content", "priority": "medium", "wcag_level": "AA" } ], "Operable": [ { "item": "Keyboard accessible", "description": "All functionality available via keyboard", "priority": "critical", "wcag_level": "A" }, { "item": "Focus indicators", "description": "Visible focus indicators on interactive elements", "priority": "high", "wcag_level": "A" }, { "item": "Skip navigation", "description": "Skip links provided for repeated content", "priority": "medium", "wcag_level": "A" }, { "item": "No keyboard traps", "description": "Keyboard focus never gets stuck", "priority": "critical", "wcag_level": "A" }, { "item": "Time limits", "description": "Time limits can be extended or turned off", "priority": "medium", "wcag_level": "A" } ], "Understandable": [ { "item": "Readable content", "description": "Content is readable and understandable", "priority": "high", "wcag_level": "AAA" }, { "item": "Predictable navigation", "description": "Navigation is consistent across pages", "priority": "medium", "wcag_level": "A" }, { "item": "Input assistance", "description": "Form labels and error messages provided", "priority": "high", "wcag_level": "A" } ], "Robust": [ { "item": "Valid HTML", "description": "HTML is well-formed and valid", "priority": "medium", "wcag_level": "A" }, { "item": "ARIA landmarks", "description": "ARIA roles used appropriately", "priority": "medium", "wcag_level": "A" } ] } class AccessibilityAuditor: def __init__(self): self.violations = [] self.warnings = [] self.passed = [] def audit_page(self, page_data: Dict) -> Dict: for category, checks in ACCESSIBILITY_CHECKLIST.items(): for check in checks: result = self._check_element(page_data, check) if result['status'] == 'fail': self.violations.append({ 'category': category, 'item': check['item'], 'message': result['message'], 'priority': check['priority'], 'wcag_level': check['wcag_level'] }) elif result['status'] == 'warning': self.warnings.append(result['message']) else: self.passed.append(check['item']) return { 'violations': self.violations, 'warnings': self.warnings, 'passed': len(self.passed), 'score': self._calculate_score(), 'recommendations': self._generate_recommendations() } def _check_element(self, page_data: Dict, check: Dict) -> Dict: # Simplified check implementation return {'status': 'pass', 'message': 'Check not implemented'} def _calculate_score(self) -> float: total_checks = len(ACCESSIBILITY_CHECKLIST) * len(list(ACCESSIBILITY_CHECKLIST.values())[0]) return len(self.passed) / total_checks * 100 def _generate_recommendations(self) -> List[str]: recommendations = [] critical_violations = [v for v in self.violations if v['priority'] == 'critical'] if critical_violations: recommendations.append(
View on GitHub
This SKILL.md is very large, so SkillsMP previews the first section here. View on GitHub