chapter 3 multimedia programming - kku web hosting · pdf file3.1...
TRANSCRIPT
การพฒนาระบบมลตมเดย
1) วงจรการพฒนาระบบ (SDLC)
2) แนวทางปฏบต (Methodologies)
3) หลกการพฒนาระบบ
4) การพฒนาระบบมลตมเดย
Chapter 3 Chapter 3 Multimedia programming
3.1 วงจรการพฒนาระบบ
เปนกระบวนการทางความคด (Logical process) เพอแกปญหา วางแผน และสรางงานใหตอบสนองความตองการของผใชลกษณะของวงจรคอเปนการแบงขนตอนการพฒนาออกเปนระยะ ๆ (phase) ไดแกระยะการวางแผน (planning phase)ระยะการวเคราะห (analysis phase)ระยะการออกแบบ (design phase)ระยะการสรางและพฒนา
(implementation phase)
รปแบบของวงจรการพฒนา
- SDLC แบบ Waterfall
- SDLC แบบ Adapted waterfall
- SDLC แบบ Evolutionary
- SDLC แบบ Incremental
- SDLC แบบ Spiral
SDLC แบบ Waterfall
Planning
Analysis
Design
Implementation
SDLC แบบ Waterfall (ตอ)
Feasibility
System Investigation
System Analysis
System Design
Implementation
Review and Maintenance
SDLC แบบ Adapted Waterfall
Planning
Analysis
Design
Implementation
SDLC แบบ Evolutionary
Analysis
Design
implementation
Product 1
Analysis
Design
implementation
Product 2
Analysis
Design
implementation
Product 3
SDLC แบบ Incremental
Analysis
Design
Implementation
Analysis
Design
Implementation
Analysis
Design
Implementation
PART 1
PART 1
PART2 PART 1
PART2
PART3
SDLC แบบ Spiral
Plan firstiteration
Analysis
Testing
Implement
Design
3.2 แนวทางปฏบต (Methodologies)
หมายถงวธการหรอแนวทางทจะนากระบวนการทางความคดของวงจรการพฒนาระบบมาปฏบตจรงจนกลายเปนระบบทสามารถใชงานได
เครองมอในการพฒนาระบบ (Tools)คอซอฟตแวรทชวยสรางหรอวาดแบบ
จาลองชนดตาง ๆ ตรวจสอบความถกตองของแบบจาลอง ชวยสรางรายงานและแบบฟอรมรวมทงสรางโคดโปรแกรมใหอตโนมต
ตวอยางเครองมอ
Project Management ApplicationDrawing/Graphics ApplicationWord Processor/Text EditorComputer-Aided System Engineering(CASE) ToolsCode Generator ToolDatabase Management Tool
แบบจาลอง คอสญลกษณทใชในการจาลองขอเทจจรง
ตาง ๆ ทเกดขนในระบบ ไมวาจะเปนแบบจาลองระบบหรอแบบจาลองขอมล
ตวอยาง Flow chartData Flow DiagramEntity Relationship DiagramStructure ChartClass DiagramPERT ChartGantt Chart
เทคนค คอวธการทเปนแนวทางเพอชวยใหนก
พฒนาระบบสามารถดาเนนกจกรรมในขนตอนตาง ๆ ของการพฒนาระบบไดอยางมประสทธภาพ
ตวอยาง Strategic Planning TechniquesProject Management TechniquesUser Interviewing TechniquesRelational Database Design Techniques
Methodology นนมหลากหลายวธ วธทนยมใชไดแก
1) Structured System Analysis and Design Methodology (SSADM)
2) Rapid Application Development-basedMethodology (RAD)
3) Object-Oriented Analysis and DesignMethodology
Structured System Analysis and DesignMethodology (SSADM)
เปนการปฏบตแบบลาดบขนตอนจากขนตอนหนงไปสขนตอนตอไป และมการใชแบบจาลองทเปนแผนภาพ เพออธบายขนตอนการทางานและขอมลทงหมดของระบบงานทจะพฒนามตนแบบมาจาก waterfall และสามารถ
ประยกตใชกบ Adaptive waterfall ไดการใชแผนภาพเพอจาลองขนตอนการทางานเรยกวา Process-center approach และเรยกการใชแผนภาพเพอจาลองขอมลวา Data-center approach
ขอดของ SSADM
- สามารถรวบรวมความตองการจากผใชได- การเปลยนแปลงความตองการมนอย- ขอมลทวเคราะหและออกแบบจะตรงกบความตองการของผใชและเจาของระบบมากทสด
ขอเสยของ SSADM
- ใชเวลานานมากในการวเคราะหและออกแบบระบบ
Rapid Application Development-basedMethodology (RAD)
ถกพฒนาขนเพอแกไขจดออนของ SSADMโดยมการปรบระยะในวงจรการพฒนาระบบ ใหมขนตอนทรวบรดมากขน และมการนาเทคนคและเครองมอชนดตาง ๆ เขามาสนบสนน เชนCASE Tools และโปรแกรมภาษาทชวยสรางโคดโปรแกรม ชวยออกแบบหนาจอ เปนตน
RAD ยงมการพฒนาออกเปนรปแบบยอย ๆ ไดหลายแบบ เชน
- Phase development-based methodology
- Prototyping-based methodology
- Throw-away prototyping-based methodology
Phase development-based methodologyPlanning
AnalysisAnalysis
Design
Implementation
systemversion 1
Analysis
Design
Implementation
systemversion 2
ขอดของ Phased development-based
- ผใชสามารถใชงานระบบในสวนทตองการและจาเปนไดเรวกวา SSADM
ขอเสยของ Phased development-based
- ระบบทนามาใชอาจจะยงทางานไดไมครอบคลมระบบทงหมด
Prototyping-based methodology
Planning
Analysis
Design
Implementation
Systemprototype
Implementation
System
ขอดของ Prototype-based
- ใชเวลานอยในการพฒนา เพราะเปนการสรางตนแบบของงานกอน
- เหมาะกบระบบงานทมขนาดเลก
ขอเสยของ Prototype-based
- ขาดความรอบคอบในการพจารณาถงปญหาทจะเกดตามมาเมอใชงานระบบทงหมด เพราะยากตอการเรยนร
Throw-away prototyping-based methodology
Planning
Analysis
Design
Implementation
Designprototype
Implementation
System
AnalysisDesign
ขอดของ Throw-away Prototyping-based
- ชวยใหนกพฒนามนใจวาระบบทออกแบบตรงกบความตองการของผใช
- ลดความเสยงในการเกดความผดพลาด- มความนาเชอถอ
ขอเสยของ Throw-away Prototyping-based
- ใชระยะเวลาในการสรางระบบจรงนานกวาแบบ เพราะไมไดใชตนแบบมาทาระบบงาน
Object-Oriented Analysis and DesignMethodology
เปนการมองปญหาในรปของวตถทประกอบดวยขนตอนการทางานรวมกบขอมล ซงปจจบนใชมาตรฐานของแผนภาพสาหรบการวเคราะหและออกแบบคอ UML (UnifiedModeling Language)
3.3 หลกการพฒนาระบบ
1) คานงถงเจาของระบบและผใช2) พยายามเขาถงปญหาใหตรงจด3) กาหนดขนตอนการทางานหรอกจกรรม4) จดทาเอกสารประกอบทกขนตอน5) พจารณาความคมคาของการลงทน6) แตกระบบใหญใหเปนระบบยอย7) ออกแบบระบบเพอรองรบการเตบโต
และการเปลยนแปลงในอนาคต
ขนตอนตาง ๆ ของการพฒนาโครงงาน
1. Analysis and Planning
2. Designing and Producing
3. Content and Talent
4. Delivering
3.4 การพฒนาระบบมลตมเดย
Analysis and Planningการพฒนางานเปนการแบงขนตอนของ
การผลตงานมลตมเดย ออกเปนสวน ๆ โดยมเปาหมายเพอกาหนดตารางการดาเนนงานใหชดเจน
โดยกาหนดในรปของ project management ซงม tool สาหรบชวยสรางคอ Microsoft Project, Excel หรอ MacProject
แผนทสรางไดอาจอยในรปของ Gantt Chart ทจะใชในการชวยกาหนด เวลาสาหรบการทางานเกยวกบขาวสารตาง ๆ
สงจาเปนตาง ๆ ทตองใชกบงานมลตมเดยจะถกกาหนดในสวนน ซงไดแก
แหลงขอมล (resources) ฮารดแวรและซอฟตแวร แหลงทจะนาไปใชหรอกลมเปาหมาย(delivery platform and environment) กลมผสรางงาน (A Team) การคานวณเวลาทใชสาหรบแสดงงาน (Time Calculation)การประมาณคาใชจาย (Costing)
Building team
ในการสรางทมงานเพอสรางงานมลตมเดยจะเปนการนาบคคลหรอทมงานทมความสามารถและความถนดทแตกตางกน มารวมมอกนสรางงานอนประกอบดวยสอหลาย ๆ ชนดดงนน จาเปนทจะตองกาหนดความสามารถ
ของทมใหสอดคลองกบขนตอนยอย ๆ ของงานทกาหนดไวในแผนซงเครองมอทชวยในการกาหนดนน ไดแก การใชเมตรก หรอตารางบงชความชานาญของทม
Training(product)
Training(business)
Support materials
Performance Tools
Prototype
Advertising
Visual database
GU
Is
Document Designer
Project Manager
Graphic Artist
Illustrator
Authorware Specialist
Programmer
Sound Designer
= Area of expertise
ตวอยาง ตารางบงชความชานาญของทมในโครงงาน
การคานวณเวลา โดยใช calculation sheet
Photo CD ProjectAllocation of Disc Space
Note 1: The calculations are based upon the filesizes yielded by voice rendering of the Project’s English script.
Note 2: File sizes for base resolution images of 640x480 and 768x512 pixel dimensions are estimated at 768K each
การคานวณเวลา โดยใช calculation sheet (ตอ)
Note 3 : File sizes for full imagePacs may range from 3.7 MB to 4.5 MB depending upon image complexity and compression rates. The conservative figure of 4.5MB per imagePacis used in these estimates.
Summary : There is adequate room on the disc for both sound and images if each language recording is limited to no more than 9 mins.
File Duration File DurationSNDE01A 18.369 SNDE12A 14.314SNDE02A 9.180 SNDE13A 14.193SNDE03A 9.295 SNDE14A 7.487SNDE04A 17.609 SNDE15A 16.172SNDE05A 17.932 SNDE16A 19.450SNDE06A 11.156 SNDE17A 5.830SNDE07A 18.035 SNDE18A 21.443SNDE08A 8.050 SNDE19A 12.295SNDE09A 12.790 Total 284.924 SecondsSNDE10A 27.468 4.749 MinutesSNDE11A 23.856 Plus Intro Fanfare 30 Seconds
Task Planningเนองจากงานมลตมเดยจะประกอบดวย
งานยอยหลาย ๆ สวน ดงนนในการวางแผนงานยอยสามารถสรางออกมาในรปแบบของ ผง checklist ดงน
Design Instructional Framework Create Animators
Determine Delivery Platform Produce Audio
Draw Navigation Map Produce Video
Create Storyboards Program
Design Interface Test Functionality
Design Information Containers Fix Bugs
Use Test Create Graphics
การประมาณคาใชจาย (Costing)มกจะเขยนในรปของ Cost sheets ดงน
PROJECT DEVELOPMENT COSTS
Salaries Data Storage
Client Meetings Talent Fees
Acquisition of Content Video production
Travel Hardware/Software
Research Equipment Rental
PRODUCTION COSTS Studio Fees
Audio Production Talent Fees
Hardware/Software Location Fees
Studio Fees Digital Capture & Editing
Graphics Production TESTING COSTS
Salaries Salaries
Hardware/Software Focus Groups
Fees for Content Use Editing
Animation Beta Program
Content Gathering DISTRIBUTION COSTS
Salaries Documentation
Research Services Manufacturing
Licenses Advertising
Shipping
Designing and ProducingA number of features which are
desirable in a good design notation :
1. Ease of capture of design insights2. Ease and accuracy of communication3. Representational power4. Scalable precision of representation5. Preferably supporting both formal
and informal representations
Storyboards
เปนเครองมอทใชสาหรบการออกแบบ โดยเปนการวาดหรอรางรปแบบการนาเสนอ ในแตละสวนของงานมลตมเดย ซงการรางโครงรางนไมจาเปนตองลงรายละเอยดของงานแตตองระบตาแหนงของสวนประกอบตาง ๆทจะทาใหมองเหนภาพรวมของงานทจะเกดขน
ตวอยาง การเขยน Storyboards
P P P P P P
VIDEO
CONTROLS
GOOD EVER POOR
STANDARD CONTROLS
AA
SS
FF
ในการเขยน Storyboards จะเขยนเปน card ซงแตละใบจะแทนการวางรปแบบของจอภาพแตละสวน
Card 1
Title (use a gradient, clean type)
Menu, 5 buttons
Navigation bar quit, about
Card 2
Visual effects
Sample image for visual effects
Timing and speed controls
Card 3
Section title
Menu
Card 4
Sample image
Animation icon
Individual icons
การตกแตงงานมลตมเดย ควรจะพจารณาสงตอไปน
• Characteristics of human perception
• Principles of composition
• Resources for composition
Expectancy and pattern recognition operate together to produce highly selective perception.
The role of designer is to create interfaces that support effective perception by tuning in with these natural constructive processes. Screens with clear patterns that are consistentlyused enable us to perceive effectively quite complex information.
Principles of compositionการออกแบบงานบนเวบนนประกอบดวย
ขอความ รปภาพ เสยง และภาพเคลอนไหว ซงการทจะมผชานาญในทกสวนประกอบนนเปนไปไดยาก จงกลาวไดวา
Multimedia realization on Web is naturally a team process.
Each context involves the projection of the three functional domains : information, interaction and compositional framework.
Composition ประกอบดวย
unity, emphasize, harmony, balance and visual flow
Unity refers to the wholeness of the experience; all the elements forming theexperience should belong together.
The perception of unity derives from the conceptual design of the system.
Emphasize refers eminent point or impressive point for screen.
Harmony refers to how all the parts of the system fit together. Harmony is closely tied in with building and maintaining expectancies.
Balance is concerned with the visual“weight” given to each component and the distribution of these objects on thescreen.
Emphasize can make by
- Focus point
- Contrast
- Isolate
Focus point
Visual balance and imbalance
Variation in achieving visual balance
Resources of composition
Multimedia composition is not an abstract art. Composition principles aremapped using a set of tools onto thematerials available. There are a number of resources that may contribute to thedynamic process of multimedia composition.
These resources include :
• conceptual design structures• composition principles• specific guidelines • good examples• tools and associated libraries• experimentation and visualization
Graphic ApproachesThings that work : here are some graphical
approaches that get good resultsNeatly executed contrasts : big/small,heavy/light, bright/dark, thin/thick.Simple and clean screens with lots of white spaceEye-grabbers such as Initial Caps or a single brightly colored object alone on a gray-scale screenShadows and drop shadows in various shadesGradientsReversed graphics to emphasize important text or imagesShaded objects and text in 2-D and 3-D
Things to avoid : here are some mistakes to avoid in creating computer graphics
Clashes of colorBusy screensTrite humor in oft-repeated animationsClanging bells or squeaks when a button is clickedFrilly pattern bordersRequiring more than two button clicks to quitToo many numbersToo many substantive elements presented too quickly
Content and Talent
เนอหา ทจะนามาใชอาจมาจากproduced by members of the projectteamacquired from sources internally available to the teamacquired from the public domainacquired through clearance of copyright material
Acquiring ContentContent acquisition is one of the
most expensive and time-consuming tasks in organizing a multimedia project.
Using content created by others- preexisting content- copyrights- obtaining rights
Using content created for a projectเมอสรางงานแตละสวนแลวควรคานงถงลขสทธ
ของการนาไปใช รวมทงการเขยนขอตกลงรวมกนระหวางทมงาน เพอปองกนปญหาทอาจจะเกดขนหลงการเผยแพร
Using Talent- Locating the professionals your need- Working with union contracts- Acquiring releases
write release form grants to certain permissions and specifies the terms under which you can use the material.
DeliveringTest it, then test it again. Testing
is one of the major difficulties in the multimedia project. Its performancedepends on specific hardware and system configurations.
Thus, you have to control the end user’s platform, or must fully test yourproject on as many platforms as possible that is designed to be shown.
TestingAlpha testing
are typically for internal circulation only and are passed among a selected group of users. In the testing arena, learn to skillfully utilize friend and enemy alike.
Beta testingare sent to a wider but still select
audience with the same caveat. This group should be representative of real users, and should not include persons who have been involved in the project’s production. Its feedback is critical.
Polishing to gold debug process toward a final release.
Evaluationis interleaved throughout the
development process and will vary depending on the phase of the project life cycle.
Two types for evaluation :-formative and summative
Formative evaluationis carried out during the development
of the system. The information obtained is fed back to influence on-goingdevelopment.
Summative evaluationis conducted at the completion of
the system. It points whether the system has succeeded in its overall aim.
Both of two phases evaluate the effectiveness and usability of the system.
The effectiveness of the system depends on whether it achieves its learning objective.
Usability refers to the ease of learning and ease of use.
Evaluation methods yield two broad types of information – qualitative and quantitative.
Qualitative evaluation provides rich information that is especially useful for shaping design.
Quantitative information gives hardfigures based on systematic sampling. This provides a more objective measure, but may lack the richness of insight provided by qualitative information.
In many cases, a judicious mixture of the two types of information will provide the best overall insight.
However, there is no absolute criterionfor what counts as good evaluation.
Strategic views of evaluationObservation
In formative evaluation the user is observed working with prototypes of the system. The designer can checkwhether the user performs on the system as expected.
Observation methods- an informal way- a structured way
The main advantages of usingobservation for evaluation are :
- provides direct evidence of system effectiveness and usability
- is easy to use informally
- can be applied as a structured technique with sophisticated recording of behaviour
The disadvantages include :- the information provided relates to
surface behaviour- more sophisticated recording lead
to high transcription and analysis overheads
The most effective information is often obtained when observation is used in tandem with interviews.
Interviewsare a useful way to gain a rich
understanding of users’ reactions to a system. This information is particularlyimportant during formative evaluation.
In order to get the maximum benefit we should be clearly planned and may need to be linked to other forms of datacollection.
The strengths of interviews :
able to produce rich information onstudent reactions
easy to administer
very useful for formative evaluation
effective in conjunction with othermethods
The weaknesses of interviews :
the sample may be unrepresentative
the recording of interview data may be contaminated by subjective factors
the collation of results from several individuals to give a clear overall picture may be difficult
Questionnairesare useful in providing overview
information in a quantitative form. This technique is valuable for summative information.
Questions should be precise and unambiguous. Leading questions which point towards a certain answer must be avoided. An appropriate mix of question types should be included to suit the purpose of the questionnaire.
There are two broad types of questions – open and closed. Open questions ask respondents to express replies in their own words. (richer answers to more open questions)
A variety of forms of questions :- multiple choice- binary choice
We should set rating scales for choice or ranking questions in order to measure the results.
How often did you use the Help System in the package?
a) never
b) 1-3 times per week
c) 4-6 times per week
d) 7-9 times per week
e) 10 or more times per week
Question used to elicit information
How interesting is the system to use?
Very interesting Very boring
How well do you think you have understood the topics
covered in the system?
Very well Very poorly
Questions with a five point rating scale
The main advantages :are easy and economical to administer
support both open ended and closed questions
provide quantitative data
are comparatively easy to analyze
are valuable for summative evaluation
The limitations :
may provide surface level information only
do not normally reveal the reasons for the responses
the reporting of summary results may obscure variations within the
data
A number of factors influence the selection of evaluation methods :
1. The purpose of the project2. The stage in the project when
the evaluation occurs3. Cost-benefit considerations4. Appropriate mix of methods
Preparing for deliveryHow the end users can easily and
automatically set up your multimedia project on their computer.
“to provide good writtendocumentation”
README.TXT or ReadMeFirst is good thing to include on the distribution disk of project.
Compressing and joining FilesIf any project’s files is too large to
write an installation routine. We need to compress or pack that file sot that it will fit on the floppy.
File ArchivesShareware and commercial utility
programs for compressing anddecompressing files have been in wide use. We may download online file automatically by handle from installing project.
Delivery ScenariosA range of delivery scenarios
- a commercial published system- a specific organization- other scenarios, e.g. educational
systems developed through grant aid
Packing for delivery- Installation information and
utilities- End user guides
The delivery environment- the physical delivery environment- the organizational environment
- management support- local tutors and trainers- the end users
งานมลตมเดยตองอาศยเทคโนโลยฮารดแวรหลายอยางมาประยกตใชงานรวมกน เพอสรางสอทมความสมบรณแบบในการนาเสนอ โดยมองคประกอบตาง ๆ ไดแก
- เครองคอมพวเตอร- อปกรณแสดงภาพ- อปกรณเสยง- อปกรณสแกนภาพและขอความ- อปกรณจดเกบขอมล
3.5 ฮารดแวรสาหรบมลตมเดย
มองคประกอบพนฐาน 3 สวนคอหนวยประมวลผลกลาง หนวยความจาและ หนวยนาเขา/แสดงผล
หนวยความจา แบงออกเปน 2 ประเภทคอ- ROM (Read Only Memory)ไมสามารถเขยนขอมลลงไปได แตมขอด
คอ สามารถคงคางสถานะขอมลไวไดแมวาจะไมมไฟฟาไปเลยงระบบกตาม
เครองคอมพวเตอร
- RAM (Random Access Memory)เปนหนวยความจาชวคราว ขอมลจะถก
อานจากแหลงเกบขอมล เขามาท RAM แลวสงตอให CPU ทาการประมวลผล หรอเปนขอมลททาการประมวลผลแลว แตตองการนาขอมลไปประมวลผลอกครง
คณสมบตของ RAM คอตองมการทางานทรวดเรวเพอใหสอดคลองกบการทางานของ CPU ปจจบน RAM มอยหลายชนด เชน EDO RAM, SDRAM, DDR SDRAM เปนตน
RAM แบงเปนประเภทใหญ ๆ 2 ประเภท- DRAM : Dynamic RAMRAM จาเปนตองมไฟเลยงตลอดเวลา
และสาหรบ DRAM ตองมการ refresh ขอมลเปนระยะ ๆ เพอใหขอมลทเกบอยนนคงอย
- SRAM : Static RAMไมตองมการ refresh ขอมลและยงม
ความเรวในการเขาถงขอมลทสงกวา
หนวยนาเขาและแสดงผลI/O portถกใชงานดานมลตมเดยอยางมาก เพราะ
ตองนาขอมลเขาจากกลองดจตอลหรอวดโอ โดยการสงผานขอมลนนทาได 2 แบบ
การสงผานขอมลแบบขนาน (Parallel)
มความเรวในการสงขอมลสงแตกมความผดพลาดในการสงขอมลสงเชนกน พอรตแบบขนานเชน พอรตทใชเชอมตอระหวางคอมพวเตอรกบเครองพมพ เปนตน
การสงผานขอมลแบบอนกรม (Serial)
ในทนหมายถง RS-232 (Recommended Standard 232) ซงเปนมาตรฐานในการสงขอมลทถกกาหนดโดยองคกร Electronics Industries Association และตอมามการพฒนาเปน USB Port ทสามารถตอพวงได 127 อปกรณและม Bandwidth ท 1.5 Mbytes
- การดแสดงผลทาหนาทแปลงสญญาณดจตอลจากเครองคอมพวเตอรใหเปนสญญาณอนาลอก แลวทาการสงไปยงจอภาพเพอแสดงผล
- จอภาพจอภาพโมโนโครม (Monochrome
Display Adapter : MDA) ความละเอยด 720x350 pixels แสดงผลสเดยว
อปกรณแสดงภาพ
จอภาพซจเอ (Color Graphics Adapter : CGA) มการนาเอา RAM มาใชในการเกบขอมลสเรยกวา Video RAM
จอภาพอซด (Enhanced Color Display : ECD) มความละเอยดสงขนและมการเกบขอมลสไดมากขน
จอภาพวจเอ (Video Graphics Adapter : VGA) มความสามารถในการแสดงภาพไดชดเจนและสมจรงมากขน รวมทงไดภาพทมคณภาพดกวาเดม
จอภาพวจเอ แบงเปน 2 ประเภทคอจอภาพแบบ CRT (Cathode Ray Tube) มลกษณะเชนเดยวกบจอโทรทศน ซง ประกอบดวย หลอดจอภาพเปนแกวขนาดใหญ เรยกวา Cathode Ray Tube หรอหลอดรงสคาโธด สวนหนาสดของจอเรยกวา สกรน (Screen) สกรนประกอบดวยจดเลก ๆ เรยง
ตอเนองกนเปนแถวตามแนวนอนจนเตม โดยจดเหลานเรยกวา Pixel (Picture Element)
จอภาพแบบ LCD (Liquid Crystal Display) มลกษณะเดนคอมความบางและเบามากกวาจอแบบ CRT เชน จอภาพของเครองคดเลข PDA เปนตน โดยจอภาพประเภทนจะใช liquid crystal ซงเปนโมเลกลชนดพเศษเมอถกกระแสไฟฟาไหลผาน โมเลกลกจะหมนเปนองศาทแตกตางกน โดยขนอยกบขนาดของ voltage ของกระแสไฟทไหลผาน ทาใหคลนแสงบางสวนถกกกไว และบางสวนสามารถผานออกไปได จงเกดเปนรปภาพทแสดงบนหนาจอ
- เครองพมพเครองพมพแบบวงลอเครองพมพแบบหวเขมเครองพมพแบบพนละอองหมกเครองพมพแบบเลเซอรพลอตเตอร
- พลอตเตอรแบบดรม เปนพลอตเตอรแบบทรงกระบอก ทมการเคลอนททงปากกาและแทนรองกระดาษ
- พลอตเตอรแบบระนาบ จะเคลอนทเฉพาะปากกาเทานน
- พลอตเตอรแบบอเลกโทรสแตตก เปนพลอตเตอรทใชในการสรางภาพคราว ๆ เพอตรวจสอบ
- การดเสยง• Sound on board• Individual card
- ลาโพงตองมคณสมบตปองกนสนามแมเหลก เพอ
กนสนามแมเหลกจากลาโพงไมใหไปรบกวนการทางานของจอภาพ ซงอาจทาใหการแสดงผลทางจอภาพผดพลาดและอาจทาใหจอภาพเสยหายได
- หฟง- ไมโครโฟน
อปกรณเสยง
- สแกนเนอร• สแกนเนอรมอถอ (Hand-held scanner)• สแกนเนอรแบบดงกระดาษ (Sheet-fed scanner)• สแกนเนอรแบบราบ (Flatbed scanner)
- กลองดจตอลนาเขาขอมลทเปนภาพนง และภาพวดโอ
แลวทาการบนทกในรปแบบของสญญาณดจตอลลงหนวยจดเกบขอมลแทนการบนทกลงฟลม
อปกรณนาภาพเขา
- อปกรณทใชเทคโนโลยสนามแมเหลก
• ฮารดดสก แบงออกเปน 3 ประเภท- ไอดอ (IDE) ฮารดดสกรนเกามความเรวในการ
เขาถงขอมลชา ความจนอย- อ-ไอดอ (E-IDE) หรอ Ultra DMA-33 หรอ
Ultra DMA-66 มความเรวในการเขาถงขอมลมากขนและมความจมากขน สามารถเชอมตอฮารดดสกไดถง 4 ตวในเครองเดยวกน
- สกดซ (SCSI) มความเรวสง ทนทาน สามารถเชอมตอฮารดดสกไดถง 7 ตว
อปกรณจดเกบขอมล
• เทปแมเหลก
นยมใชกบเครองขนาดกลางถงขนาดใหญ มลกษณะเปนสายเทปแบบมวนหรอแบบตลบ ขอจากดของเทปแมเหลก
- ตองเรมอานขอมลตงแตตนมวน- ตองระวงในการจบถอ รอยนวมอ สงสกปรก- สถานทเกบตองเหมาะสม ตองระวงเรองฝน อณหภม และสนามแมเหลก
- ตองระวงการลบขอมลผดพลาด- การเขยนโปรแกรมควบคมเทปยงยาก
- อปกรณทใชเทคโนโลยแสงไดแก ซดรอม (CD-ROM : Compact Disk
Read Only Memory) ใชหลกของแสงในการอานและบนทกขอมล เหมาะสาหรบขอมลทไมตองการเปลยนแปลง การอานขอมลจะตองมตวอานขอมลเชนเดยวกบ
แผนดสกเกต
- อปกรณทใชเทคโนโลยอเลกทรอนกสไดแก RAM และ ROM และอปกรณตาง ๆ ทอยใน
รปของ chip เชน PROM EPROM EEPROM และ Flash Memory
อปกรณจดเกบขอมล (ตอ)
- อปกรณจดเกบขอมลสาหรบระบบเครอขาย
RAID : Redundant Array of Independent Disks เปนอปกรณทมลกษณะการเกบขอมลเหมอนกบฮารดดสกแตมขนาดใหญกวา
MO : Magneto-Optical Storage เปนอปกรณจดเกบขอมลทมลกษณะการทางานคลายกบตเพลงขนาดใหญ จะมแผนสารหบจดเกบขอมลเรยกวา MO Discs ซงสามารถบรรจใน MO Storage ไดตงแต 20 ถง 500 แผน
อปกรณจดเกบขอมล (ตอ)
DVD Tower และ CD-ROM Tower ประกอบดวยถาดสาหรบใสแผนดสกคลายกบเครองเลน CD-ROM มความสามารถในการสลบการทางานของแผนดสกแตละแผนไดโดยอตโนมต และยงมความสามารถในการอานและเขยนขอมลลงบนแผนดสกได
อปกรณจดเกบขอมล (ตอ)
สวนประกอบพนฐานทสาคญของเทคโนโลยเครอขาย
1) ชนดของเครอขายคอมพวเตอร2) เทคโนโลยคอมพวเตอรทใชในการเชอมตอ
ชนดของเครอขายคอมพวเตอร แบงเปน 3 ลกษณะ ไดแก
- เครอขายงานบรเวณกวาง (WAN: Wide Area Network)สวนใหญเปนเครอขายสาธารณะทใชในการ
สอสารผานดาวเทยม เชน ISDN, ATM เปนตน
3.6 เทคโนโลยเครอขาย
- เครอขายระดบภมภาค (MAN: Metropolitan Area Network)จะมระยะทางประมาณ 50 กม. มความเรซใน
การสงขอมลประมาณ 20 Mbps เชน การเผยแพรขอมลภาพดวยระบบเคเบลทว การสงขอมลดวยคลนวทย
- เครอขายระดบทองถน(LAN : Local Area Network)เปนระบบเครอขายทเชอมโยงคอมพวเตอร
ขนาดจากบความเรวในการสงขอมล 10-100Mbps การดแลรกษางายและมขอผดพลาดนอย
เครอขายระดบทองถน แบงตามลกษณะทางกายภาพได 2 ชนด
1) อเทอรเนต (Ethernet) ไดรบการพฒนาตงแตป 2518 โดยบรษท XEROX และบรษท Digital Equipment Corporation การเชอมโยงคอมพวเตอรเปนแบบลกษณะเสนตรง
2) โทเคนรง (Token Ring)ไดรบการพฒนาในป 2528 โดยบรษท IBM และบรษท Texas Instruments ซงการถายทอดสญญาณมความแมนยาและมความนาเชอถอสงกวาอเทอรเนต การเชอมโยงเปนแบบวงแหวน
เครอขายระดบทองถน แบงตามลกษณะทางทางานได 2 ชนด
1) Peer-to-peerเปนระบบทเครองแตละเครองจะแบงทรพยากรตาง ๆ เพอใชกนภายในเนตเวรคได เชน ไฟลเครองพมพ แตมกทากนในระบบทมขนาดเลก
2) Client-serverเปนระบบทเครองหนงตอเขากบคอมพวเตอรอกเครองหนงเปนอยางนอย และใชระบบปฏบตการทเปนเนตเวรคโดยเฉพาะ
อนเทอรเนต คอระบบเครอขายของเครอขาย เปนการนา
เครอขายทองถนหลาย ๆ เครอขายมาเชอมตอเขาดวยกน จนกลายเปนระบบเครอขายขนาดใหญหรอเรยกไดวาเปนเครอขายสากล โดยใชโปรโตคอล TCP/IP เปนสอกลางสาหรบเชอมโยงและแลกเปลยนขอมลขาวสารระหวางกนเหมอนเสนใยแมงมม
3.7 User3.7 User--Interface DesignInterface Design
1) Tip and Techniques2) User Interface design principles
Tip and TechniquesThe following tips should prove valuable
- Consistency
The most important thing we can possibly do is ensure our user interface works consistently. Consistency in user interface enables our users to build an accurate mental model of the way it works, and accurate mental models lead to lower training and support costs.
- Set standards and stick to them
The only way we can ensure consistency within our application is to set user interface design standards, and then stick to them.
- Be prepared to hold the line
When we are developing the user interface for our system, we will discover that our stakeholders often have some unusual ideas as to how the user interface should be developed. We should definitely listen to these ideas but we also need to make our stakeholders aware of our corporate UI standards and the need to conform to them.
- Explain the rules
Our users need to know how to work with the application we built for them. When an application works consistently, it means we only have to explain the rules once.
This is a lot easier than explaining in detail exactly how to use each feature in an application step by step.
- Navigation between major user interface items is important
If it is difficult to get from one screen to another, then our users will quickly become frustrated and give up. When the flow between screens matches the flow of the work the user is trying to accomplish, then our application will make sense to users.
- Navigation within a screen is important
In western societies, people read left to right and top to bottom thus we should design screens follow this. We want to organize navigation between widgets on our screen in a manner users will find familiar to them.
- Word our messages and labels effectively
The text we display on our screens is a primary source of information for our users. If our text is worded poorly, then our interface will be perceived poorly by users. Using full words and sentences makes easier to understand.
Messages should be worded positively, imply that the user is in control, and provide insight into how to use the application properly.
- Understand the UI widgets
We should use the right widget for the right task, helping to increase the consistency in our application and probably making it easier to build the application in the first place. The only way for learning how to use widgets properly is to read and understand the user interface standards and guidelines our organization has adopted.
- Look at other applications with a grain of salt
Unless we know another application has been verified to follow the user interface-standards and guidelines of organization, don’t assume the application is doing things right. Although looking at the work of others to get ideas is always a good idea, until we know how to distinguish between good user interface design and bad user interface design, we must be careful.
Too many developers make the mistake of imitating the user interface of poorly designed software.
- Use color appropriately
Color should be used sparingly in applications and must also use a secondary indicator. The problem is that some of users may be color blind and if we are using color to highlight something on a screen, then we needto do something else to make it stand out if we want these people to notice it. we also want to use colors in our application consistency, so we have a common look and feel throughout our application.
- Follow the contrast rule
If we are going to use color in application, we need to ensure that our screens are still readable. The best way to do this is to Follow the contrast rule : Use dark text on light backgrounds and light text on dark backgrounds. Reading blue text on a white background is easy; but reading blue text on a red background is difficult. The problem is not enough contrast exists between blue and red to make it easy to read, whereas there is a lot of contrast between blue and white.
- Align fields effectively
When a screen has more than one editing field, we want to organize the fields in a way that is both visually appealing and efficient. The best way to do is to left-justify edit fields : in other words, make the left-hand side of each edit field line up in a straight line, one over the other.
The corresponding labels should be right-justified and placed immediately beside the field. This is a clean and efficient way to organize the fields on a screen.
- Expect your users to make mistakes
How many times have you accidentally deleted some text in one of our files or in the file itself? Were we able to recover from these mistakes or were we forced to redo hours, or even days, of work? The reality is that to err is human, so we should design our user interface to recover from mistakes made by our users.
- Justify data appropriately
For columns of data, common practice is to right-justify integers, decimal align floating-point numbers, and to left-justify strings.
- Our design should be intuitable
If our users don’t know how to use our software, they should be able to determine how to use it by making educated guesses. Even when the guesses are wrong, our system should provide reasonable results from which users can readily understand and ideally learn.
- Don’t create busy user interfaces
Crowded screens are difficult to understand and, hence, are difficult to use.
Experimental results show that the overall density of the screen should not exceed 40 percent, whereas local density within groupings should not exceed 62 percent.
- Group things effectively
Items that are logically connected should be grouped together on the screen to communicate they are connected, whereas items that have nothing to do with each other should be separated. We can use white space between collections of items to group them and/or we can put boxes around them to accomplish the same thing.
- Take an evolutionary approach
Techniques such as user interface prototyping and Agile Model Driven Development (AMDD) are critical to our success as a developer
User Interface design principles
The fundamental principles for designing user interfaces
- The principle of user profiling
Know who our user is.
A design that is better for a technically skilled user might not be better for a non-technical businessman or an artist.
- What are the user’s goals- What are the user’s skills and experience- What are the user’s needs
- The principle of metaphor
Borrow behaviors from systems familiar to our users.
Frequently a complex software system can be understood more easily if the user interface is depicted in a way that resembles some commonplace system. The ubiquitous “Desktop metaphor” is an overused and trite example. Another is the tape deck metaphor seen on many audio and video player programs. This concept of “extendibility” is what distinguishes a powerful metaphor from a weak one.
There are several factors to consider when using a metaphor :
- Once a metaphor is chosen, it should be spread widely throughout the interface, rather than used once at a specific point
- There’s no reason why an application cannot incorporate several different metaphors, as long as they don’t clash
- Metaphor isn’t always necessary.- Incorporating a metaphor is not without
certain risks.- Be aware that some metaphors don’t cross
cultural boundaries well.
- The principle of feature exposure
Let the user see clearly what functions are available
Software developers tend to have little difficulty keeping large, complex mental models in their heads. But not everyone prefers to “live in their heads”, instead, they prefer to concentrate on analyzing the sensory details of their environment, rather than spending large amounts of time refining and perfecting abstract models.
Both type of personality (Intuitive and Sensable) can be equally intelligent, but focus on different aspects of life. It is to be noted that according to some psychological studies “Sensables” outnumber “Intuitives” in the general population by about three to one.
Intuitives prefer user interfaces that utilize the power of abstract models – command lines, scripts, plug-ins, macros, etc. Sensables prefer user interfaces that utilize their perceptual abilities – in other words, they like interfaces where the features are “up front” and “in their face”. Toolbars and dialog boxed are an example of interfaces that are pleasing to this personality type.
Here’s a partial list of them in order from most exposed to least exposed :
• Toolbar (completely exposed)• Menu item (exposed by trivial user gesture)• Submenu item (exposed by somewhat more involved user gesture)• Dialog box (exposed by explicit user command)• Secondary dialog box (invoked by button in first dialog box)• “Advanced user mode” controls --exposed when user selects “advanced” option• Scripted functions
- The principle of coherence
The behavior of the program should be internally and externally consistent
Coherent literally means “stick together”
Internal consistency means that the program’s behaviors make “sense” with respect to other parts of the program.
External consistency means that the program is consistent with the environment in which it runs. This includes consistency with both the operating system and the typical suite of applications that run within that operating system.
- The principle of state visualization
Changes in behavior should be reflected in the appearance of the program
Each change in the behavior of the program should be accompanied by a corresponding change in the appearance of the interface. One of the big criticisms of “modes” in interfaces is that many of the classic “bad example”programs have modes that are visually indistinguishable from one another.
- The principle of shortcuts
Provide both concrete and abstract ways of getting a task done
Once a user has become experienced with an application, he will start to build a mental model of that application. He will be able to predict with high accuracy what the results of any particular user gesture will be in any given context.
At this point, the program’s attempts to make things “easy” by breaking up complex actions into simple steps may seem cumbersome. Additionally, as this mental model grows, there will be less and less need to look at the “in your face” exposure of the application’s feature set. Instead pre-memorized shortcuts should be available to allow rapid access to more powerful functions.
There can also be alternate methods of invoking commands that are designed to increase power rather than to accelerate speed. A “recordable macro” facility is one of these, as is a regular expression search and replace.
- The principle of focus
Some aspects of the UI attract more than others do
The human eye is a highly non-linear device. Our eyes are drawn to animated areas of the display more readily than static areas. Changes to these areas will be noticed readily. The mouse cursor is probably the most intensely observed object on the screen – it’s not only a moving object, but mouse users quickly acquire the habit of tracking it with their eyes in order to navigate.
- The principle of grammar
A user interface is a kind of language – know what the rules are
Many of the operations within a user interface require both a subject and a verb. This naturally suggests that actions in the user interface form a kind of grammar.
The two most common grammars are known as “Action -> Object” and “Object -> Action”.
“Action -> Object” is known as “modality”because the tool selection is a “mode” which changes the operation of the program.
“Object -> Action” case, the object is selected first and persists from one operation to the next. Individual actions are then chosen which operate on the currently selected object or objects. This is the method seen in most word processors – first a range of text is selected, and then a text style such as bold, italic, or a font change can be selected.
“Object -> Action” has been called “non-modal” because all behaviors that can be applied to the object are always available. One powerful type of them is called “direct manipulation” , where the object itself is a kind of tool.
- The principle of help
Understand the different kinds of help a user needs
Five basic types of help is correspond to the fie basic questions that users ask :
1) Goal-oriented :“What kinds of things can I do with this
program?”2) Descriptive :
“What is this? What does this do?”3) Procedural :
“How do I do this?”
4) Interpretive :“Why did this happen?”
5) Navigational :“Where am I?”
The essay goes on to describe in detail the different strategies for answering these questions, and shows how each of these questions requires a different sort of help interface in order for the user to be able to adequately phrase the question to the application.
- The principle of safety
Let the user develop confidence by providing a safety net
Each human mind has an “envelope of risk”, that is to say a minimum and maximum range of risk levels which they find comfortable. A person who finds herself in a situation that is too risky for her comfort will generally take steps to reduce that risk.
This comfort envelope varies for different people and in different situations. In the case of computer interfaces, a level of risk that is comfortable for a novice user might make a “power-user” feel uncomfortably swaddled in safety. It’s important for new users that they feel safe. At the same time, an expert user must be able to use the program as a virtuoso.
- The principle of context
Limit user activity to one well-defined context unless there’s a good reason not to
Each user action takes place within a given context – the current document, the current selection, the current dialog box. A set of operations that is valid in one context may not be valid in another. Even within a single document, there may be multiple levels.
- The principle of aesthetics
Create a program of beauty
It’s not necessary that each program be a visual work of art. But it’s important that it not be ugly.
Another area of aesthetics to consider is the temporal dimension. Users don’t like using programs that feel sluggish or slow. There are many tricks that can be used to make a slow program “feel” snappy, such as the use of off-screen bitmaps for rendering, which can then be blitted forward in a single operation.
- The principle of user testing
Recruit help in spotting the inevitable defects in your design
In many cases a good software designer can spot fundamental defects in a user interface. However, there are many kinds of defects which are not so easy to spot, and in fact an experienced software designer is often less capable of spotting them than the average person. In other cases, a bug can only be detected while watching someone else use the program.
User-interface testing can be summarized in the following steps :• Set up the observation.• Describe to the user the purpose of the observation.• Talk about and demonstrate the equipment in the room.• Explain how to “think aloud”.• Explain that you will not provide help.• Describe the tasks and introduce the product.• Ask if there are any questions before you start; then begin the observation.• Conclude the observation. • Use the results.
- The principle of humility
Listen to what ordinary people have to say
It’s important to realize that each of us, user and developer, has only part of the picture. The ideal is to take a lot of user opinions, plus our insights as a developer and reduce them into an elegant and seamless whole -- a design which, though it may not satisfy everyone, will satisfy the greatest needs of the greatest number of people.
Some things designers should keep in mind about their users :• Most people have a biased idea as to the what the “average” person is like. • Most people have some sort of core competancy, and can be expected to perform well within that domain.• The skill of using a computer (Computer literacy) is actually much harder than it appears.• The lack of computer literacy is not an indication of a lack of basic intelligence.• A high proportion of programmers are introverts, compared to the general population.
148
ความเปนมาของอนเทอรเนต1969 ระบบเครอขายของหนวยงานทหาร
ARPANET กอตงโดยกระทรวงกลาโหม(DOD = US Department Of Defense) และองคการปองกนประเทศของสหรฐอเมรกา
(APRA = Armed-Forces Research ProjectAgency)
1983 ARPANET is split into INTERNET and MILNET
149
1985 BITNET is completed (จดตงโดย Cuny’snetwork including Canadian universities)
1986 NSFNET is created by the National Science Foundation for leading U.S.universities and government agencies
1988 NSF installs high speed backbone andconnects thirteen regional internet networks
1990s Commercial networks begin connecting to internet
ความเปนมาของอนเทอรเนต
- IP network number/IP addressเปนเลขรหสประจาตวคอมพวเตอรทตอเขากบ
เครอขายอนเทอรเนตซงประกอบดวยเลข 4 ชด ชดละ 8 บต นนคอแตละชดเปนเลขตงแต 0 ถง 255 โดยทแตละชดคนดวยเครองหมายจด เชน 10.133.238.40
1 byte 1 byte 1 byte1 byte
IP มคาจาก 000.000.000.000 ถง 255.255.255.255
มลตมเดยบนระบบเครอขาย
Protocol คอระเบยบวธการในการตดตอสอสาร เมอนามาใชกบเทคโนโลยสอสารโทรคมนาคม จงหมายถงขนตอนการตดตอสอสาร กฎ ระเบยบ และขอกาหนดตาง ๆ รวมถงมาตรฐานทใชเพอใหสามารถสงผานขอมลไปยงปลายทางไดอยางถกตอง
- DNS servers
เนองจากเลข IP address นนจดจายาก ทาใหมการทาระบบชอคอมพวเตอรมาตรฐานในเครอขายอนเทอรเนตเรยกวา Domain Name System ซงประกอบดวยชอเครองคอมพวเตอร ชอเครอขายทองถน ชอสบโดเมน และชอโดเมน โดยกาหนดใหสอดคลองและสมพนธกนกบ IPaddress
ตวอยางการแสดงชอ IP และชอ DNS ทสอดคลองกน
192.133.10.1
chulkn.chula.ac.th
IP address
ชอโดเมนชอคอมพวเตอร
ชอเครอขายทองถน ชอสบโดเมน
โปรโตคอลทใชกบมลตมเดย
ทนยมใชกนมอย 2 ชนดไดแก HTTP และ RTSP
HTTP (Hypertext Transfer Protocol)เปนโปรโตคอลมาตรฐานทใชแลกเปลยนขอมลระหวาง
ฝงเซรฟเวอรและไคลเอนต บนเครอขายเวลดไวดเวบ มกลไกการทางานทไมสลบซบซอนและประมวลผลไดอยางรวดเรว สามารถสนบสนนและรองรบขอมลไดเกอบทกแบบไมวาจะเปนขอมลทเขารหสแบบ MIME หรอขอมลทเปนกราฟก
RTSP (Real Time Streaming Protocol)เปนโปรโตคอลมาตรฐานทใชแลกเปลยนขอมลแบบ
สตรมมงมเดย ผานทางเครอขายอนเทอรเนต โดยมสวนประกอบหลกสาคญ 3 สวนไดแก 1) สวนของเครองเขารหส (Encoder)2) เครองผชม (Player)3) เครองเซรฟเวอร (Server)
หลกการทางานเรมจากเครองเขารหสซงอาจเปนไดทงซอฟตแวรหรอฮารดแวรทเปนการด จากนนกจะทาการตรวจจบขอมลแลวทาการแกไขใหอยในรปแบบของไฟลทเหมาะสม แลวจงทาการเขารหสเพอลดขนาดของไฟลและแปลงใหอยในรปของสตรมมงมเดย จากนนจดเกบไวทเซรฟเวอร กอนทจะนามาเผยแพรทางอนเทอรเนต