Designing the Graphical User Interface

Designing The Graphical User Interface-Free PDF

  • Date:25 Oct 2020
  • Views:4
  • Downloads:0
  • Pages:22
  • Size:241.29 KB

Share Pdf : Designing The Graphical User Interface

Download and Preview : Designing The Graphical User Interface


Report CopyRight/DMCA Form For : Designing The Graphical User Interface


Transcription:

Color profile Generic CMYK printer profile,Composite DefaultCertPrs8 SUN. screen Sun Certified Programmer Developer for Java 2 Study Guide Sierra 222684 6 Chapter 14. 850 Chapter 14 Designing the Graphical User Interface. CERTIFICATION OBJECTIVE,Creating a Usable and Extensible GUI. There are several key aspects of GUI design that you need to consider when designing. and implementing the GUI for your project At a high level they can be broken. down into two main areas of focus, 1 Designing the GUI to be usable and friendly from the end user s perspective. 2 Designing and implementing the GUI to be reliable and maintainable from. the programmer s perspective, This chapter will focus almost entirely on the first point ease of use for the end. user We start with a very brief overview of the technical issues you probably want to. address in implementing your GUI for this project After that brief overview we. dive into the topic of usability, An Overview of Technical Considerations for Your GUI.
Most of your GUI work on the exam assignment will be focused on usability But. for the final review you might be asked to justify not just the user friendliness but. also the technical considerations you took into account when designing and building. your GUI This section gives you a brief overview of some of the technical issues you. need to keep in mind,Required Technologies, Your instruction packet will probably require you to use certain technologies to. implement your GUI for this project If for instance your instructions indicate. that you are to use Java Swing components and specifically the JTable component. not only do you have to use them but you also need to use them appropriately. Before jumping in to implementing your GUI you need to understand the strengths. and weaknesses of the technologies you are using In addition each of the required. technologies is meant to be used in a certain fashion for instance if you re going. to use a JTable you ll want to use the appropriate models and listeners The bottom. line is don t use a widget until you really understand how Sun intended for you. P 010Comp CertPrs8 SCJD ebook To Apollo CH14 vp,Thursday May 15 2008 11 23 27 AM. Color profile Generic CMYK printer profile,CertPrs8 SUN Sun Certified. Composite Default screen Programmer Developer for Java 2 Study Guide Sierra 222684 6 Chapter 14. Creating a Usable and Extensible GUI 851,Model View Controller. Your exam instructions will probably say that the GUI you build should be. flexible and relatively easy to extend If so you ll probably end up considering. the Model View Controller MVC design pattern We recommend that you. do consider the MVC approach If you are familiar with it so much the better. If you are not this is a good opportunity to study it The MVC pattern has. plenty of benefits, It s very popular and you re bound to run into it sooner or later.
It anticipates that end users will ask for iteration after iteration of changes to. the GUI design and it reduces the development impact of those iterations. You know how those end users are,It scales well to large teams. It anticipates Java s write once run anywhere philosophy reducing the. effort required to port your GUI layer to additional environments such as. browsers or mobile devices,Event Handling Listeners and Inner Classes. If you re instructed to use Swing and we can virtually guarantee you will be you. must understand the Listener paradigm Be certain that you understand how Swing. components are meant to handle events and how components relate to their models. and their listeners In addition you should understand how inner classes are used to. help implement these capabilities,Introduction to Usability Design. Traditionally the assessors for the developer s exam have given a good deal of weight. to the quality of the GUI To pass the exam your GUI should embody a host of. wonderful attributes including,It should follow presentation standards. It should be easy to learn and easy to use,It should behave as GUIs are expected to behave.
The rest of this chapter covers key aspects of usability design and implementation. for the GUI portion of your project As an added bonus this chapter discusses GUI. P 010Comp CertPrs8 SCJD ebook To Apollo CH14 vp,Thursday May 15 2008 11 23 32 AM. Color profile Generic CMYK printer profile,Composite DefaultCertPrs8 SUN. screen Sun Certified Programmer Developer for Java 2 Study Guide Sierra 222684 6 Chapter 14. 852 Chapter 14 Designing the Graphical User Interface. design aspects that will be applicable across most of the GUI projects you encounter. Once again we are approaching this topic with our infamous 80 20 perspective. this chapter provides the core information you need to design GUIs that are easy to. learn easy to use and ergonomically friendly There are eight steps to designing a. 1 Understand the business function and build use cases. 2 Follow the general principals of good screen design. 3 Choose the appropriate widgets for your GUI,4 Create the basic page layout s. 5 Create appropriate menus and navigational elements. 6 Create crisp and informative GUI messages,7 Use colors responsibly. 8 Test your GUI iteratively,1 Use Cases and the Business Function.
The Sun developer s exam is by its nature an artificial exercise We all understand. that there are no real end users and no real business with real issues being addressed. here The rest of this section is written assuming that you re creating a solution for. a real scenario So for the exam you ll just have to pretend that you are the user. the business manager etc Even though you re a one person band you can follow. this process at least for the exam,Interviews Observation and Iteration. A GUI will always be better if it s designed with the help of the end user community. No matter how many businesses you ve helped to automate or how many killer. GUIs you ve built in the past end user input is essential Although there are many. ways of interacting with the end user the three ways that offer the best return are. Observing the end user performing the process that you hope to automate. From now on we ll just call it the process,P 010Comp CertPrs8 SCJD ebook To Apollo CH14 vp. Thursday May 15 2008 11 23 37 AM,Color profile Generic CMYK printer profile. CertPrs8 SUN Sun Certified, Composite Default screen Programmer Developer for Java 2 Study Guide Sierra 222684 6 Chapter 14. Creating a Usable and Extensible GUI 853, Interviewing the end user about the process that he or she performs what.
information is used what decisions are made what steps are taken and what. is created, Reviewing your results and refining your implementation with the user over. and over again at every stage of development,Creating Use Cases. A very effective approach to designing a GUI is to create use cases with the user as. you work through the observation and interview stages Use cases let you encapsulate. the transactions that the end user performs over and over again in his or her job. Let s say that you re creating a system to help customer service representatives. CSRs at a company that sells PCs over the phone After talking with the CSRs. and watching them work you might discover that they perform the following tasks. over and over again in the context of working with their clients. Create a new customer record,Modify information in an existing customer record. Place a new order,Modify an existing order,Cancel an order. Each of these activities can be considered a use case Once you ve generated a list. of use cases for your application the next step is to flesh them out We like to use. 4 6 cards for this Each use case is listed on its own card and then for each card. we add the following headings, Find How do you find the information you need to perform the use case.
Display What information is needed for the use case to be completed. Verification What processes support verifying that the use case is. completed properly, Finalization What processes and information are necessary to complete. the use case,P 010Comp CertPrs8 SCJD ebook To Apollo CH14 vp. Thursday May 15 2008 11 23 41 AM,Color profile Generic CMYK printer profile. Composite DefaultCertPrs8 SUN, screen Sun Certified Programmer Developer for Java 2 Study Guide Sierra 222684 6 Chapter 14. 854 Chapter 14 Designing the Graphical User Interface. The next step is to work with the end users to answer the four questions listed on. each use case card When the cards have been completed and reviewed they form. the basis for designing the GUI,Screen Mockups, The next step is to use your deck of 4 6 cards to generate hand drawn screen.
mockups Don t worry about making these mockups look good that s handled. later Just get them down on paper quickly they re just temporary It s tempting to. get ahead of yourself here and want to jump in and start writing code Avoid the. temptation If done correctly this first whack at screen design will produce screens. that will absolutely not be what you ll want the final system to look like In this. phase you want to quickly sketch out a rough screen for every heading on every card. If we ve done the math right that means you ll have four mock screens for every. use case Find Display Verification and Finalization. It s hard not to get ahead of yourself here because you ll quickly realize that a lot. of these mockup screens look a whole lot like each other That s a good thing By. reviewing these mockups with the end users you ll discover that with just a little. tweaking you can solve many different use case steps with a single display In our. previous example we had five use cases so it might seem reasonable to expect that. you can represent all 20 different use case steps with three or four displays. 2 Principles of Good Screen Design, Once we ve got a rough idea what the system s individual displays ought to look. like it s time to move to the next level of design At this stage in the design our. goal is to create mockup displays that do more than simply satisfy the requirements. of the use cases We also want to design screens that will be easy to learn easy to. use and will not irritate the end users over time Here is a list of principles that will. assist you in creating screens that your users and assessors will love. Balance and Clutter, Well designed displays tend to be balanced By balanced we mean that the content. is approximately balanced left to right and top to bottom Another attribute of. good looking displays is that they avoid the feeling of being cluttered We return to. the issue of clutter again later but for now we mean that the screen elements should. P 010Comp CertPrs8 SCJD ebook To Apollo CH14 vp,Thursday May 15 2008 11 23 47 AM. Color profile Generic CMYK printer profile,CertPrs8 SUN Sun Certified. Composite Default screen Programmer Developer for Java 2 Study Guide Sierra 222684 6 Chapter 14. Creating a Usable and Extensible GUI 855, be neatly aligned Figure 14 1 shows some examples of cluttered and poorly balanced.
displays and then an orderly and well balanced display. Logical Groups and Workflow, Often a display can be thought of as many individual elements that can be placed. into a few logical groups For instance customer name street address city state. and ZIP code are all individual elements but it s natural for users to view these. individual elements as a group thought of as customer address Grouping. elements together in a natural way is a good practice there will be less mental. strain on the user data entry errors will be reduced if the display s tab sequence. produces the shortest possible travel between elements well ordered groups tend. to be more visually appealing and finally natural groups are easier to learn. FIGURE 14 1 The dos and don ts of an orderly and balanced display. P 010Comp CertPrs8 SCJD ebook To Apollo CH14 vp,Thursday May 15 2008 11 23 50 AM. Color profile Generic CMYK printer profile,Composite DefaultCertPrs8 SUN. screen Sun Certified Programmer Developer for Java 2 Study Guide Sierra 222684 6 Chapter 14. 856 Chapter 14 Designing the Graphical User Interface. You should also consider conditioned scanning patterns In Western cultures. information is typically presented from left to right and from the top down These. sequences are not universally recognized however so you should consider local. cultural factors when designing a display,Navigation and Commands. Good GUI displays typically let the user issue a variety of commands to the system. For now we split GUI commands into two broad categories commands that cause. an action to take place within the current display action commands and commands. that make the system jump to a new display navigational commands A good rule. of thumb is that action commands can occur wherever related elements are being. displayed but that navigational commands will appear only in the menu bar or. toolbar or at the bottom of the display, When designing screen commands simple language is the best As a developer.
you know for instance that displaying the contents of a customer record on a. display may actually require several programming steps You don t want a button. that says Create a search string query the database verify that good data was. received and finally display the result Instead you probably want something. bonus content is part of ISBN 978 0 07 159106 5 SCJP Sun Certified Programmer for Java 6 Study Guide Exam 310 065 All use of The McGraw Hill Companies SCJD bonus content is subject to the terms and conditions set forth in the License Agreement included with this book and CD P 010Comp CertPrs8 SCJD ebook To Apollo CH14 vp Thursday May 15 2008 11 23 21 AM Color profile Generic CMYK

Related Books