Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
The Overview of HCI Human-Computer Interaction       วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร                ...
ชื่อวิชา การปฏิสัมพันธระหวางมนุษยกับคอมพิวเตอรรหัสวิชา INT2104จํานวนหนวยกิต 3(3-0-6) (หองเรียน – ปฏิบติ – คนควาดว...
1   2
Midterm examination                                             30   pointsFinal Examination                              ...
Motivation Quiz 1จงยกตัวอยางอุปกรณเชื่อมตอประสานระหวางมนุษยและคอมพิวเตอรทรจก                              ี่ ู ัมาค...
Motivation Quiz 2อะไรคือความแตกตางระหวางการใชงานอุปกรณทั้งสองกลุมนี้ ?
OverviewWhat is HCI ? ความหมายของปฏิสัมพันธระหวางมนุษยและคอมพิวเตอร (HCI) ไดถูกนิยามไวโดย Association for Computing,...
HCI versus UI จากนิยมจะพบวา HCI และ UI มีความใกลเคียงกัน แต สิ่งที่แตกตางกันคือ -UI จะมุงเนนในการออกแบบใหระบบคอมพิว...
OverviewInput Device เปลียนจากmouse & keyboard     ่ Gesture Movement Multitouch Speech Intelligent Context awareness Mobi...
OverviewGesture          วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร                                            ...
OverviewCity Wall: Multi-touch           วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร                            ...
OverviewMicrosoft Surface           วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร                                 ...
OverviewOutput Device Small to disappearing screen ◦ Intelligent ”Context awareness” ◦ Speech ◦ Virtual 2D, 3D Large publi...
Overviewวิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร                                         ั
OverviewAdobe Interactive Wall           วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร                            ...
OverviewThe Sixth Sense Project                                                                   PLAYAER           วิชา I...
OverviewInteresting Technology RFID Accelerometer Proximity sensor Physiological sensors: Temp, EKG, EMG, etc. Environment...
OverviewResearch Topics Wearable computing Technology of future mobile, PDA, TV etc. User interaction การติดตอระหวางคนกั...
Week 1: What is HCI ?Outlines ความเปนมาของ HCI เปาหมายของ HCI แผนภาพของ HCI หลักการที่ทําใหได HCI ที่ดี ความทาทายของ ...
วิชานี้ไดกําเนิดมาในวงการคอมพิวเตอร 10 กวาปหรือ 20 ปตนๆสมัยกอนจะมีสอนในสาขาวิทยาศาสตรคอมพิวเตอร ระดับสูงๆ ตั้งแต...
เปาหมายของ HCI คือการสรางระบบที่สามารถใชงานได, มีความปลอดภัย และสามารถใชงานไดจริง ซึ่งสามารสรุปเปาหมายออกเปนหัวขอ...
System ระบบ มีความหมายที่ครอบคลุมไมไดมีเพียงแคฮารดแวร หรือ ซอฟตแวร แตหมายถึงสภาพแวดลอมทั้งหมดที่ใช หรือถูก กระทบ...
Effectiveness and Efficiency การปรับปรุงประสิทธิผล และประสิทธิภาพ คือการมุงเนนให ระบบที่พัฒนาขึ้นมีผลการทํางานที่ดี มีค...
Safety ความปลอดภัย คือการมุงเนนในเรื่องการออกแบบใหระบบที่ พัฒนามีความปลอดภัยทั้งกับบุคคล และองคกรที่ใชงานระบบ        ...
Utility ความมีประโยชน คือการสรางระบบใหสามารใชงานไดจริงของ ระบบที่ไดพัฒนาขึ้น                  วิชา INT2104 การปฏิสัม...
Usability การใชงานได คือแนวคิดที่เกี่ยวกับการทําระบบใหงายตอการ เรียนรู และงายตอการใชงานระบบคอมพิวเตอรไมกอความ ...
ขั้นตอนทีจะนําไปสูเปาหมายของ HCI         ่  ประกอบไปดวย 3 ขันตอนดังนี้                     ้  Understand คือมีความเขาใ...
แผนภาพของ HCI
แผนภาพของ HCI องคประกอบของ HCI แบงออกเปนสี่สวน แสดงดังรูป U1: กลุมระบบคอมพิวเตอรที่ใชงานในกลุมสังคมที่ทํางาน รวมก...
แผนภาพของ HCI H1: กระบวนการรับรู และวิเคราะหของมนุษย H2: ภาษา การสื่อสาร และปฏิสัมพันธ H3: ลักษณะการทํางานทางกายภาพของ...
แผนภาพของ HCI C1: อุปกรณนําเขา และแสดงผลเปนตัวเชื่อมมนุษยและ คอมพิวเตอร C2: เทคนิคที่ใชในขั้นตอนการโตตอบระหวางใชง...
แผนภาพของ HCI D1:   การออกแบบสําหรับการโตตอบ D2:   เทคนิคและเครื่องมือสําหรับใชพฒนาใหเกิดผล                            ...
HCI Specialists should  understand factors (influence)on how people operate and make   use of computer technology)
HCI Specialists then developtools and techniques to help designers
Computer system helps users to achieve efficient, effective  and safe interactions both     individual and group.
แผนภาพของ HCI Use and Context of Computer          การใชงาน และ บริบทของคอมพิวเตอรเพื่อใหมีความลงตัวในการใชงาน Human C...
หลักการทีทําใหแนใจถึง HCI ทีดี         ่                    ่  หลักการทีทําใหแนใจถึง HCI ที่ดีคือ Visibility และ      ...
ความทาทายทางดาน HCI ปจจัยที่ทาทายงานวิจัยทางดาน HCI นั้นมีอยู 2            ปจจัยดังนี้ ทําอยางไร จึงจะสามารถเก็บเก...
เอกสารอางอิง
Upcoming SlideShare
Loading in …5
×

345635

501 views

Published on

  • Be the first to comment

  • Be the first to like this

345635

  1. 1. The Overview of HCI Human-Computer Interaction วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร ั
  2. 2. ชื่อวิชา การปฏิสัมพันธระหวางมนุษยกับคอมพิวเตอรรหัสวิชา INT2104จํานวนหนวยกิต 3(3-0-6) (หองเรียน – ปฏิบติ – คนควาดวยตนเอง) ัเวลาและสถานที่เรียน วันเสารเวลา 14.00 – 17.00 หอง 6203 วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร ั
  3. 3. 1 2
  4. 4. Midterm examination 30 pointsFinal Examination 40 pointsGroup Assignment 25 pointsClass & Activities Attendance 5 points Total 100 วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร ั
  5. 5. Motivation Quiz 1จงยกตัวอยางอุปกรณเชื่อมตอประสานระหวางมนุษยและคอมพิวเตอรทรจก ี่ ู ัมาคนละ 10ชนิด วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร ั
  6. 6. Motivation Quiz 2อะไรคือความแตกตางระหวางการใชงานอุปกรณทั้งสองกลุมนี้ ?
  7. 7. OverviewWhat is HCI ? ความหมายของปฏิสัมพันธระหวางมนุษยและคอมพิวเตอร (HCI) ไดถูกนิยามไวโดย Association for Computing, Special Interest Group of Computer- Human Interaction (ACM SIGCHI) วา “แนวทางที่เกี่ยวกับการออกแบบ ประเมินผล และนําไปพัฒนาของ นา ระบบคอมพิวเตอรที่มีการโตตอบเพื่อใหมนุษยใชงาน และแนวทางที่ เกี่ยวของกับการศึกษาธรรมชาติของสิ่งที่ปรากฏอยูลอมรอบ ระบบ” ระบบ วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร ั
  8. 8. HCI versus UI จากนิยมจะพบวา HCI และ UI มีความใกลเคียงกัน แต สิ่งที่แตกตางกันคือ -UI จะมุงเนนในการออกแบบใหระบบคอมพิวเตอรนนนาใช และ ั้ เปนทีนาพอใจ ่ -HCI จะเกี่ยวของกับการการทําอยางไรใหคอมพิวเตอร เขามา ชวยเหลือใหชวิตมนุษยมีความสะดวกสบายขึ้น ี ดังนัน HCI จะมีกรอบการทํางานทีกวางกวา UI ในแงของการ ้ ่ พัฒนาแนวทางใหมๆในทุกดานเพื่อใหคอมพิวเตอรมาชวยงานมนุษย สวน UI จะมุงเนนรายละเอียดในวิธีที่เลือกแลวใหอยูในจุดที่ดีที่สุด เชน สี, ขนาดตัวอักษร, ...
  9. 9. OverviewInput Device เปลียนจากmouse & keyboard ่ Gesture Movement Multitouch Speech Intelligent Context awareness Mobile Phone Thai Input Other new methods of interaction วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร ั
  10. 10. OverviewGesture วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร ั
  11. 11. OverviewCity Wall: Multi-touch วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร ั
  12. 12. OverviewMicrosoft Surface วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร ั
  13. 13. OverviewOutput Device Small to disappearing screen ◦ Intelligent ”Context awareness” ◦ Speech ◦ Virtual 2D, 3D Large public screen ◦ Intelligent ”Context awareness” ◦ Privacy and Public information วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร ั
  14. 14. Overviewวิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร ั
  15. 15. OverviewAdobe Interactive Wall วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร ั
  16. 16. OverviewThe Sixth Sense Project PLAYAER วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร ั
  17. 17. OverviewInteresting Technology RFID Accelerometer Proximity sensor Physiological sensors: Temp, EKG, EMG, etc. Environment sensors: GPS, Light, Sound, etc. Webcam Projector Touch screen Others such as Bluetooth, วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร ั
  18. 18. OverviewResearch Topics Wearable computing Technology of future mobile, PDA, TV etc. User interaction การติดตอระหวางคนกับคอมพิวเตอร Mobile applications Smart environments Thai input method for mobile phone Smart website วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร ั
  19. 19. Week 1: What is HCI ?Outlines ความเปนมาของ HCI เปาหมายของ HCI แผนภาพของ HCI หลักการที่ทําใหได HCI ที่ดี ความทาทายของ HCI
  20. 20. วิชานี้ไดกําเนิดมาในวงการคอมพิวเตอร 10 กวาปหรือ 20 ปตนๆสมัยกอนจะมีสอนในสาขาวิทยาศาสตรคอมพิวเตอร ระดับสูงๆ ตั้งแตระดับปริญญาโทขึ้นไปจนถึงปริญญาเอก....ปจจุบันมีสาขาเอกใหเลือก ทาง HCI โดยตรงบุคลากรทางดาน HCI ยังเปนที่ตองการของตลาดอุสาหกรรมซอฟตแวรและโมบาย วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร ั
  21. 21. เปาหมายของ HCI คือการสรางระบบที่สามารถใชงานได, มีความปลอดภัย และสามารถใชงานไดจริง ซึ่งสามารสรุปเปาหมายออกเปนหัวขอดังนี้มีความปลอดภัย (Safety)มีประโยชน (Utility)มีประสิทธิผล และประสิทธิภาพ (Effectiveness andEfficiency)สามารถใชงานได (Usability) วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร ั
  22. 22. System ระบบ มีความหมายที่ครอบคลุมไมไดมีเพียงแคฮารดแวร หรือ ซอฟตแวร แตหมายถึงสภาพแวดลอมทั้งหมดที่ใช หรือถูก กระทบโดยเทคโนโลยีคอมพิวเตอร วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร ั
  23. 23. Effectiveness and Efficiency การปรับปรุงประสิทธิผล และประสิทธิภาพ คือการมุงเนนให ระบบที่พัฒนาขึ้นมีผลการทํางานที่ดี มีความสะดวกสบายใน แตละสวนของระบบ วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร ั
  24. 24. Safety ความปลอดภัย คือการมุงเนนในเรื่องการออกแบบใหระบบที่ พัฒนามีความปลอดภัยทั้งกับบุคคล และองคกรที่ใชงานระบบ วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร ั
  25. 25. Utility ความมีประโยชน คือการสรางระบบใหสามารใชงานไดจริงของ ระบบที่ไดพัฒนาขึ้น วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร ั
  26. 26. Usability การใชงานได คือแนวคิดที่เกี่ยวกับการทําระบบใหงายตอการ เรียนรู และงายตอการใชงานระบบคอมพิวเตอรไมกอความ ลําบาก หรือรําคาญกับผูใช วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร ั
  27. 27. ขั้นตอนทีจะนําไปสูเปาหมายของ HCI ่ ประกอบไปดวย 3 ขันตอนดังนี้ ้ Understand คือมีความเขาใจในเรื่องจิตวิทยา, กาย วิภาคศาสตร, และปจจัยเกี่ยวกับองคกรทางสังคม Develop คือการใชเทคนิคตางๆในทางคอมพิวเตอรเพือ ่ ใชในการออกแบบ หรือพัฒนาผลงาน Achieve คือการทําปฏิสัมพันธใหมีประสิทธิภาพ ประสิทธิผล และปลอดภัยตอทั้งบุคคลและกลุม วิชา INT2104 การปฏิสัมพันธระหวางมนุษยกบคอมพิวเตอร ั
  28. 28. แผนภาพของ HCI
  29. 29. แผนภาพของ HCI องคประกอบของ HCI แบงออกเปนสี่สวน แสดงดังรูป U1: กลุมระบบคอมพิวเตอรที่ใชงานในกลุมสังคมที่ทํางาน รวมกัน U2: กลุมการใชโปรแกรมประยุกต ระบบ และงานที่ตองนํา คอมพิวเตอรเขามาใชงาน U3: กลุมที่ใชงานคอมพิวเตอรแบบเฉพาะบุคคล ตองมีการ ดัดแปลงเพือใหใชเฉพาะงาน หรือเฉพาะบุคคล ่
  30. 30. แผนภาพของ HCI H1: กระบวนการรับรู และวิเคราะหของมนุษย H2: ภาษา การสื่อสาร และปฏิสัมพันธ H3: ลักษณะการทํางานทางกายภาพของมนุษย
  31. 31. แผนภาพของ HCI C1: อุปกรณนําเขา และแสดงผลเปนตัวเชื่อมมนุษยและ คอมพิวเตอร C2: เทคนิคที่ใชในขั้นตอนการโตตอบระหวางใชงาน C3: เทคนิคที่ทําใหเกิดผลในการออกแบบขนาดใหญ C4: รายละเอียดในสวนสนับสนุนการโตตอบ C5: การโตตอบหลายเทคนิค ที่นําไปสูการออกแบบระบบ สถาปตยกรรม
  32. 32. แผนภาพของ HCI D1: การออกแบบสําหรับการโตตอบ D2: เทคนิคและเครื่องมือสําหรับใชพฒนาใหเกิดผล ั D3: เทคนิคการประเมิน D4: ตัวอยางระบบการออกแบบ และกรณีศึกษาที่เหมาะสม
  33. 33. HCI Specialists should understand factors (influence)on how people operate and make use of computer technology)
  34. 34. HCI Specialists then developtools and techniques to help designers
  35. 35. Computer system helps users to achieve efficient, effective and safe interactions both individual and group.
  36. 36. แผนภาพของ HCI Use and Context of Computer การใชงาน และ บริบทของคอมพิวเตอรเพื่อใหมีความลงตัวในการใชงาน Human Characteristics เปนหัวขอที่ศึกษาทําความ เขาใจเกี่ยวกับมนุษย Computer System and Interface Architecture เปนสวนประกอบพิเศษที่คอมพิวเตอรมีเพื่อการปฏิสัมพันธ The Development Process เปนสวนที่เกี่ยวของกับการ สรางและประเมินผลสวนตอประสานที่ใชกบมนุษย ั
  37. 37. หลักการทีทําใหแนใจถึง HCI ทีดี ่ ่ หลักการทีทําใหแนใจถึง HCI ที่ดีคือ Visibility และ ่ Affordance ซึ่งจะนําไปสูหลักการ Perceived Affordance Visibility คือแนวคิดที่ใชเพื่อควบคุมการออกแบบใหสามารถ มองเห็นวาเราทําอะไร และระบบตอบสนองเชนไร เหมาะสมหรือไม Affordance คือแนวคิดที่ใชเพื่อควบคุมการออกแบบให สามารถสื่อสารกับผูใชงานไดอยางชัดเจน โดยไมตองอาศัย กระบวนการตีความเพิ่มเติม เชนเดียวกับการเห็นเกาอี้ ก็เขาใจได ทันทีวาใชงานเชนไร
  38. 38. ความทาทายทางดาน HCI ปจจัยที่ทาทายงานวิจัยทางดาน HCI นั้นมีอยู 2  ปจจัยดังนี้ ทําอยางไร จึงจะสามารถเก็บเกี่ยว และกาวตามความ เปลี่ยนแปลงของเทคโนโลยี ทําอยางไรจึงจะแนใจวาการประยุกตใชวชา HCI กับ ิ การออกแบบในรูปแบบเดิมจะเหมาะสมกวา การนําเอา เทคโนโลยีใหมๆมาใชทดแทนรูปแบบเดิม
  39. 39. เอกสารอางอิง

×