JCL

FEUP/DEI & INESC TEC

User Tools

Site Tools


teach:lbaw:lectures:02

L: 22/02/2021

Master in Informatics and Computing Engineering
Database and Web Applications Laboratory
Instance: 2020/21


Lecture #2 (part 1) :: 17/02/2021

Goals

By the end of this class, the student should be able to:

  • Understand the concept of User-Centered Design in Interaction Design.
  • Describe each stage of Interaction Design Process.
  • Understand how and when to use Design Patterns.
  • Learn best practices in Interaction Design.

Content

  • What is Interaction Design?
  • Interaction Design Process
  • User Centred Design
  • IxD, UX and UI
  • Interaction Design Dimensions
  • Mental Models
  • Interaction Design Principles
  • User Interface Elements
  • Design Patterns
  • What do Interaction Designers Do?
  • Wireflows

Bibliography

  • Dix, A., Finlay, J., Abowd, G. D., & Beale, R. (2004). Human–Computer Interaction, Third Edition. Pearson.
  • Cooper, A., Reimann, R., Cronin, D., & Cooper, A. (2007). About face 3: The essentials of interaction design. Indianapolis, In: Wiley Pub.
  • Preece, J., Rogers, Y., & Sharp, H. (2015). Interaction Design: Beyond Human-Computer Interaction, Fourth edition. John Wiley & Sons, Ltd.
  • Kalbach, J. (2007). Designing Web Navigation. Sebastopol, CA: O’Reilly Media, Inc.
  • Saffer, D. (2010). Designing for Interaction — Creating Innovative Applications and Devices. Berkeley, CA: New Riders.
  • Morville, P., Rosenfeld, L., Arango, J. (2015). Information Architecture: For the Web and Beyond, 4th Edition, O'Reilly Media.
  • Moggridge, B., & Atkinson, B. (2007). Designing interactions. Cambridge, Massachusetts: MIT Press.
  • Tidwell, J. (2005). Designing Interfaces, Second Edition, O'Reilly Media.

Materials

Lecture #2 (part 2) :: 24/02/2021

Goals

By the end of this class, the student should be able to:

  • Understand the fundamentals of visual design and the intrinsic complexities of designing interactive systems.
  • Understand the impact of visual design on usability and readability.
  • Identify common mistakes and pitfalls of visual design, specifically on the web.

Content

  • The importance of visual communication on the Web
  • Impact of the visual communication on usability and legibility
  • Introduction to elements of visual communication
    • Typography
    • Color
  • Introduction to principles of visual communication
    • Proximity
    • Similarity
    • Continuity
    • Closure
    • Visual Flow
    • Constrast
    • Hierarchy

Bibliography

  • Lupton, E., & Phillips, J. C. (2008). Graphic Design The New Basics (Second Edi). New York: Princeton Architectural
  • Lupton, E. (2014). Type on screen. (Ellen Lupton, Ed.). A Design Handbook.
  • Maria, J. S. (2014). On Web Typography. New York: A Book Apart.
  • Samara, T. (2007). Design Elements: A Graphic Style Manual. Rockport Publishers, Inc.
  • Sherin, A. (2012). Design Elements: Color Fundamentals. Rockport Publishers.
  • Stein, B. (2017). Webfont Handbook. New York: A Book Apart.
  • White, A. (2011). The Elements of Graphic Design (Second Edi). New York: Allworth Press.

Materials

Summary

  • An introduction to Interaction Design, by Andreia Pinto de Sousa. Principles, Patterns, and Usability.
  • Introduction to the elements and principles of Visual Communication Design, by Andreia Pinto de Sousa.

LBAW, 2020/21

« Previous | Index | Next »

teach/lbaw/lectures/02.txt · Last modified: 24/02/2021 18:31 by Sérgio Nunes