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

Human-Computer Interaction 1. History of HCI Sunyoung�Kim,�PhD

Today’s agenda Who are we? • Warm-up exercise • What is this course about? • Syllabus • Evaluation • Class policy • History of HCI • What is HCI? •

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

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

Warm-up exercise Draw two different doors •

Warm-up exercise Volunteers? Send your drawings to sunyoung.kim@rutgers.edu •

Human-Computer Interaction

Human-Computer Interaction • Information input/output • Information stored in memory • Information processed and applied

Human-Computer Interaction • Desktop, Laptop, Tablet • Smartphone, Smart watch • Activity tracker, Wearables • Autonomous car, Dron …

Human-Computer Interaction

Human-Computer Interaction

Interaction design cycle

Syllabus

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

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 -

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

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

Group project (40%) Schedule and grades • Stage Due ( by midnight) Assignment Weight 0 9/19 Submit team contact memo check 1 9/22 Problem statement 5% 9/26 Problem statement revision (optional) 2-1 10/3 Data collection design 5% 2-2 10/13 Data collection & Analysis (Affinity diagram) 5% 3 10/17 Ideation and solution proposal 5% 10/24 Ideation and solution proposal(optional) 4 11/7 Wireframe, workflow 10% 11/17 Wireframe, workflow revision (optional) 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.

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

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

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

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

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 •

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 -

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

Questions?

History of HCI

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

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 •

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) •

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 •

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.”

Xerox Star (1981) First commercial personal computer • designed for business professionals First system based upon usability • engineering WYSIWYG • $15,000 •

Apple Macintosh (1984)

And nowadays…

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