![Page 1: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/1.jpg)
Systems Analysis and DesignSystems Analysis and Design
การวเคราะหและออกแบบ
![Page 2: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/2.jpg)
Interface DesignInterface Design
Chapter Chapter 1010
![Page 3: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/3.jpg)
เนอหา
Design principle
Design process
Navigation design
Input design
Output design
![Page 4: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/4.jpg)
Interface
User interface เปนการสรางวธทท าใหระบบสามารถตดตอกบสงทอยภายนอกระบบ
System interface เปนการสรางวธแลกเปลยนขอมลระบบกบระบบอน
![Page 5: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/5.jpg)
Three Parts of User Interface
Navigation เปนสวนทยสเซอรใชออกค าสงไปยงระบบใหท าอะไร เชน menus buttons
Input วธเอาขอมลเขาสระบบ เชน ฟอรม เพมลกคาใหม
Output วธเอาขอมลใหกบ users หรอระบบอน เชน รายงาน
![Page 6: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/6.jpg)
User Interface Design Principle
![Page 7: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/7.jpg)
Design Principles
Layout
Content awareness
Aesthetics
User experience
Consistency
Minimal user effort
![Page 8: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/8.jpg)
Layout Concepts
แสดง หนาจอ ฟอรม รายงาน
หนาจอมกจะแบงออกเปน 3 สวน
- Heading and Navigation area (top)
ยสเซอรออกค าสงผาน navigation ไปยงระบบ
- Body or work area (middle)
แสดง report และ form
- Instruction or Status area (bottom)
แสดงสถานะวายสเซอรก าลงท าอะไร
![Page 9: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/9.jpg)
Screen Layout Examples
![Page 10: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/10.jpg)
![Page 11: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/11.jpg)
Layout Concepts
ขอมลสามารถแสดงไดในหลายพนท
จดขอมลใหเปนหมวดหม
จดทศทางการไหลของฟอรมใหถกตอง
![Page 12: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/12.jpg)
Screen Layout Examples
![Page 13: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/13.jpg)
Bad Flow in a Form
![Page 14: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/14.jpg)
Good Flow in a Form
![Page 15: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/15.jpg)
Content Awareness
ใหยสเซอรใชความพยายามนอยทสด ทจะเขาใจขอมลทแสดง
ทกๆ interface ควรมหวขอ
เมน ควรแสดง
- อยทไหน
- มาจากไหน
ทกพนทควรจะชดเจนและออกแบบอยางด
ท า caption ใหชดเจน
![Page 16: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/16.jpg)
Caption Example
![Page 17: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/17.jpg)
Aesthetics
Interface ตองมฟงกชนการท างานเและรสกชวนใหใช
หลกเลยงการบบขอมลจ านวนมากใหอยหนาเดยว
ออกแบบตวหนงสอใหเหมาะสม
ใชสและรปแบบใหเหมาะสม
![Page 18: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/18.jpg)
User Experience
Interface ควรออกแบบ :
- ใหทง users ทมความช านาญและไมช านาญ
- งายตอการเรยนรและใชงาน
- สมดลระหวางความรวดเรวในการใชงานฟงกชนทวไปและการแนะน า
ฟงกชนใหม
![Page 19: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/19.jpg)
Consistency
Users สามารถคาดเดาไดวาอะไรจะเกดขนตอไป
ลดการเรยนรซ า
ใหมมาตราฐาน
- Navigation controls
- Terminology
- Report and form design
![Page 20: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/20.jpg)
Minimize Effort
Three click rule
- users ควรจะสามารถเขาถงขอมลหรอการกระท าทตองการได โดยการคลกเมาทหรอกดคยบอรด ไมเกน 3 ครงนบตงแตเรมตนท main menu
![Page 21: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/21.jpg)
User Interface Design Process
![Page 22: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/22.jpg)
Five Step Process
![Page 23: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/23.jpg)
Use Scenario Development
ขนตอนตางๆทผใชงานท างานจนส าเรจโดยพจารณาจากเหตการณจ าลอง
ลสตขนตอนการท างาน
เขยนค าบรรยายงายๆผกกบ Process ของ DFD
![Page 24: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/24.jpg)
Interface Structure Design
เปนการก าหนดองคประกอบพนฐานของ interface และการท างานรวมกน
Window navigation diagram (WND)
- แสดงความสมพนธทงหมดของ หนาจอ, ฟอรม และรายงาน
- แสดงการเคลอนไปมาระหวางฟอรม
![Page 25: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/25.jpg)
WND Example
![Page 26: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/26.jpg)
Interface Standard Design
การออกแบบองคประกอบพนฐานทใชงานทวไปในแตละ Screen Form Report ภายในระบบ เพอใหมรปแบบทเหมอนกน หรอเปนไปในทางเดยวกน
- Interface metaphor คอการออกแบบใหคลายส งทใชในชวตจรง
- Interface objects คอการก าหนดชอให object ตางๆบน interface
- Interface actions คอการออกแบบค าสงตางๆเชน buy กบ purchase
modify กบ change
- Interface icons คอการออกแบบ icon เชน รป diskette แทนการ save
- Interface templates คอการออกแบบ templates ในแตละหนาจอใหม
รปแบบทเหมอนกน
![Page 27: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/27.jpg)
Interface Design Prototyping
การสรางแบบจ าลองของ หนาจอ, ฟอรม หรอรายงาน เพอให ผใชหรอโปรแกรมเมอรไดรวาระบบท างานอยางไร
- Paper-base storyboard
- HTML
- Language
![Page 28: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/28.jpg)
Storyboard Example
![Page 29: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/29.jpg)
Interface Evaluation Methods
การประเมนการออกแบบ interface วาถกตองครบถวนตามทตองการหรอไม กอนทระบบจะสมบรณ
ควรท าขณะทก าลงออกแบบ
เทคนคในการประเมน
- Heuristic evaluation :ท า check list ในการตวจสอบตามรปแบบ
- Walkthrough evaluation : project team น าเสนอใหผใชพจารณา
- Interactive evaluation : ใหผใชทดลองท ากบ prototype
- Formal usability testing :ใชกบ commercial software หรอระบบ
ขนาดใหญ โดยผใชทดลองท ากบ prototype และมการตรวจสอบ
ความส าเรจในการทดลองใช
![Page 30: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/30.jpg)
Navigation Design
![Page 31: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/31.jpg)
Basic Principle
ใหคดวา users
- ไมจ าเปนตองอานคมอกใชงานได
- ไมจ าเปนตองอบรม
- ไมจ าเปนตองมคนชวยเหลอ
ทกๆการควบคมจะตองชดเจนและวางในต าแหนงทเขาใจได
![Page 32: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/32.jpg)
Basic Principle
ปองกนความผดพลาด
- จ ากดการเลอก
- ไมแสดงค าสงทไมใช (หรอท าใหใชไมได)
- มขอความใหยนยนการกระท าทไมสามารถยกเลกได
งายตอการยกเลก (recovery) ถาเกดท าผดพลาด
เรยงล าดบไวยากรณใหคงท
![Page 33: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/33.jpg)
Type of Navigation Control
Languages
- Command language
- Natural language
Menus
Direct Manipulation
![Page 34: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/34.jpg)
Command-Language Interface
Users ใชงานแอพพลเคชนดวยพมพชดสง
เชน Dos, Unix, SQL เปนตน
![Page 35: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/35.jpg)
Natural-Language Interfaces
Users สามารถสอสารกบคอมพวเตอรดวยภาษาธรรมชาต
![Page 36: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/36.jpg)
A Menu Interface
แสดงรายการแตละหวขอใหเลอก
จ ากดทางเลอกของผใช
Nested menu คอ เมนทสามารถแสดงอกเมนหนงได
สามารถสราง Hot key ใหกบเมนได
จดกลมหวขอทเกยวของกนใหอยในเมนเดยวกน
![Page 37: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/37.jpg)
Advantages of Nested Menus
ลดการแสดงรายการบนหนาจอ
จ ากดการแสดงเมนทางเลอกท users ไมสนใจ
มความรวดเรวในการถงโปรแกรม
![Page 38: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/38.jpg)
Text-based Menu Example
![Page 39: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/39.jpg)
Common Type of Menus
![Page 40: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/40.jpg)
Image Map
![Page 41: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/41.jpg)
Direct Manipulation
การออกค าสงโดยตรงกบ interface object
- ใช keyboard, mouse, joystick
- เชน การเปลยนขนาดของ font, การลากไฟลเพอกอปป,การเลอน Slide
bar
![Page 42: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/42.jpg)
Messages
วธทระบบจะตอบสนองกบ users และแจงขอมลสถานะของการตดตอ
ตอง ชดเจน, ถกตอง และสมบรณ
หลกเลยงค ายอ ศพทเทคนค ความหมายเชงลบ
- เชน “Are you sure you do not want to continue ?” แทนดวย
“Do you want to quit ?”
![Page 43: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/43.jpg)
Messages Types
Error message
- ควรอธบายถงปญหาและวธแกไข
- ควรม error number
Confirmation message
Acknowledgement message
Delay message
Help message
![Page 44: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/44.jpg)
Input Design
![Page 45: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/45.jpg)
Online versus batch Processing
Online processing immediately records the transaction in the appropriate database
Batch processing collects inputs over time and enters them in the system at one time in a batch
Batch processing simplifies data communications and other processes, but means that inventory and other reports are not accurate in real time
![Page 46: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/46.jpg)
Capture Data at the Source
ลดการซ าซอนของงาน
ลดเวลาการโปรเซส
ลดตนทน
ลดโอกาสของความผดพลาด
![Page 47: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/47.jpg)
Source Data Automation
เทคโนโลยทน ามาใช
- Bar code readers
- Optical character recognition
- Magnetic stripe readers
- Smart cards
![Page 48: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/48.jpg)
Minimize Keystrokes
ไมใหคยขอมลทระบบสามารถใสเองได
แสดงรายการใหเลอกดกวาคยขอมลเอง
ใชคาดฟอลททกททเปนไปได
![Page 49: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/49.jpg)
Types of Inputs
Text
Numbers
Selection boxes
![Page 50: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/50.jpg)
GUI Controls for Input
Text boxes
Check boxes
Option or radio buttons
List and drop-down list boxes
Sliders and spin buttons
Image maps
Text area
Message boxes
![Page 51: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/51.jpg)
![Page 52: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/52.jpg)
![Page 53: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/53.jpg)
![Page 54: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/54.jpg)
Output Design
![Page 55: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/55.jpg)
Output Design Objectives
Output คอรายงานทระบบสรางออกมา
- ตอบสนองตามวตถประสงค
- มความหมายตอ users
- จดท าไดทนเวลา
- ลดความโนมเอยง
![Page 56: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/56.jpg)
Output Bias
ความโนมเอยงของสารสนเทศเกดจาก
การเรยงล าดบ
ตามตวอกษร
ตามวนเดอนป
ตามคาของขอมล เชน ต าสด มากทสด เปนตน
เชนการแสดงรายชอ Supplier ตามตวอกษร โดยไมไดแสดงราคาขายของ
สนคา ผใชอาจเขาใจวาเรยงตามราคาขายต าสดกได ดงนนควรแสดงคา
ของขอมลทใชในการเรยงล าดบดวย
![Page 57: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/57.jpg)
Output Bias
ความโนมเอยงของสารสนเทศเกดจาก
การก าหนด limit ในการแสดงขอมล เชน ตองการแสดงเฉพาะทลกหนทมยอดหนมากกวา 200,000,000 ซงอาจไมมสารสนเทศถกแสดงออกมาเลยกได
การตง limit ต าเกนไป -> สารสนเทศถกแสดงออกมามากเกนไป
การตง limit สงเกนไป -> สารสนเทศถกแสดงออกมานอย หรอไมมเลย
การใช graphic ในการแสดงผล เชน การวาดกราฟโดยก าหนด scale ละเอยดเกนไป ท าใหสารสนเทศทไดดมากเกนจรง หรอการใช สญลกษณตาง ๆ แทนขอมลอาจดแลวไมสอถงความมาก หรอนอยของขอมล
![Page 58: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/58.jpg)
Bias in Graphs
![Page 59: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/59.jpg)
Strategies to Avoid Output Bias
ขอแนะน าในการหลกเล ยงความโนมเอยงในการแสดงสารสนเทศ
หาแหลงทมาของความโนมเอยงของสารสนเทศ
เปดโอกาสใหผใชระบบเขามามสวนรวมกบการออกแบบ เพราะผใช
ระบบรจกธรรมชาตของขอมลมากกวา
ระบบตองมความยดหยนพอสมควร เพอใหผใชสามารถปรบแก ให สารสนเทศเปนไปตามความตองการได
![Page 60: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/60.jpg)
Output Type
Detail Report
Summary Report
Turnaround Document
Graphs
![Page 61: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/61.jpg)
Graphs
เลอกใชกราฟเมอ
- สรปผลขอมลตวเลขนน
- แสดงแนวโนมการเปลยนแปลงของขอมลตวเลขนน
- เปรยบเทยบขอมลตวเลขทมคาแตกตางกน
- ใชแสดงแนวโนมการเปลยนแปลงเพอการพยากรณคาตวเลขในอนาคต
![Page 62: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/62.jpg)
Graphs
![Page 63: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/63.jpg)
Output Forms
Output สามารถอยในรปแบบ
- Screen
- Video, Audio, Animation
- Electronic output :email, fax, webpage
![Page 64: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/64.jpg)
Output Forms
ความแตกตางของรปแบบ Output
- Speed
- Cost
- Portability
- Flexibility
- Storage and retrieval possibilities
![Page 65: Systems Analysis and Design - WordPress.com · 2010-09-24 · Layout Concepts แสดง หน้าจอ ฟอร์ม รายงาน หน้าจอมักจะแบ่งออกเป็น](https://reader033.vdocuments.pub/reader033/viewer/2022041623/5e40b85d1528b7704937559d/html5/thumbnails/65.jpg)
EndEnd