Skip to content

Human-Computer Interaction

32 hours – Graduate course in Informatics program at PPGIA/PUCPR.

This course introduces Human-Computer Interaction as a field for interdisciplinary research related to Computing. The main concern of this field is the behavior of humans when interacting with the computer and when interacting with other humans through the computer. Issues such as usability, accessibility, communication, design and art are considered in Human Computer Interaction with the assistance from Social Science theory. The practical contribution of this field is a foundation for the analysis and design of user interfaces.

Teaching method: Each class focuses on three to four related topics in HCI. Students are required to read two to three papers to prepare for the class. The class is divided in three moments:

  1. Discussion of the papers;
  2. Lecture about practical implications of the paper topics;
  3. Practical exercises related to the lecture.

Evaluation: Students will be evaluated by their participation in class discussion and exercises (30%) and by an assignment (70%). The assignment consists of creating a new way to interact with the computer inspired or guided by the student research. The interaction should be described by an essay and demonstrated in a video uploaded to Youtube. Examples of demo videos can be found in the History of HCI playlist and in a video tutorial (Portuguese).

Duration: 8 classes with 4 hours each

Syllabus

1 – Human Computer Interaction History

The Three Waves of HCI
Input/Output Devices
Design Fictions

Course textbook

Barbosa, S., & Silva, B. (2010). Interação humano-computador. Elsevier Brasil.

Recommended readings

Bødker, S. (2006, October). When second wave HCI meets third wave challenges. In Proceedings of the 4th Nordic conference on Human-computer interaction: changing roles (pp. 1-8). ACM.

Bødker, S. (2015). Third-wave HCI, 10 years later — participation and sharing. interactions, 22(5), 24-31.

Van Amstel, Frederick M.C.; Gonzatto, Rodrigo F. Projetando interações com vídeo. Minicurso do XVI Simpósio Brasileiro sobre Fatores Humanos em Sistemas Computacionais, 2017.

Playlist with HCI historical videos

Class exercise

Make Lego Serious Play models to tell: What is a computer? What is a human? What is interaction?

Interaction as exchange, humans as societies, and computer as a machine that transforms things

2 – Interaction Design

Art and Technology
Creative Coding
Processing

Required readings

Ehn, P. (2005). Participation in interaction design: Actors and artifacts in interaction. Bagnara S., Crampton Smith J.(eds), Theories and Practices in Interaction Design, Laurence Erlbaum Associates, London.

Van Amstel, F.M.C et al. Creating with Swift: an evaluation of XCode development environment for creative coding (under review).

Slides


Download the Interaction Design lecture [MP3]

Class exercise

Modify and tweak a sketch in openprocessing.org to produce an aesthetics you’d like.

3 – Cognitive Engineering

User Centered Systems Design
User modeling and Adaptive Interfaces
Individual exercise: cognitive analysis of a mobile game

Required readings

Norman, D. A. (1986). Cognitive engineering. Norman, D.A. and Draper, S.W. (eds) User centered system design. CRC Press. p.31-61.

Nielsen, J., & Landauer, T. K. (1993, May). A mathematical model of the finding of usability problems. In Proceedings of the INTERACT’93 and CHI’93 conference on Human factors in computing systems (pp. 206-213). ACM.

Ortigosa, A., Carro, R. M., & Quiroga, J. I. (2014). Predicting user personality by mining social interactions in Facebook. Journal of computer and System Sciences, 80(1), 57-71.

Slides


Download Cognitive Engineering lecture [MP3]

Class exercises

Run an open card sorting experiment with the English version of PUCPR’s website pages. Compare the classification with the existing menu http://en.pucpr.br

Apply the Cognitive Analysis method on the Menor Preço mobile app, specifically, in the search for good prices with the map interface.

Identify Usability Problems in home appliances, write them on a sheet of paper and relate them to the 10 Usability Heuristics of Nielsen

4 – Semiotic Engineering

Conversational Interfaces
Icon Design
Sketching and Idea Generation

Required readings

de Souza, C. S. (1993). The semiotic engineering of user interface languages. International journal of man-Machine Studies, 39(5), 753-773.

Merkle, L. E. (2002). Disciplinary and semiotic relations across human-computer interaction. Unpublished Ph. D. thesis, The University of Western Ontario-Graduate Program in Computer Science, London, Ontario, Canada. p.80-93.

Slides


Download Semiotic Engineering lecture [MP3]

Class exercise

Modeling with clay an icon family for an Internet Banking application. First write down user stories. and testing its meaning through user labels. Sketching animated icons with paper and pencil for an Internet Banking application.

5 – Interaction Design Patterns

Computer Aided Design
Information Visualization

Required readings

Alexander, C. (1981). El modo intemporal de construir. Gustavo Gili, 21-43.

N. Negroponte. (2003) From Soft Architecture Machines. The New Media Reader, N. Wardrip-Fruin and N. Montford (Eds). 354–366.

Gonzatto, R. F., & da Cruz Costa, K. (2011). Arquitetura de Informação sem wireframe. Perspectivas em Gestão & Conhecimento, 1, 160-181.

Slides


Download Interaction Design Patterns lecture [MP3]

Class exercise

Generate a new startup with the startup generator based on the combination of three pattern decks: business model + values + philosophy. Choose 3 persuasive patterns from the Persuasive Patterns deck. Choose all the UI patterns you will need to implement the persuasive strategies and instantiate them in post-its.

6 – Embodied Interaction

Wearable Computing
Assistive Technology
Bodystorming and Photonovel
Group exercise: Prototype an assistive wearable device using cardboard, clay and Lego. The prototype function should be presented in a video.

Required readings

Klemmer, S. R., Hartmann, B., & Takayama, L. (2006, June). How bodies matter: five themes for interaction design. In Proceedings of the 6th conference on Designing Interactive systems (pp. 140-149). ACM.

Mann, S. (1996, February). Wearable, tetherless computer–mediated reality: WearCam as a wearable face–recognizer, and other applications for the disabled. In Presentation at the American Association of Artificial Intelligence, 1996 Symposium. Retrieved January (Vol. 21, p. 2002).

Slides


Download Embodied Interaction lecture [MP3]

Class exercise

Prototype with bodystorming + theater techniques an assistive wearable device using cardboard, EVA, clay or Lego. The prototype function should be presented in a video. The device should assist people with mental disorders such as: Amnesia, Attention Deficit Hyperactivity Disorder, Obsessive–compulsive disorder, Dyslexia, Dyscalculia, Hypochondriasis or Narcolepsy.

7 – Activity Theory

Expansive Design
Ethnographic Study of Work Activities
Computer Supported Cooperative Work

Required readings

Hasu, M., & Engeström, Y. (2000). Measurement in action: an activity-theoretical perspective on producer–user interaction. International journal of human-computer studies, 53(1), 61-89.

Engeström, Y. (2006). Activity theory and expansive design. Bagnara S., Crampton Smith J.(eds), Theories and Practices in Interaction Design, Laurence Erlbaum Associates, London. 3-23.

Kaptelinin, V., & Nardi, B. A. (2006). Interaction Design Informed by Activity Theory. In: Acting with technology: Activity theory and interaction design. MIT press. 73 – 116.

Slides


Download Activity Theory lecture [MP3]

Class exercise

Conducting Expansive Observation in one of the online communities of corais.org. The steps are: 1) identifying the community; 2) identifying key people in the community; 3) identifying operations, actions and activities conducted by these people; 4) analyzing the findings using Activity Theory concepts.

8 – Final work presentations

Final presentation of the course assignment: designed interaction through a performance (video or live).

Sample student project:

THE ZYN from André Armstrong on Vimeo.

Categories: Teaching.

Tags: ,