SlideShare une entreprise Scribd logo
1  sur  39
 Text Book:
 The essential guide to user interface design, Wilbert O
Galitz, Wiley DreamaTech.
 Reference Books:
 Ben Sheiderman, “Design the User Interface”, Pearson
Education, 1998.
 Alan Cooper, ”The Essential of User Interface Design”,
Wiley- Dream Tech Ltd.,2002
 To study the concept of menus, windows, interfaces.
 To study about business functions.
 To study the characteristics and components of
windows and the various controls for the windows.
 To study about various problems in window design
with text, graphics.
 To study the testing methods.
 The Students should be able to:
 Design the User Interface, design, menu creation,
windows creation and connection between menus
and windows.
 SYLLABUS
 What is User Interface?
 What is Human Computer Interaction (HCI)
alternatively Man–Machine Interaction (MMI) or
Computer–Human Interaction (CHI).
 It is the study of interaction between people
(USERS) and COMPUTERS.
 The user interface is the part of a computer and its
software that people can see, hear, touch, talk to, or
otherwise understand or direct.
 User interface design is a subset of a field of study
called human-computer interaction (HCI).
 Human-computer interaction is the study, planning, and
design of how people and computers work together so
that a person’s needs are satisfied in the most effective
way.
 UID designers must consider a variety of factors:
◦ what people want and expect.
◦ physical limitations and abilities people possess.
◦ how information processing systems work.
◦ what people find enjoyable and attractive.
◦ Technical characteristics and limitations of the computer
hardware and software must also be considered.
 The user interface is the most important part of
any computer system. Why?
 Software is a logical entity. It cannot be seen,
touched, heard or felt.
 The only way by which we can realize software is
through UI.
 It is the system to most users.
 The user interface has essentially two components:
 input and output.
 Input is how a person communicates his or her needs or desires
to the computer.
◦ Some common input components are the keyboard, mouse, trackball,
one’s finger, and one’s voice.
 Output is how the computer conveys the results of its
computations and requirements to the user.
◦ Today, the most common computer output mechanism is the display
screen, followed by mechanisms that take advantage of a person’s
auditory capabilities: voice and sound.
 Proper interface design will provide a mix of well-
designed input and output mechanisms that satisfy the
user's needs, capabilities, and limitations in the most
effective way possible.
 The best interface is one that it not noticed, one that
permits the user to focus on the information and task at
hand, not the mechanisms used to present the
information and perform the task.
With today's technology and tools, and our
motivation to create really effective and usable
interfaces and screens, why do we continue to
produce systems that are inefficient and confusing or,
at worst, just plain unusable? Is it because:
 We don't care?
 We don't possess common sense?
 We don't have the time?
 We still don't know what really makes good design?
 A design is said to be good if it consists of a
combination of well designed input and output
procedures which fulfils the user's requirements in a
successful manner.
 A good design is one which possesses the following
features.
◦ It allows its users to focus on the data and activity.
◦ It provides data to its users for performing their activities
without using any specific procedures.
 The interaction design means designing interactive
products to support people in their everyday and
working lives.
 A good-designed interface is very useful to its users for
analyzing the performance of a system.
 It is a component that displays several complex
activities given to the system.
 A window's layout and looks does leave an impact on
the users.
 If the design is very complex, confusing and not sufficient enough then
the persons will face problems at their work and commit more mistakes.
 Improper designing may develop frustration in people towards the
system and they may stop using it.
 Several health problems may also arise like the people become
aggressive, stressful when they do not get what they expect from the
system, quickly and accurately.
 The most important benefit is that a good design increases the manufacturing rate of
the product and its demand in the market by the users.
 A researcher tried to enhance screen clarity and readability by reducing the
elements on the screen. Hence, the distinct objects which had been put on the same
display line to conserve area, were placed on different lines accounted for twenty
percent increase in the screen users. This is due to the reduction of elements on the
screen and better clarity. Productivity increased by 20%
 Some researchers manipulated the sequence of screens and which enabled the users to
compute the transactions in twenty-five percent less time and with twenty-five percent
less errors in contrast to those who used original screens.
A SYSTEM REQUIRING 4.8 MILLION SCREENS PER YEAR, IF WE MAKE SCREENS WITH WEAK CLARITY THIS
CAUSES THE USERS TO SPEND ONE EXTRA SECOND PER SCREEN. THIS MAY TEND TO DECREASE THE
SCREEN USAGE. HENCE WE SHOULD IMPROVE THE CLARITY OF THE SCREEN WHILE DESIGNING.
 Good designing principles caused the users to take quick decisions.
 The correct layout of data on screens increases performance and
reduces the expenses of the company during its usage.
 Good designing minimizes the training costs due to less training
time.
 A good design leads to great user satisfaction as stress, frustration
and anger are reduced.
 The rate of customers increases due to the satisfactory service
provided to them by a good design interface.
 The economical advantage of good design is that it saves a great
amount of money by fixing the errors during the design process
itself rather than fixing them after the product's release.
 The need for people to communicate with each other has existed
since we first walked upon this planet.
 The lowest and most common level of communication modes we
share are movements and gestures.
◦ Movements and gestures are language independent, that is, they permit
people who do not speak the same language to deal with one another.
 The next higher level, in terms of universality and complexity, is
spoken language.
◦ Most people can speak one language, some two or more. A spoken language
is a very efficient mode of communication if both parties to the
communication understand it.
 At the third and highest level of complexity is
written language. While most people speak, not
all can write.
◦ But for those who can, writing is still nowhere near as efficient a
means of communication as speaking.
 In modem times, we have the typewriter, another
step upward in communication complexity.
◦ Significantly fewer people type than write. Spoken language, however,
is still more efficient than typing, regardless' of typing skill level.
 Through its first few decades, a computer's ability to deal with human
communication was inversely related to what was easy for people to do.
 The computer demanded rigid, typed input through a keyboard; people responded
slowly using this device and with varying degrees of skill.
 The human-computer dialog reflected the computer's preferences, consisting of one
style or a combination of styles using keyboards, commonly referred to as
Command Language, Question and Answer, Menu selection, Function Key
Selection, and Form Fill-In.
 Throughout the computer's history, designers have been
developing, with varying degrees of success, other human-
computer interaction methods that utilize more general,
widespread, and easier-to-learn capabilities: voice and
handwriting.
 Systems that recognize human speech and handwriting now
exist, although they still lack the universality and richness of
typed input.
 The Xerox systems, Altus and STAR, introduced the mouse and pointing
and selecting as the primary human-computer communication method.
 The user simply pointed at the screen, using the mouse as an
intermediary.
 Ivan Sutherland at the Massachusetts Institute of Technology (MIT) is
given credit for first introducing graphics with his Sketchpad program in
1963. Lines, circles, and points could be drawn on a screen using a light
pen.
 Xerox worked on developing handheld pointing devices in the 1960s and
patented a mouse with wheels in 1970.
 In 1974, Xerox patented today’s ball mouse, after a researcher was
suddenly inspired to turn a track ball upside down.
 Initially, the cathode ray tube was used in screen designing.
 In the 1970s, IBM launched its 3270 cathode ray tube text-
based terminal.
 The 3270 was used in large number of ways in offices and
companies for good screen designing.
 During the 1970s less number of guidelines were available
for designing.
 Designing was implemented using hardware and telephone
line transmission issues.
 The 1970s screen contained several domains with unclear and
unintelligible headings.
 The screen was not properly ordered and had a command area that
required an information to the filled and memorized by the user.
 A reference to a manual was needed for understanding the unclear
messages displayed on the screen.
 The screens displayed green text on black background, thus
restricted to monochrome.
 Therefore the screen of the 1970s needed huge amount of toleration
and exercise by the users in order to extract the best from the
screen.
 In the 1980s a wide variety of design guidelines were launched
in the market for designing screens.
 The appearances of screens were made very clear by arranging
and ordering the elements.
 An assistance to the user was provided by giving clear and
useful headings for the areas on the screen. Also the
commands were listed nicely and were applied by function
keys.
 Messages could be easily interpreted but the screen elements
were not completely ordered.
 The screens contained instructions and reminders as prompts
for the users. Certain codes like PR, ST, FU, MD were presented
on the screen to help the users in selection.
 In the 1990s the introduction of graphics contributed a lot
in screen designing.
 A long with arranging and ordering the elements, borders
were also included to usually enhance groupings.
 The commands were now handled by buttons and menus
rather than function keys.
 Elements had numerous features such as a variety of font
sizes, styles, line thickness and colors.
 List-boxes, drop-down combination boxes, spin-boxes
were used for making entries.
 The users did not need to memorize anything as everything
was listed in the controls provided on the screen.
 The codes were removed from the screen and new listing
control was inscribed.
The User Interface-Introduction .ppt

Contenu connexe

Similaire à The User Interface-Introduction .ppt

Chapter 1 id2e_slides
Chapter 1 id2e_slidesChapter 1 id2e_slides
Chapter 1 id2e_slidesoopscrash1
 
Running head SOFTWARE ANALYSIS CONTROL1SOFTWARE ANALYSIS CON.docx
Running head SOFTWARE ANALYSIS CONTROL1SOFTWARE ANALYSIS CON.docxRunning head SOFTWARE ANALYSIS CONTROL1SOFTWARE ANALYSIS CON.docx
Running head SOFTWARE ANALYSIS CONTROL1SOFTWARE ANALYSIS CON.docxtoltonkendal
 
Topic 3 Human Computer Interaction
Topic 3 Human Computer InteractionTopic 3 Human Computer Interaction
Topic 3 Human Computer Interactionnur ezzaty
 
User Interface Analysis and Design
User Interface Analysis and DesignUser Interface Analysis and Design
User Interface Analysis and Design Saqib Raza
 
Introduction To Usability
Introduction To UsabilityIntroduction To Usability
Introduction To UsabilityOvidiu Von M
 
Hci lec 1 & 2
Hci lec 1 & 2Hci lec 1 & 2
Hci lec 1 & 2Anwal Mirza
 
ICT203 Human Computer Interaction.docx
ICT203 Human Computer Interaction.docxICT203 Human Computer Interaction.docx
ICT203 Human Computer Interaction.docxwrite4
 
UI UX design.docx
UI UX design.docxUI UX design.docx
UI UX design.docxRiniyaMary
 
Game interface design part 1
Game interface design part 1Game interface design part 1
Game interface design part 1Durgesh Pandey
 
Game Design 2: Lecture 10 - UI Layout
Game Design 2: Lecture 10 - UI LayoutGame Design 2: Lecture 10 - UI Layout
Game Design 2: Lecture 10 - UI LayoutDavid Farrell
 

Similaire à The User Interface-Introduction .ppt (20)

Chapter 1 id2e_slides
Chapter 1 id2e_slidesChapter 1 id2e_slides
Chapter 1 id2e_slides
 
HCI Presentation
HCI PresentationHCI Presentation
HCI Presentation
 
14 585
14 58514 585
14 585
 
Running head SOFTWARE ANALYSIS CONTROL1SOFTWARE ANALYSIS CON.docx
Running head SOFTWARE ANALYSIS CONTROL1SOFTWARE ANALYSIS CON.docxRunning head SOFTWARE ANALYSIS CONTROL1SOFTWARE ANALYSIS CON.docx
Running head SOFTWARE ANALYSIS CONTROL1SOFTWARE ANALYSIS CON.docx
 
UI guidelines
UI guidelinesUI guidelines
UI guidelines
 
Topic 3 Human Computer Interaction
Topic 3 Human Computer InteractionTopic 3 Human Computer Interaction
Topic 3 Human Computer Interaction
 
User Interface Analysis and Design
User Interface Analysis and DesignUser Interface Analysis and Design
User Interface Analysis and Design
 
Introduction To Usability
Introduction To UsabilityIntroduction To Usability
Introduction To Usability
 
Hci lec 1 & 2
Hci lec 1 & 2Hci lec 1 & 2
Hci lec 1 & 2
 
Lecture1.ppt
Lecture1.pptLecture1.ppt
Lecture1.ppt
 
HCI Basics
HCI BasicsHCI Basics
HCI Basics
 
HCI First Lecture.pptx
HCI First Lecture.pptxHCI First Lecture.pptx
HCI First Lecture.pptx
 
UI.docx
UI.docxUI.docx
UI.docx
 
UI.docx
UI.docxUI.docx
UI.docx
 
ICT203 Human Computer Interaction.docx
ICT203 Human Computer Interaction.docxICT203 Human Computer Interaction.docx
ICT203 Human Computer Interaction.docx
 
UI UX design.docx
UI UX design.docxUI UX design.docx
UI UX design.docx
 
Interfaces
InterfacesInterfaces
Interfaces
 
Chapter1(hci)
Chapter1(hci)Chapter1(hci)
Chapter1(hci)
 
Game interface design part 1
Game interface design part 1Game interface design part 1
Game interface design part 1
 
Game Design 2: Lecture 10 - UI Layout
Game Design 2: Lecture 10 - UI LayoutGame Design 2: Lecture 10 - UI Layout
Game Design 2: Lecture 10 - UI Layout
 

Dernier

2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptxMaritesTamaniVerdade
 
ICT role in 21st century education and it's challenges.
ICT role in 21st century education and it's challenges.ICT role in 21st century education and it's challenges.
ICT role in 21st century education and it's challenges.MaryamAhmad92
 
Plant propagation: Sexual and Asexual propapagation.pptx
Plant propagation: Sexual and Asexual propapagation.pptxPlant propagation: Sexual and Asexual propapagation.pptx
Plant propagation: Sexual and Asexual propapagation.pptxUmeshTimilsina1
 
Wellbeing inclusion and digital dystopias.pptx
Wellbeing inclusion and digital dystopias.pptxWellbeing inclusion and digital dystopias.pptx
Wellbeing inclusion and digital dystopias.pptxJisc
 
Application orientated numerical on hev.ppt
Application orientated numerical on hev.pptApplication orientated numerical on hev.ppt
Application orientated numerical on hev.pptRamjanShidvankar
 
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...Nguyen Thanh Tu Collection
 
General Principles of Intellectual Property: Concepts of Intellectual Proper...
General Principles of Intellectual Property: Concepts of Intellectual  Proper...General Principles of Intellectual Property: Concepts of Intellectual  Proper...
General Principles of Intellectual Property: Concepts of Intellectual Proper...Poonam Aher Patil
 
Food safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdfFood safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdfSherif Taha
 
Exploring_the_Narrative_Style_of_Amitav_Ghoshs_Gun_Island.pptx
Exploring_the_Narrative_Style_of_Amitav_Ghoshs_Gun_Island.pptxExploring_the_Narrative_Style_of_Amitav_Ghoshs_Gun_Island.pptx
Exploring_the_Narrative_Style_of_Amitav_Ghoshs_Gun_Island.pptxPooja Bhuva
 
Holdier Curriculum Vitae (April 2024).pdf
Holdier Curriculum Vitae (April 2024).pdfHoldier Curriculum Vitae (April 2024).pdf
Holdier Curriculum Vitae (April 2024).pdfagholdier
 
The basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptxThe basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptxheathfieldcps1
 
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...Amil baba
 
On_Translating_a_Tamil_Poem_by_A_K_Ramanujan.pptx
On_Translating_a_Tamil_Poem_by_A_K_Ramanujan.pptxOn_Translating_a_Tamil_Poem_by_A_K_Ramanujan.pptx
On_Translating_a_Tamil_Poem_by_A_K_Ramanujan.pptxPooja Bhuva
 
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...ZurliaSoop
 
Kodo Millet PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
Kodo Millet  PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...Kodo Millet  PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
Kodo Millet PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...pradhanghanshyam7136
 
Sociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning ExhibitSociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning Exhibitjbellavia9
 
How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17Celine George
 
Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)Jisc
 
REMIFENTANIL: An Ultra short acting opioid.pptx
REMIFENTANIL: An Ultra short acting opioid.pptxREMIFENTANIL: An Ultra short acting opioid.pptx
REMIFENTANIL: An Ultra short acting opioid.pptxDr. Ravikiran H M Gowda
 

Dernier (20)

Mehran University Newsletter Vol-X, Issue-I, 2024
Mehran University Newsletter Vol-X, Issue-I, 2024Mehran University Newsletter Vol-X, Issue-I, 2024
Mehran University Newsletter Vol-X, Issue-I, 2024
 
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
 
ICT role in 21st century education and it's challenges.
ICT role in 21st century education and it's challenges.ICT role in 21st century education and it's challenges.
ICT role in 21st century education and it's challenges.
 
Plant propagation: Sexual and Asexual propapagation.pptx
Plant propagation: Sexual and Asexual propapagation.pptxPlant propagation: Sexual and Asexual propapagation.pptx
Plant propagation: Sexual and Asexual propapagation.pptx
 
Wellbeing inclusion and digital dystopias.pptx
Wellbeing inclusion and digital dystopias.pptxWellbeing inclusion and digital dystopias.pptx
Wellbeing inclusion and digital dystopias.pptx
 
Application orientated numerical on hev.ppt
Application orientated numerical on hev.pptApplication orientated numerical on hev.ppt
Application orientated numerical on hev.ppt
 
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
 
General Principles of Intellectual Property: Concepts of Intellectual Proper...
General Principles of Intellectual Property: Concepts of Intellectual  Proper...General Principles of Intellectual Property: Concepts of Intellectual  Proper...
General Principles of Intellectual Property: Concepts of Intellectual Proper...
 
Food safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdfFood safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdf
 
Exploring_the_Narrative_Style_of_Amitav_Ghoshs_Gun_Island.pptx
Exploring_the_Narrative_Style_of_Amitav_Ghoshs_Gun_Island.pptxExploring_the_Narrative_Style_of_Amitav_Ghoshs_Gun_Island.pptx
Exploring_the_Narrative_Style_of_Amitav_Ghoshs_Gun_Island.pptx
 
Holdier Curriculum Vitae (April 2024).pdf
Holdier Curriculum Vitae (April 2024).pdfHoldier Curriculum Vitae (April 2024).pdf
Holdier Curriculum Vitae (April 2024).pdf
 
The basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptxThe basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptx
 
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
 
On_Translating_a_Tamil_Poem_by_A_K_Ramanujan.pptx
On_Translating_a_Tamil_Poem_by_A_K_Ramanujan.pptxOn_Translating_a_Tamil_Poem_by_A_K_Ramanujan.pptx
On_Translating_a_Tamil_Poem_by_A_K_Ramanujan.pptx
 
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
 
Kodo Millet PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
Kodo Millet  PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...Kodo Millet  PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
Kodo Millet PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
 
Sociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning ExhibitSociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning Exhibit
 
How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17
 
Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)
 
REMIFENTANIL: An Ultra short acting opioid.pptx
REMIFENTANIL: An Ultra short acting opioid.pptxREMIFENTANIL: An Ultra short acting opioid.pptx
REMIFENTANIL: An Ultra short acting opioid.pptx
 

The User Interface-Introduction .ppt

  • 1.
  • 2.  Text Book:  The essential guide to user interface design, Wilbert O Galitz, Wiley DreamaTech.  Reference Books:  Ben Sheiderman, “Design the User Interface”, Pearson Education, 1998.  Alan Cooper, ”The Essential of User Interface Design”, Wiley- Dream Tech Ltd.,2002
  • 3.  To study the concept of menus, windows, interfaces.  To study about business functions.  To study the characteristics and components of windows and the various controls for the windows.  To study about various problems in window design with text, graphics.  To study the testing methods.
  • 4.  The Students should be able to:  Design the User Interface, design, menu creation, windows creation and connection between menus and windows.  SYLLABUS
  • 5.  What is User Interface?  What is Human Computer Interaction (HCI) alternatively Man–Machine Interaction (MMI) or Computer–Human Interaction (CHI).  It is the study of interaction between people (USERS) and COMPUTERS.
  • 6.
  • 7.  The user interface is the part of a computer and its software that people can see, hear, touch, talk to, or otherwise understand or direct.  User interface design is a subset of a field of study called human-computer interaction (HCI).  Human-computer interaction is the study, planning, and design of how people and computers work together so that a person’s needs are satisfied in the most effective way.
  • 8.
  • 9.  UID designers must consider a variety of factors: ◦ what people want and expect. ◦ physical limitations and abilities people possess. ◦ how information processing systems work. ◦ what people find enjoyable and attractive. ◦ Technical characteristics and limitations of the computer hardware and software must also be considered.
  • 10.  The user interface is the most important part of any computer system. Why?  Software is a logical entity. It cannot be seen, touched, heard or felt.  The only way by which we can realize software is through UI.  It is the system to most users.
  • 11.  The user interface has essentially two components:  input and output.  Input is how a person communicates his or her needs or desires to the computer. ◦ Some common input components are the keyboard, mouse, trackball, one’s finger, and one’s voice.  Output is how the computer conveys the results of its computations and requirements to the user. ◦ Today, the most common computer output mechanism is the display screen, followed by mechanisms that take advantage of a person’s auditory capabilities: voice and sound.
  • 12.  Proper interface design will provide a mix of well- designed input and output mechanisms that satisfy the user's needs, capabilities, and limitations in the most effective way possible.  The best interface is one that it not noticed, one that permits the user to focus on the information and task at hand, not the mechanisms used to present the information and perform the task.
  • 13. With today's technology and tools, and our motivation to create really effective and usable interfaces and screens, why do we continue to produce systems that are inefficient and confusing or, at worst, just plain unusable? Is it because:  We don't care?  We don't possess common sense?  We don't have the time?  We still don't know what really makes good design?
  • 14.
  • 15.  A design is said to be good if it consists of a combination of well designed input and output procedures which fulfils the user's requirements in a successful manner.  A good design is one which possesses the following features. ◦ It allows its users to focus on the data and activity. ◦ It provides data to its users for performing their activities without using any specific procedures.
  • 16.  The interaction design means designing interactive products to support people in their everyday and working lives.  A good-designed interface is very useful to its users for analyzing the performance of a system.  It is a component that displays several complex activities given to the system.  A window's layout and looks does leave an impact on the users.
  • 17.  If the design is very complex, confusing and not sufficient enough then the persons will face problems at their work and commit more mistakes.  Improper designing may develop frustration in people towards the system and they may stop using it.  Several health problems may also arise like the people become aggressive, stressful when they do not get what they expect from the system, quickly and accurately.
  • 18.  The most important benefit is that a good design increases the manufacturing rate of the product and its demand in the market by the users.  A researcher tried to enhance screen clarity and readability by reducing the elements on the screen. Hence, the distinct objects which had been put on the same display line to conserve area, were placed on different lines accounted for twenty percent increase in the screen users. This is due to the reduction of elements on the screen and better clarity. Productivity increased by 20%  Some researchers manipulated the sequence of screens and which enabled the users to compute the transactions in twenty-five percent less time and with twenty-five percent less errors in contrast to those who used original screens.
  • 19.
  • 20. A SYSTEM REQUIRING 4.8 MILLION SCREENS PER YEAR, IF WE MAKE SCREENS WITH WEAK CLARITY THIS CAUSES THE USERS TO SPEND ONE EXTRA SECOND PER SCREEN. THIS MAY TEND TO DECREASE THE SCREEN USAGE. HENCE WE SHOULD IMPROVE THE CLARITY OF THE SCREEN WHILE DESIGNING.
  • 21.  Good designing principles caused the users to take quick decisions.  The correct layout of data on screens increases performance and reduces the expenses of the company during its usage.  Good designing minimizes the training costs due to less training time.  A good design leads to great user satisfaction as stress, frustration and anger are reduced.  The rate of customers increases due to the satisfactory service provided to them by a good design interface.  The economical advantage of good design is that it saves a great amount of money by fixing the errors during the design process itself rather than fixing them after the product's release.
  • 22.  The need for people to communicate with each other has existed since we first walked upon this planet.  The lowest and most common level of communication modes we share are movements and gestures. ◦ Movements and gestures are language independent, that is, they permit people who do not speak the same language to deal with one another.  The next higher level, in terms of universality and complexity, is spoken language. ◦ Most people can speak one language, some two or more. A spoken language is a very efficient mode of communication if both parties to the communication understand it.
  • 23.
  • 24.  At the third and highest level of complexity is written language. While most people speak, not all can write. ◦ But for those who can, writing is still nowhere near as efficient a means of communication as speaking.  In modem times, we have the typewriter, another step upward in communication complexity. ◦ Significantly fewer people type than write. Spoken language, however, is still more efficient than typing, regardless' of typing skill level.
  • 25.  Through its first few decades, a computer's ability to deal with human communication was inversely related to what was easy for people to do.  The computer demanded rigid, typed input through a keyboard; people responded slowly using this device and with varying degrees of skill.  The human-computer dialog reflected the computer's preferences, consisting of one style or a combination of styles using keyboards, commonly referred to as Command Language, Question and Answer, Menu selection, Function Key Selection, and Form Fill-In.
  • 26.  Throughout the computer's history, designers have been developing, with varying degrees of success, other human- computer interaction methods that utilize more general, widespread, and easier-to-learn capabilities: voice and handwriting.  Systems that recognize human speech and handwriting now exist, although they still lack the universality and richness of typed input.
  • 27.  The Xerox systems, Altus and STAR, introduced the mouse and pointing and selecting as the primary human-computer communication method.  The user simply pointed at the screen, using the mouse as an intermediary.  Ivan Sutherland at the Massachusetts Institute of Technology (MIT) is given credit for first introducing graphics with his Sketchpad program in 1963. Lines, circles, and points could be drawn on a screen using a light pen.  Xerox worked on developing handheld pointing devices in the 1960s and patented a mouse with wheels in 1970.  In 1974, Xerox patented today’s ball mouse, after a researcher was suddenly inspired to turn a track ball upside down.
  • 28.
  • 29.
  • 30.
  • 31.
  • 32.
  • 33.  Initially, the cathode ray tube was used in screen designing.  In the 1970s, IBM launched its 3270 cathode ray tube text- based terminal.  The 3270 was used in large number of ways in offices and companies for good screen designing.  During the 1970s less number of guidelines were available for designing.  Designing was implemented using hardware and telephone line transmission issues.
  • 34.  The 1970s screen contained several domains with unclear and unintelligible headings.  The screen was not properly ordered and had a command area that required an information to the filled and memorized by the user.  A reference to a manual was needed for understanding the unclear messages displayed on the screen.  The screens displayed green text on black background, thus restricted to monochrome.  Therefore the screen of the 1970s needed huge amount of toleration and exercise by the users in order to extract the best from the screen.
  • 35.
  • 36.  In the 1980s a wide variety of design guidelines were launched in the market for designing screens.  The appearances of screens were made very clear by arranging and ordering the elements.  An assistance to the user was provided by giving clear and useful headings for the areas on the screen. Also the commands were listed nicely and were applied by function keys.  Messages could be easily interpreted but the screen elements were not completely ordered.  The screens contained instructions and reminders as prompts for the users. Certain codes like PR, ST, FU, MD were presented on the screen to help the users in selection.
  • 37.
  • 38.  In the 1990s the introduction of graphics contributed a lot in screen designing.  A long with arranging and ordering the elements, borders were also included to usually enhance groupings.  The commands were now handled by buttons and menus rather than function keys.  Elements had numerous features such as a variety of font sizes, styles, line thickness and colors.  List-boxes, drop-down combination boxes, spin-boxes were used for making entries.  The users did not need to memorize anything as everything was listed in the controls provided on the screen.  The codes were removed from the screen and new listing control was inscribed.