Human Computer Interaction (HCI) is the study of how people use computers and how to design systems that are easy, efficient and pleasant to use. It sits behind UX design, front-end work and even command-line and dashboard design: a confusing error message, a cluttered Grafana dashboard or a poorly named CLI flag is an HCI problem. This article revisits the five units of the JNTUK course.
Unit 1: Foundations: the human, the computer and the interaction
Why HCI matters
Poorly designed interfaces cause errors, frustration, lost time and, in safety-critical systems, accidents. Good design raises usability, which has several parts:
| Usability goal | Meaning |
|---|---|
| Effectiveness | Can users achieve their goals? |
| Efficiency | How little effort and time do they need? |
| Safety | Does the design prevent harmful errors? |
| Learnability | How easy is it to learn? |
| Memorability | Can users remember how to use it later? |
| Satisfaction | Is it pleasant? |
User experience (UX) is the broader feeling of using a product, and usability is one part of it. Accessibility means designing for users with disabilities: vision, hearing, motor or cognitive.
The human
People are information processors with limits.
| Aspect | Key ideas |
|---|---|
| Perception | Vision (colour, contrast, layout), hearing and touch; Gestalt laws (proximity, similarity, closure) explain how people group items |
| Memory | Sensory, short-term (working) memory holds about 7 ± 2 items, long-term memory is large; recognition is easier than recall |
| Attention | Limited; users scan rather than read |
| Mental models | The picture a user has of how a system works; confusion arises when the design does not match it |
| Errors | Slips (right intention, wrong action) and mistakes (wrong intention) |
Human performance laws: Fitts’s law (time to reach a target depends on its distance and size: bigger, closer buttons are quicker to hit), Hick’s law (decision time grows with the number of choices) and the keystroke-level model for estimating task time.
The computer and the interaction
Input devices (keyboard, mouse, touch, voice, camera, sensors) and output devices (screens, speakers, haptics) set the possibilities. Norman’s model describes interaction as a cycle: form a goal, plan, act, then perceive and interpret the result, with a gulf of execution (how to do it) and a gulf of evaluation (what happened) that good design bridges.
Today: the “7 ± 2” and Hick’s law are why long dropdowns and dashboards with 40 panels fail. Fitts’s law explains why mobile buttons must be large and why destructive actions should not sit next to common ones.
Unit 2: Design principles and guidelines
Norman’s design principles
| Principle | Meaning |
|---|---|
| Visibility | Show what is possible and the current state |
| Feedback | Immediately tell the user what happened |
| Affordance | The design suggests how to use it (a button looks pressable) |
| Mapping | Controls relate naturally to their effects |
| Constraints | Limit actions to prevent errors |
| Consistency | Similar things work in similar ways |
| Conceptual model | A clear idea of how the system works |
Nielsen’s ten usability heuristics
- Visibility of system status: keep users informed.
- Match between system and the real world: use the user’s language.
- User control and freedom: provide undo and an exit.
- Consistency and standards.
- Error prevention.
- Recognition rather than recall: show options instead of making users remember.
- Flexibility and efficiency of use: shortcuts for experts.
- Aesthetic and minimalist design: no unneeded information.
- Help users recognise, diagnose and recover from errors: plain-language messages with a fix.
- Help and documentation.
Other rule sets: Shneiderman’s eight golden rules and the ISO 9241 standards. Design should follow platform guidelines (Material Design, Apple’s Human Interface Guidelines) for familiarity.
Layout, colour and text
Use visual hierarchy (size, weight, spacing), alignment and whitespace; limit colours and never rely on colour alone (about 8% of men have colour-vision deficiency); keep sufficient contrast; write short, clear labels.
Today: an error message such as
Error 0x80070057breaks heuristic 9;Could not save: the disk is full. Free up space and try againfollows it. The same principles make a good CLI (--help, sensible defaults, confirmations before deletion), a good Terraform plan output and a good alert (what broke, how bad, what to do).
Unit 3: The design process
User-centred design
Design starts with the users, not the technology. The iterative cycle:
- Understand users and context: interviews, observation, surveys, personas (typical fictional users) and scenarios.
- Specify requirements: user needs, task lists, usability goals.
- Design alternatives: sketches, storyboards, flow diagrams.
- Prototype them.
- Evaluate with users; repeat.
Task analysis
Hierarchical task analysis (HTA) breaks a goal into subtasks. Use cases, user journeys and user stories describe what users do. Models of the user include GOMS (Goals, Operators, Methods, Selection rules).
Prototyping
| Fidelity | Form | Use |
|---|---|---|
| Low | Paper sketches, wireframes, cardboard | Explore ideas quickly and cheaply |
| Medium | Clickable mock-ups (Figma, Sketch) | Test flows |
| High | Working code, close to the final product | Test details and performance |
Wizard of Oz testing has a human secretly act as the system. Horizontal prototypes show breadth and vertical ones show one feature in depth. Participatory and agile design involve users and developers throughout, and design systems (reusable components, tokens) keep products consistent.
Today: Figma prototypes, design reviews and user interviews are the working method of product teams. A DevOps or platform team that builds internal tools (a deployment portal, a CLI) benefits from the same process: watch real engineers use it before building more.
Unit 4: Evaluation and usability testing
Evaluation checks whether a design meets its usability goals, and it should happen throughout development.
| Method | Who | How |
|---|---|---|
| Heuristic evaluation | Experts | Review against Nielsen’s heuristics |
| Cognitive walkthrough | Experts | Step through a task asking whether a new user would know what to do |
| Usability testing | Real users | Observe them doing tasks; measure time, errors, success rate; think-aloud protocol |
| Questionnaires and interviews | Users | Satisfaction (such as the System Usability Scale, SUS) |
| A/B testing | Live users | Compare two versions on real behaviour |
| Field studies and analytics | Users in context | Observation, logs, heatmaps, session recordings |
Formative evaluation guides design during development; summative evaluation judges the finished product. About five users reveal most usability problems in one round (Nielsen). Measures: task completion rate, time on task, error rate, satisfaction scores and click depth. Findings are ranked by severity.
Ethics
Test participants need informed consent and privacy, and designers must avoid dark patterns (tricks that push users into unwanted actions).
Today: A/B tests on conversion, session replays and analytics funnels are evaluation methods you see every day. For operational tools, “mean time to find the right dashboard” is a usability measure, and on-call alert fatigue is an HCI problem.
Unit 5: Interaction styles and modern interfaces
Interaction styles
| Style | Description | Strengths and weaknesses |
|---|---|---|
| Command line | Typed commands | Powerful, fast for experts, hard to learn |
| Menus | Choose from lists | Easy to learn, slower for experts |
| Form fill-in | Structured data entry | Clear, suited to data |
| WIMP / GUI | Windows, icons, menus, pointer | Direct manipulation, familiar |
| Natural language and voice | Speech or text | Flexible, ambiguity and privacy issues |
| Touch and gesture | Tap, swipe, pinch | Direct, needs large targets |
Direct manipulation (Shneiderman) means visible objects, rapid reversible actions and immediate feedback, like dragging a file into a folder.
Modern topics
- Mobile and responsive design: small screens, touch, context of use; designing “mobile-first”.
- Web and application design: navigation, search, forms, error handling, loading states.
- Information visualisation and dashboards: choose the right chart, avoid clutter, show what matters.
- Multimodal and ubiquitous interfaces: voice assistants, wearables, AR/VR, haptics, IoT.
- Conversational interfaces and AI: chatbots, copilots; issues of transparency, trust and error handling.
- Accessibility: WCAG guidelines (perceivable, operable, understandable, robust), screen readers, captions, keyboard navigation.
- Internationalisation and localisation: language, scripts such as Telugu or Hindi, date and number formats, right-to-left layouts.
- Collaboration (CSCW) and user support: shared documents, chat, help systems, tutorials and onboarding.
Today: the command line is still the dominant interface for DevOps (
kubectl,terraform,aws), a case where speed for experts matters more than learnability, and where good--helptext and consistent flags are the design. Dashboards in Grafana and Datadog apply information visualisation, and AI assistants, voice and chat interfaces are active areas of HCI today.
One-minute recap
| Unit | Key idea | You meet it in |
|---|---|---|
| 1. Foundations | Perception, memory, mental models; Fitts’s and Hick’s laws | Button size, menu length, dashboard overload |
| 2. Design principles | Norman’s principles, Nielsen’s ten heuristics | Error messages, CLI design, alerts |
| 3. Design process | User-centred design, personas, prototypes | Figma, interviews, internal tool design |
| 4. Evaluation | Heuristic review, usability tests, SUS, A/B tests | Analytics, A/B testing, on-call feedback |
| 5. Interaction styles | Command line, GUI, touch, voice, accessibility | kubectl, mobile apps, WCAG, AI assistants |
Next in Engineering Revisited: Middleware Technologies.
Written by Claude, Anthropic’s AI assistant, as part of Engineering Revisited, a quick refresher of the B.Tech subjects one at a time.