SunyoungKim,PhD Todays agenda Who are we? Warm-up exercise - - PowerPoint PPT Presentation

sunyoung kim phd today s agenda
SMART_READER_LITE
LIVE PREVIEW

SunyoungKim,PhD Todays agenda Who are we? Warm-up exercise - - PowerPoint PPT Presentation

Human-Computer Interaction 1. History of HCI SunyoungKim,PhD Todays agenda Who are we? Warm-up exercise What is this course about? Syllabus Evaluation Class policy History of HCI What is HCI?


slide-1
SLIDE 1

Human-Computer Interaction

  • 1. History of HCI

SunyoungKim,PhD

slide-2
SLIDE 2

Today’s agenda

  • Who are we?
  • Warm-up exercise
  • What is this course about?
  • Syllabus
  • Evaluation
  • Class policy
  • History of HCI
  • What is HCI?
slide-3
SLIDE 3

Instructor

Sunyoung Kim

Office: CI 329 Email: sunyoung.kim@rutgers.edu Website: http://www.sunyoung.kim.org

slide-4
SLIDE 4

TA

Souvick Ghosh

Office: CI 303 Email: sg1223@scarletmail.rutgers.edu Office hours: Tuesday 1-2pm

slide-5
SLIDE 5

Warm-up exercise

  • Draw two different doors
slide-6
SLIDE 6

Warm-up exercise

  • Volunteers? Send your drawings to sunyoung.kim@rutgers.edu
slide-7
SLIDE 7

Human-Computer Interaction

slide-8
SLIDE 8

Human-Computer Interaction

  • Information input/output
  • Information stored in memory
  • Information processed and applied
slide-9
SLIDE 9

Human-Computer Interaction

  • Desktop, Laptop, Tablet
  • Smartphone, Smart watch
  • Activity tracker, Wearables
  • Autonomous car, Dron …
slide-10
SLIDE 10

Human-Computer Interaction

slide-11
SLIDE 11

Human-Computer Interaction

slide-12
SLIDE 12

Interaction design cycle

slide-13
SLIDE 13

Syllabus

slide-14
SLIDE 14

Grading

  • 40% Group project
  • 30% Individual project
  • 20% Quizzes
  • 10% Class participation
  • 5% Reading response
  • 5% Attendance, Discussion and In-class activities
slide-15
SLIDE 15

Grading: reading response

  • Due Tuesday midnight, before class
  • Reading is posted on the website
  • Submit a reading response to Canvas discussion board
  • Your reading response should have at least two paragraphs include:

1) a summary of an assigned paper, and 2) your reflection on (opinion about) it.

  • Will be graded
  • 2 = good
  • 1 = partial, especially no reflection
  • 0 = no submission
slide-16
SLIDE 16

Quiz (20%)

  • 4 quizzes
  • Format: a number of short-answer/open-end questions
  • Schedule and points

Date Points Topics 9/29 20 HCI basics & Understanding users/Tasks 10/20 20 UI Design principles 11/10 20 Prototyping and Visual Designs 12/8 20 Evaluating interfaces & All incremental

slide-17
SLIDE 17

Group project (40%)

  • We will design a mobile application to tackle a real-world problem
  • Form a team of 3 students to work for a project throughout the

semester

  • When forming a group, you want to make sure that your group

members have different skillsets (e.g., drawing, writing, programming, etc.)

  • Final outputs of the last year’s group project:

https://www.youtube.com/watch?v=DBXDCtIq_xk&list=PLDtz2OqXKh- Z7G6BI2o6GxhNX9HW8bjkW

slide-18
SLIDE 18

Group project (40%)

  • Schedule and grades

Stage Due ( by midnight) Assignment Weight

9/19 Submit team contact memo check 1 9/22 9/26 Problem statement Problem statement revision (optional) 5% 2-1 10/3 Data collection design 5% 2-2 10/13 Data collection & Analysis (Affinity diagram) 5% 3 10/17 10/24 Ideation and solution proposal Ideation and solution proposal(optional) 5% 4 11/7 11/17 Wireframe, workflow Wireframe, workflow revision (optional) 10% 11/7 Mid peer evaluation 10% 11/14 Critic Feedback 5% 5 11/28 Hi-fi prototype 15% 6 12/5 Evaluation: Heuristic evaluation 5% 7 12/12 Final presentation 15% 8 12/19 Final report & video submission 10%

  • 12/19

Final peer evaluation 10% * Schedules and topics are subject to change.

slide-19
SLIDE 19

https://chi2018.acm.org/authors/student-design-competition/

slide-20
SLIDE 20

CHI 2017 SDC Finalists (https://chi2017.acm.org/assets/chi2017printprogforweb.pdf)

slide-21
SLIDE 21

CHI 2016 SDC Finalists (https://chi2016.acm.org/wp/wp-content/uploads/2016/05/chi2016-program-final-for-web-2.pdf)

slide-22
SLIDE 22

Individual assignment (30%)

  • We will prototype a smartwatch application to tackle a real-world problem
  • Schedule and grades

Stage Due ( by midnight) Assignment Weight

1 9/22 9/26 Problem statement Problem statement revision (optional) 5% 2-1 10/6 Data collection design 10% 2-2 10/20 Data collection & Analysis 10% 3 10/27 11/3 Ideation and solution proposal Ideation and solution proposal(optional) 10% 4 11/14 Wireframe, workflow 20% 5 12/1 Evaluation: Cognitive Walkthrough 10% 6 12/5 12/8 Final presentation 20% 7 12/19 Final report submission 15% * Schedules and topics are subject to change.

slide-23
SLIDE 23

Class policies

  • Be mindful during class time (aka no Facebook, Instagram, twitter,

snapchat, groupme, and so forth during class)

  • Respect and collaborate with your team members
  • All assignments are due by midnight before the class
  • Assignments will not be accepted late
  • Notify three days in advance if you have to miss taking a quiz
  • Cheating (official) will get you an F in the course
slide-24
SLIDE 24

Reaching me

Do not email directly!

  • Use Piazza
  • https://piazza.com/class/j44droli1h7co
  • You can ask/answer questions anonymously
  • If other students will benefit from an answer of your question, ask

publicly on Piazza. If it’s personal, use Piazza private messaging feature

  • Feel free to share your thoughts on other students’ questions
slide-25
SLIDE 25

Class websites

  • Class materials- http://www.sunyoungkim.org/class/hci_f17/
  • Access to slides- ID: rutgers PW: hci
slide-26
SLIDE 26

Questions?

slide-27
SLIDE 27

History of HCI

slide-28
SLIDE 28

ENIAC (1943)

  • The world's first all electronic numerical integrator and computer
  • Military use: calculates artillery-firing tables
  • 1,800 square feet of floor space, weighed 30 tons, consumed 160

kilowatts of electrical power

slide-29
SLIDE 29

Vannever Bush (1945)

  • Identified the information storage and retrieval problem: new

knowledge does not reach the people who could benefit from it

  • A call to action for making knowledge widely available
  • Conceiving Hypertext and the World Wide Web
slide-30
SLIDE 30

J.C.R. Licklider (1960)

  • Foreseen “Man-Computer Symbiosis”
  • Interactive real time system and programming large scale information

storage and retrieval

  • Natural language understanding
  • Facilitation of human cooperation in the design of systems
  • Combined speech recognition, hand-printed character recognition
  • Foreseen Graphical user interface (GUI)
slide-31
SLIDE 31
slide-32
SLIDE 32

Ivan Sutherland (1963)

  • Sketchpad: drawing package introduced many ideas/concepts found in

today’s interfaces

  • Hierarchical structures defined objects and sub-objects
  • Object-oriented programming: master picture with instances
  • Constraints, icons, coordinates, copying, pen input, etc.
  • Clipping & zooming
slide-33
SLIDE 33

Douglas Engelbart (1964)

  • The first mouse

“Develop new techniques, procedures, and systems that will better adapt people’s basic information-handling capabilities to the needs, problems, and progress of society.”

slide-34
SLIDE 34

Xerox Star (1981)

  • First commercial personal computer

designed for business professionals

  • First system based upon usability

engineering

  • WYSIWYG
  • $15,000
slide-35
SLIDE 35

Apple Macintosh (1984)

slide-36
SLIDE 36
slide-37
SLIDE 37

And nowadays…

slide-38
SLIDE 38
slide-39
SLIDE 39
slide-40
SLIDE 40

By Next class

Reading

1. UCID Ch. 1 2. Paper: Design Everyday Things (Ch.1-4) # discussion paper

q Submit two drawings of a door to Canvas by tonight