Program Interface,

1. Program Interface
By Yaowaluck Promdee, Sumonta Kasemvilas
322131 Human Computer Interaction
2/2014

2. Agenda
• Software Design
• Software Design Fundamental
• User Interface
• Assignment

3. Software Design
http://www.bcarocks.com/wp-content/uploads/2013/08/Analysis_vs_DesignModel.png

4. Software Design Vocabulary
1. Architectural design บอกถึงตัวแบบและความสัมพันธ์ของระบบ
2. Abstract specification เงื่อนไขและบริการต่างๆ ที่มีระบบย่อย
3. Interface design ออกแบบรูปแบบส่วนของการติดต่อ
4. Component design ออกแบบโมดูลย่อยและวิธีการติดต่อระหว่างโมดูล
5. Data structure design ออกแบบรายละเอียดโครงสร้างข้อมูลที่ใช้ต่างๆ
6. Algorithm design ออกแบบขั้นตอนการทำงานในแต่ละโมดูล

5. Software Design Fundamental
1. Abstraction คิดแยกรายละเอียดของปัญหาออกเป็นระดับที่ชัดเจน
2. Stepwise Refinement ออกแบบขยายรายละเอียดเป็นลำดับขั้นตอน
3. Modularity แบ่งซอฟต์แวร์เป็นส่วนๆ “โมดูล” ชื่อและองค์ประกอบ
4. Software Architecture ความสัมพันธ์ของระบบย่อยต่างๆ
5. Control Hierarchy จัดลำดับของโมดูลต่างๆ ในโปรแกรม
6. Data Structure ออกแบบรายละเอียดโครงสร้างข้อมูลที่ใช้ในโมดูล
7. Software Procedure การประมวลผลแต่ละโมดูล
8. Information Hiding การซ่อนสารสนเทศ การเข้าถึงข้อมูล
http://www.science.cmru.ac.th/

6. User Interface Design

7. User Interface
1. Command Line Interaction
2. Menu Interaction
3. Form Interaction
4. Object-Based Interaction
5. Natural Language Interaction
http://biscom.rc.ac.th/
http://venturebeat.files.wordpress.com/2012/01/ui.jpg%3Fw%3D514

8. Command Line Interaction

9. Menu Interaction
Pull-Down Menu!
Pop-Up Menu!
Tool Bar Menu!

10. Form Interaction
http://uxmovement.com/forms/

11. Form Interaction

12. Object-Based Interaction

13. Natural Language Interaction

14. Structure Data Entry!
1. Entry การป้อนข้อมูล
2. Default การกำหนดค่าเริ่มต้น
3. Unit หน่วยของข้อมูล
4. Caption คำอธิบายต่าง ๆ
5. Format รูปแบบ
6. Justify การจัดวาง
7. Help ส่วนช่วยเหลือ

15. Assignment! Inventory System!
โปรแกรมคลังสินค้า
ให้นักศึกษาออกแบบหน้าจอโปรแกรมคลังสินค้า ตามความ
ต้องการของลูกค้าที่กำหนดให้
1. มีการบันทึกสินค้าเข้า - ออก
2. แสดงรายการสินค้าในแต่ละรายการ ดังนี้ มีรูปภาพประกอบ
สินค้า รายละเอียดสินค้า วันที่นำเข้า วันที่ขาย จำนวนคง
เหลือ ราคาต่อหน่วย ราคาขายจริง ชื่อสินค้า รหัสสินค้า
หมวดหมู่ รายละเอียดสินค้า ตู้ที่เก็บสินค้านั้นๆ
3. แสดงชื่อผู้บันทึกรายการสินค้าในคงคลัง
4. สามารถสั่งพิมพ์รายการสินค้าได้