วันอาทิตย์ที่ 21 กันยายน พ.ศ. 2551

Interaction Style

แบ่งได้เป็น 5 แบบ

  • Command-driven
  • Menu-driven
  • Form-filling
  • Natural Language Processing
  • Direct Manipulation

1 Command-Driven

เป็น interaction ที่เก่าทีสุด เช่นพวก command line, assembly และเป็นคำสั่งที่ทำงานกับคอมพิวเตอร์โดยตรง

  • เน้นที่การสร้างชุดคำสั่ง (Organizing a command)
  • A simple list เช่น คำสั่งบน UNIX การใช้คำสั่งใน vi editor 1 คำสั่ง ทำงาน 1 task
  • A command with arguments เช่น COPY FILEA FILEB
  • A command plus options and arguments เช่น คำสั่งในการเช็คเที่ยวบินของระบสมัยก่อน A0821DCALGA0300P, สั่งพิมพ์ 3 ชุด Print FILEA -3, HQ

Point=> ในมุมมอง HCI ถือว่า command-driven เป็นข้อด้อยของ interface


2 Menu-Driven

Advantages (over command interface):

  • ผู้ใช้ไม่ต้องจำคำสั่ง
  • สามารถใช้งานร่วมได้กับ interface อื่นๆได้

Disadvantage:

  • ผู้ใช้ต้อง recognize ว่ามี option อะไรบ้าง
  • บางทีมันอาจจะไปบดบัง content อื่นๆ

ประเภทของ Menu-Driven (4 แบบ)

  • Single Menu
    -
    Binary เช่น คำถามให้ตอบ Y/N
    - Multiple-item เช่น radio button มีได้มากกว่า 2 ทางเลือก แต่เลือกได้ทางเลือกเดียว
    - Extended เช่น ให้คลิกเลือกลักษณะ Font เส้น รูปแบบต่างๆ
    - Pull down เช่น menu bar ของวินโดว์ & Pop-Up มักจะปรากฎบริเวณที่กำลังทำงานขณะนั้น เช่นการคลิกเม้าส์ขวา เพื่อเรียก short-cut menu บนหน้าจอ
    Point=> User แต่ละคนคลิกในที่ต่างกัน Pop up แสดงไม่เหมือนกัน เป็นเหตุให้ MAC ไม่มีการ
    คลิกขวา ดังนั้น User ที่ไม่มีประสบการณ์ Pop up จึงไม่เหมาะสม
    - Multiple-Check Boxes Point=>
    ** ต้องระวังการเลือกที่ตัวเลือกจะ Conflict กันเอง ต้องมีการ enable ทางเลือกที่ไม่สามารถเลือกได้ด้วย เช่นเลือกได้ไม่เกิน 3 ถ้าเลือกครบ 3 แล้ว ตัวเลือกที่เหลือจะต้อง enable ไว้
    - Multiple-Check Menus เช่นหน้าจอการใช้งาน photoshop สามารถเลือกได้หลายอย่าง
  • Linear Sequence ตัวอย่าง หน้าจอการกำหนด properties ของ Font มีลำดับเช่น เลือก Font ถึงจะมีขนาด Font ที่เลือกได้ และ Style ของ font เป็นลำดับ
  • Tree Structure
    เช่น การออกแบบเมนูบนของวินโดว์
    Breadth = จำนวนเมนูหลัก, Depth จำนวนเมนูย่อยของแต่ละเมนูหลัก
    Point=> มีงานวิจัยกล่าวว่า Interface ที่ดี ควรมีจำนวน Breadth > Depth แต่ทำไม Microsoft ถึง มีจำนวน Breadth

    Interesting!!
    *การหาเกณฑ์วัดว่าเมื่อไหร่ถึงจะแยกเมนูย่อยเป็น pull down หรือ เป็น Pair-Menu*
    *เกณฑ์ในการกำหนด Breadth และ Depth*

    ข้อแนะนำ:
    - ควรมีการจัดกลุ่มอย่างสมเหตุผล เช่น Level 1 = ประเทศ, Level 2 = จังหวัด
    - ควรให้เห็นทุกเมนู แม้ว่าจะไม่ใช้
    - ใช้ภาษาที่ผู้ใช้เข้าใจ
    - เมนูย่อย ต้องขึ้นกับเมนูหลักใดๆ เพียงเมนูเดียว (ไม่ซ้ำซ้อน)
    - ไม่เปลี่ยนตำแหน่ง
    - ไม่บังเมนูอื่นๆ
    (ดู 10 usability เพิ่มเติม)
  • Acyclic & Cyclic menu network
    - Acyclic เป็นเมนูแบบไม่ย้อนกลับ แสดงตามลำดับ
    ได้แก่ Single Menu, Linear Sequence และ Tree Structure

    - Cyclic เป็นเมนูที่มีการเรียกย้อนกลับได้ โดยเฉพาะบนเว็บ ที่มีปุ่ม Home กลับหน้าแรกได้จากทุกหน้า และลิงค์กลับไปกลับมาได้
    Point=> เพื่อป้องการสับสนควรมี Short-Cut หรือ Cleary Mark Exit

3. Form-Filling

ใช้เมื่อต้องการได้ข้อมูลจากผู้ใช้ มีคำแนะนำในการออกแบบดังนี้

  • ควรมี title ของฟอร์มที่สื่อสารได้ชัดเจน
  • ควรการจัดกลุ่มข้อมูล และการเรียงลำดับของฟอร์ม
  • ควรแก้ไขได้เฉพาะในส่วนที่ผิด ไม่ใช่ reset แล้วกรอกใหม่หมด
  • ควรมีการแจ้งข้อผิดพลาดเฉพาะแต่ละ ฟิลด์ เช่น ป้อนไม่ถูก Format
  • ควรมีคำแนะนำในการป้อนข้อมูล เช่น รูปแบบวันที่ dd-mm-yy หรือ MM-DD-YYYY
  • ควรมีปุ่ม submit เมื่อป้อนข้อมูลเสร็จแล้ว หรือ preview ดูผลลัพธ์ก่อนได้

** มีงานวิจัยว่า ถ้าตอบสถานภาพสมรส แล้ว ต้องมี สัญลักษณ์ >> เพื่อให้ป้อนข้อมูลในฟิล์ด์ถัดไปเช่น จำนวนบุตร **

4. Natural Language Processing (NLP)

(ส่วนใหญ่คือ speech recognition)

มี 2 mode คือ

- Written mode

- Audio mode


Application : Text Retrival, Text Searching, Game

NLP น่าจะทำให้การเลือก information ตรงกับความต้องการของผู้ใช้มากที่สุด
อ.ยกตัวอย่าง การหาหนังสือรัชกาลที่ 5 สำหรับ เด็ก ป.2 กับหนังสือ ของนักกฎหมาย ซึ่งจะต้องได้ information ต่างกัน

5. Direct Manipulation

- Item หรือ icon บนจอภาพ ที่อนุญาตให้ผู้ใช้ไปทำงาน เช่น เปลี่ยนแปลง object นั้นได้โดยตรง


ระบบที่พัฒนาด้วย Direct Manipulation จะต้องเป็นดังนี้

  • ต้องกระทำได้โดยตรง
  • ต้องชัดเจน (Visible) ** การที่มัน visible คือ มันส่งผลให้เกิดการ direct แล้วมันจะมีผลต่อเนื่องไปเรื่อยๆ
  • ตอบสนองอย่างรวดเร็ว (Rapid)
  • ย้อนกลับการแก้ไขได้ เช่น undo/cancel
  • มีผลต่อเนื่องไปเรื่อยๆ (incremental actions) เช่น กำหนด Font 1.ตัวเข้ม + 2. ตัวเอียง = อักษรที่มีลักษณะตัวเข้มผสมเอียง

ตัวอย่าง

  • การขับรถยนต์ (เป็นตัวอย่างที่เจ๋งมาก) สามารถเอื้อมถึงอุปกรณ์ต่างๆ ที่อยู่โดยรอบได้ หรือมี remote ควบคุม
  • Visual Reality ปัจจุบันจะรวมอยู่ในสรีระ เช่น ทำเป็นแว่นให้สวม
  • WYSIWYG สำเร็จเพราะ มันใกล้เคียงกับสิ่งที่จะได้ เช่น เห็นงานบนจอได้เหมือนที่พิม์ออกมาทางเครื่องพิมพ์, ตอบสนอง และแสดงผลลัพธ์ได้ทันที, ย้อนกลับไปแก้ไขได้

Advantages

  • เรียนรุ้ได้เร็ว, รู้สึกควบคุมได้ทำให้ผู้ใช้ไม่กลัว เช่นพวก undo, ตอบสนองได้รวดเร็ว, ปรับแก้ได้ทันท่วงที

Problems:

  • ผู้ใช้ต้องเข้าใจความหมายของ Visual ที่มี ซึ่งมันไม่ง่ายที่จะทำให้เกิด Visual
  • ใช้เนื้อที่ค่อนข้างมากบนจอภาพ ทำให้เบียดบังพื้นที่การใช้งานที่จำกัด

ไม่มีความคิดเห็น: