เทคโนโลยีคอมพิวเตอร์ในสำนักงานอัตโนมัติสำหรับครูธุรกิจ
 บทนำ
 บทที่ 1
 บทที่ 2
 บทที่ 3
 บทที่ 4
 บทที่ 5
     © การออกแบบระบบงาน
     © ภาพรวมการออกแบบระบบ
     © แนวทางการออกแบบระบบ
     © การออกแบบอินพุท&เอาท์พุท
     © การออกแบบ
          - แผนภาพความสัมพันธ์
          - ส่วนที่ติดต่อกับผู้ใช้งาน
 บทที่ 6
 บทสรุป&แบบฝึกหัด

การออกแบบทางด้านแฟ้มข้อมูล ฐานข้อมูล
และส่วนที่ติดต่อกับผู้ใช้งาน
(File and Database Design, User interface Design)

ส่วนที่ติดต่อกับผู้ใช้งาน

          กราฟิกที่ใช้ติดต่อกับผู้ใช้ (Graphical user interfaces) (GUI)
          GUI จะใช้หน้าต่าง (window) , แถบเมนู (menu bars) เมนูพูลดาวน์ (pull-down)
และเมนูป็อบอัพ (pop-up menus) และรูปภาพกราฟิก (ซึ่งเรียกว่า ไอคอน)



รูป 5-22 แสดงตัวอย่างการใช้ GUI ที่ใช้แทนเมนูหลักของระบบการให้เกรดนักศึกษา

          รูปที่ 5-22 คือ GUI ที่ใช้แทนเมนูหลัก ของระบบการให้เกรดนักศึกษา ซึ่งจะเลือกให้คะแนน
นักศึกษาตามห้องเรียน ที่อยู่ส่วนบนของจอภาพ ซึ่งรูปแบบเมนูนี้จะเรียกว่า เมนูบาร์ (menu bar)
ส่วนอีกส่วนในบรรทัดถัดมาจะเรียกว่า แถบเครื่องมือ (toolbar) ซึ่งจะเป็นไอคอน (icon)
แสดงคำสั่งต่าง ๆ โดยผู้ใช้จะใช้เมาส์ (mouse) ในการเลือกคำสั่งโดยการคลิกที่ไอคอนคำสั่งนั้น



รูป5-23 แสดงการคลิกเมาส์ (mouse) ที่ History หรือ การกด H บนคีย์บอร์ด
ซึ่งจะปรากฏเมนู พูลดาวน์ (pull-down menu) ซึ่งเป็นเมนูย่อย

          รูปที่ 5-23 จะเป็นการที่ผู้ใช้เลือกโดยการคลิกเมาส์ (Mouse) ที่ History หรือการกด H
บนคีย์บอร์ด ซึ่งจะปรากฏพูลดาวน์ (Pull-down menu) ซึ่งจะแสดงเมนูย่อย (Submenu) ซึ่งจะเลือกโดยใช้เมาส์ (mouse) คลิกหรือกดตัวอักษรตัวหนาบนคีย์บอร์ดเพื่อเลือกคำสั่ง



รูป 5-24 แสดงไดอะล็อกบ็อกซ์แบบป็อบอัพ (pop-up dialog box)

          ตัวอย่างรูปที่ 5-24 เป็นไดอะล็อกบ็อกซ์แบบป๊อบอัพ (Pop-up dialog box) ซึ่งเมื่อใส่ชื่อนักศึกษาเข้าที่ช่องว่างสี่เหลี่ยมบนหน้าต่างป็อบอัพ (pop-up window) ซึ่งจะปรากฏเพียงชั่วคราว ซึ่งจะซ้อนอยู่บนหน้าต่างบนหน้าจอเพื่อค้นหารายละเอียดของนักศึกษานั้น

          ไดอะล็อกซ์บ็อกซ์ (Dialog box) คือหน้าต่างที่ปรากฏขึ้นเมื่อต้องการให้ผู้ใช้เข้าข้อมูลเพื่อนำไปใช้ในการปฏิบัติงาน ดังรูป 5-25 เป็น 8 แบบ ของเทคนิคทาง GUI ที่ใช้เข้าข้อมูลหรือเลือกใช้คำสั่ง
ดังต่อไปนี้




รูป 5-25 แสดงเทคนิคทาง GUI 8 แบบในการเข้าข้อมูลหรือเลือกคำสั่ง

          - ทูลบาร์ (Tool box) ประกอบด้วยสัญรูปหรือปุ่มที่แสดงทางลัดสำหรับการกระทำการคำสั่งทั่วไป คำสั่งจะเป็นทางลัดนำทางหรือไปสู่กิจกรรมอื่น ๆ เช่น ผู้ใช้สามารถกดปุ่มโทรศัพท์ เพื่อโทรศัพท์ไปยังเบอร์โทรศัพท์ที่อยู่ในฟิลด์ที่เลือกโดยอัตโนมัติ หรือเมื่อกดปุ่มค้นหา

          - เท็กซ์บ็อกซ์ (text box) คือกล่องที่ใช้ในการเข้าข้อมูลที่เป็นตัวอักษรหรือตัวเลข

          - ปุ่มทอกเกิล (toggle button) คือปุ่มที่เหมือนเป็นสวิทซ์ ON (เปิด) หรือ OFF (ปิด) เมื่อมีการคลิกที่ปุ่มสวิทซ์นี้จะเป็นการเลือกสถานะเปิดปิด

          - ลิสท์บ็อกซ์ (list box) คือกล่องที่แสดงตัวเลือก ให้เลือกถ้ามีตัวเลือกมากกว่า 1 ตัวเลือกจะใช้แถบสกอร์ บาร์ (Scroll bar) ซึ่งอยู่ทางขวามือของลิสท์บ็อกซ์ (LIST BOX) เพื่อเคลื่อนรายการให้ปรากฏขึ้นลงได้ตามตัวเลือกที่มีทั้งหมด

          - ดรอปดาวน์ลิสท์บ็อกซ์ (drop-down list box) คือกล่องที่แสดงให้เห็นตัวเลือกขณะนั้น โดยผู้ใช้สามารถเลื่อนโดยใช้ลูกศร ที่อยู่ทางช่องสี่เหลี่ยมทางขวามือ เพื่อเลือกตัวเลือกอื่น

          - ปุ่มออฟชั่น (Option buttons) หรือปุ่มตัวเลือก (Radio Buttons) คือปุ่มที่ใช้เลือกตัวเลือก โดยสามารถเลือกได้เพียงตัวเลือกเดียวเท่านั้นในครั้งเดียว ซึ่งตัวที่เลือกจะแสดงจุดดำหน้าตัวเลือกนั้น

          - เช็คบ็อกซ์ (Check box) คือ กล่องซึ่งผู้ใช้จะเลือกตัวเลือกนั้นหรือไม่ก็ได้ ถ้าหากเลือก
ตัวเลือกนั้นจะขึ้นกากบาท (X) ที่กล่องสี่เหลี่ยม ซึ่งผู้เลือกสามารถเลือกได้มากกว่า 1 ตัวเลือก

          - ปุ่มคำสั่ง (Command buttons) คือปุ่มคำสั่งที่ผู้ใช้สามารถคลิกที่ปุ่มเพื่อสั่งให้ทำตามคำสั่ง
ที่เขียนไว้ที่ปุ่มคำสั่งนั้น โดยอาจใช้เชื่อมต่อกับไดอะล็อกซ์บ็อกซ์ (dialog box) นั้น

          - แถบสปิน (spin bar) คือแถบที่ใช้เปลี่ยนค่าตัวเลือกซึ่งเป็นตัวเลข โดยคลิกที่ลูกศรชี้ขึ้น
ที่ด้านขวา เพื่อเพิ่มตัวเลข ขณะที่เมื่อคลิกที่ลูกศรชี้ลงจะเป็นการลดตัวเลข

          - สวิทซ์บอร์ด (SWITCH BOARD) เป็นตัวเลือกในเมนูควบคุมการปฏิบัติการ (PROCESS CONTROL MENUS) สวิทซ์บอร์ด (SWITCH BOARD) จะหมายถึงแบบฟอร์มที่เหมือนหน้าต่าง (WINDOW) ซึ่งบรรจุปุ่มคำสั่ง (COMMAND BUTTONS) ซึ่งปรากฏให้ผู้ใช้เลือก ซึ่งปุ่มคำสั่ง (COMMAND BUTTONS) นั้นจะเขียนข้อความแสดงคำสั่งบนปุ่ม ซึ่งอาจใช้ไอคอน (icons)
แทนปุ่มคำสั่งนั้นก็ได้



รูป 5-25 คือสวิทซ์บอร์ด (SWITCH BOARD)





รูป 5-26 แสดงหน้าจอการป้อนข้อมูลสำหรับระบบลงทะเบียนนักศึกษา
การออกแบบหน้าจอใช้คุณลักษณะที่หลากหลาย