Uploaded on

 

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
500
On Slideshare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
9
Comments
0
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Unit 5View layer : Designing interface objects
  • 2. Introduction• UI(user interface) – Main goal of UI is to display and obtain needed information in an accessible , efficient manner – UI design is a creative process
  • 3. Designing view layer classes• UI layer consists of – objects with which user interacts – Objects needed to manage or control UI• Responsibility of view layer objects – Input :responding to user interaction • Translating user’s action into an appropriate response – Output :displaying or printing business objects
  • 4. Process of designing view layer classes• It has 4 major activities – Macro level UI design process: (identifying view layer object) • Takes place during analysis phase • Identifying classes that interact with human actors by analysing use cases • sequence and collaboration diagram helps to identify UI classes – Micro level UI design activities • Designing the view layer objects by applying design axioms and corollaries – Decide how to use and extend the components so they best support application specific functions and provide the most usable interface • Prototyping the view layer interface – Useful in the early design process – Testing usability and user satisfaction – Refining and iterating the design
  • 5. Macro level design process The class interacts with a human actor Zoom in by utilizing sequence or collaboration diagrams Identify the interfaceNext class objects for the classrefine anditerate The class Define the relationships doesn’t among the view objects interacts with the human actor
  • 6. Relationship among view objects, business objects, access objects View objects Business objects Access objects
  • 7. Micro level design process Apply micro level UI design rules and GUI guidelines to each interface object identified to develop the UINext interfaceobjects refineand iterate Done
  • 8. Design rules 1• Making the interface simple ( application of corollary 2) – Ex: • Car engine is complex • But driver interface remains simple – User must be able to work with our screen without asking much questions – Factors affecting UI • Dead lines • Comparative evaluations • Addition features • Shortcuts – Things to be considered while designing UI • Additional features affect performance, complexity • Fixing problem, after the release of product is difficult
  • 9. Design rule 2• Making the interface transparent and natural• Application of corollary 4
  • 10. Design rule•Allowing users to be in control of thesoftware•Application of corollary 1•User should control the software instead ofsoftware controlling the user
  • 11. Ways to put users in control• Making the interface forgiving• Make the interface visual• Provide immediate feedback• Avoid modes• Make the interface consistent
  • 12. Making the interface forgiving• Users action must be reversible – Physical (pointing to wrong command) – Mental (wrongly deciding to select data or command)
  • 13. Make the interface visual• Interface must provide list of items, instead of users to remember all choices
  • 14. Provide immediate feedback• Users must receive the feedback immediately
  • 15. Avoid modes• Modes force the user to focus on the ways An application works, instead of on the task they want to complete• Some of the modes – Modal dialog • Sometimes an application needs information to continue, such as name of a file into which users want to save something – Spring loaded modes • Users must take same action to remain in that mode • Ex: dragging mouse – Tool driven modes • This mode have the provision to remind the user about the mode in which they are. • Ex: drawing application. Once tool has been selected, the
  • 16. Make the interface consistent• User can predict the system, by developing consistent UI
  • 17. Purpose of a view layer interface• User Interface has one or more window. each window should have a clear purpose – Forms and data entry windows – Dialog boxes – Application window (main window)
  • 18. Guideline for designing forms and data entry windows• Issues to be considered while designing the form – What kind of information the user works with and why – Do user need access to all information in a table – In what order the rows has to appear• Typical data entry tasks includes – Row navigation – Adding and deleting rows – Changing data in rows – Saving and abandoning changes
  • 19. Cont..• Layout – The layout determines how successfully users can enter the data – guidelines • Start the designing from the existing paper form • Add smaller windows to main window, if main window contains too much information • Mandatory information must present at the top left • Align fields at their left edges • Arrange controls in a sequence users expect to enter data • Put similar or related information together
  • 20. Guideline for designing Dialog boxes and error messages• Define the title text to be the name of te associated command• Error message – Message should be • positive • Constructive • Brief and meaningful • Orient the controls in the direction people ‘ll read
  • 21. Guideline for command buttons layout• Major command buttons can be paced at the upper right border of the dialog box or lined up across the bottom of the dialog box• Ok and CANCEL buttons can be grouped together• A command button providing support to other command buttons can be grouped
  • 22. Guidelines for designing application window• application window consists of – Frame – Title bar – Scroll bar – Menu bar – Tool bar – Status bar – Drop down menus
  • 23. Cont.• Guidelines for menus – File menu – Edit menu – View menu • zoom – Window menu • Managing window within main works space – Help menu• Tool bar and status bar
  • 24. Guidelines for using colors• Soothing ,cool and neutral color like blue can be used• To project any field, color can be used to stand out from other fields• For readability, black is a standard color• Meaning can be associated with color• Color blind people can be considered . Use animated buttons
  • 25. Guidelines for using Fonts• Consistency• Avoid courier• Avoid using all upper case• Avoid mixing more than 2 fonts• Use commonly installed fonts• Use bold for control labels
  • 26. Prototyping the user interface• Encourages incremental development approach• Used for better understanding
  • 27. Steps in Prototyping user interface• 3 steps Create user interface controls Associate actions to the user interface controls and their events Test/debug done