Interaction design (IxD)

  • “The practice of designing interactive digital products, environments, systems, and services to support user interactions and behaviors”.
  • Some objectives:
    • Greater productivity and avoiding errors (traditional theories in human-computer interaction (HCI), human factors and ergonomics)
    • Better collaboration (sociotechnical system design, computer supported cooperative work (CSCW))
    • Better “feel” and aesthetic appeal (user experience (UX))
    • Better accessibility
  • Great use of design and aesthetic principles to help users interact well. For example, designers usually pay attention to elements of visual aesthetics:
    • size of components;
    • colors;
    • spacing and alignment;
    • typography;
    • layout
  • Lots of details, courses and reference can be found at the Interaction Design Foundation](https://www.interaction-design.org/)

The IxD typical process

  • Ideation and user research: understand the idea, its target users (for example: creating personas), etc.
  • Sketching: drawing rough, low-fidelity sketches by hand to visualize layout, content placement, and basic interactions. Usually pen and paper!
  • Wireframing: more detailed and structured approach - typically created using digital tools and represent a higher fidelity than sketches. They outline the placement of elements such as navigation, content areas, and interactive components without focusing on visual design details like colors and fonts
    • One of the most useful tools today is Figma
  • Prototyping: creating a functional, interactive representation of a design concept, be it low-fidelity (simple click-through prototypes) to high-fidelity (closely resembling the final product in terms of design and functionality)
  • Usability tests: involve participants interacting with a prototype while we collect data in order to identify any usability problems, understand the experience better and explore alternatives.
    • Some types of tests:
      • Surveys, questionnaires and interviews
      • Comparisons, A/B Tests
      • Think-Aloud Protocol
      • Task-Based Testing
      • Cognitive Walkthrough
      • Tracking (eye, mouse, emotions, etc)
      • Heuristic Evaluation
      • Information Sorting (cards, trees)
      • First-Click Test
      • Benchmarking
      • Ethnography and field study
    • See, for example, some demonstrations here.
  • UI and UX Patterns: it is also good to have a repertoire of well-known solutions to interaction problems - these are called UI patterns.