Cs338-l8 - Drexel University
The GUI development process We’ve now seen some tools that enable us tobuild our interface. So let’s get back to the GUI process.Lecture 8:Design Guidelines– How do we go from idea to design?– How do we specify and evaluate this design?– How do we go from design to implementation?CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.1CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Focus on designTheories The assumed process to this point: Two types of theories useful for our purpose– (1) we have an idea for an interface– (2) we understand our intended users– explanatory: given a phenomenon, try tounderstand its causes, effects, etc.– predictive: given a task/interface, try to predictwhat will/can happen in the course of execution that is, we’ve got personas for our system let’s ignore requirements gathering, etc. for now We need to specify an initial design,or prototype, for our interface. We will examine 3 constraints to guide us:– (high-level) theories– (mid-level) principles– (low-level) guidelinesCS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.2 Same idea as theories in other domains!– physics: how does a ball fly through the air?– chemistry: what happens when we mix X & Y?– HCI: how long does it take to do task X?more general “cognitive engineering”,or “engineering models of user behavior”more specific3CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Page 14
TheoriesTheories Let’s propose a theory of mouse movement. How do people select a menu? Assume Taxonomies– puts order on complexset of phenomena– we usually think ofanimals -- – remember Byrne etal.’s “taskonomy”?– mouse starts somewhere on the screen– user clicks down, selects option, releases What might wetry to explain?– time to execute– event sequence– errorsreadCS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.5locatelistenviewTheoriesTheories Fitts’ Law GOMS modelingprovideconfigurebackreactscroll6– Goals, Operators, Methods, Selection Rules– “keystroke-level” model of human performance one version of GOMS, anyway (KLM)BA– primary operators if B has width w and is at a distance d 2d T c1 c 2 log w CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.go toCS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.– how long does it take to move a mouse A- B? use7K: keystrokeP: point with mouse to a targetB: press or release mouse buttonBB: click mouse buttonH: “home” hands to kb/mouseM: “mental” act of thinkingCS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Page 228011001002004001200msmsmsmsmsms8
TheoriesTheories GOMS modeling Consistency through grammars– phone example– consistent command set simple grammarDescription#TypeTime“turn on phone”1M1.20press ‘Phone’1K.28“dial number”1M1.20type digits10K2.80“send number”1M1.20press ‘Send’1K.28Total insertaction deleteaction insertobjectobjectobjectobject characterwordlineparagraphcommand action object– inconsistent command set complex grammardelete/insert characterremove/insert worddestroy/create linekill/create paragraph6.96CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.characterwordlineparagraph9ugly!CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.10PrinciplesPrinciple #1 Theories provide general descriptions ofhuman behavior, performance, etc. P#1: Recognize the diversity We’ve emphasized this from the beginning! All design depends on the user’s.– very valuable for understanding– so far, have had more limited practical value–––––––– Principles embody particular aspects oftheories applied in context– still somewhat general, but more prescriptive they tell you what to do though they may not tell you specific steps to doing it Let’s look at some recognized principles ofdesign (as found by practitioners).CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.11ageeducationphysical abilitiescultural backgroundtrainingmotivationpersonalitygoalsCS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Page 3Thinking about individuals isoften not feasible. Can weconstruct classes of userswith these parameters?12
Principle #1Principle #1 Novice / first-time users Intermittent / intermediate users– novice are truly novice; first-timers have skills,but just don’t know the interface– rules of thumb.– have the basic knowledge, but don’t see theinterface often enough to become expert– rules of thumb. restrict vocabulary to simple, necessary terms keep (sub-)tasks to minimal number of actions provide informative feedback, simple error messages,and on-line step-by-step helpCS 338: Graphical User Interfaces. Dario Salvucci, Drexel University. 13“take off the training wheels”consistent structure of views & menusconsistent terminologyvisuals emphasize recognition over recall“protection from danger”reference materials (on-line or printed)CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Principle #1Principle #2 Frequent / expert users P#2: Use the Eight Golden Rules ofInterface Design (1) Strive for consistency (again).– “Power” users thoroughly familiar with bothtask and interface– rules of thumb.14– check all aspects of the interface for consistency rapid response times all around macros (built-in or recordable) for frequent sequencesof commands shortcuts: keystrokes, abbreviations, etc. terminology in prompts, menus, help text/image color, layout, caps, fonts– there are exceptions. but limited (2) Enable frequent users to use shortcuts.– just said this, but worth repeatingCS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.15CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Page 416
Principle #2Principle #2 (3) Offer informative feedback. (5) Offer error prevention and handling.– every action (within reason) should get feedback– frequent/minor actions subtle feedback– users should not be able to make a serious error OS’s do this (memory protection: no “poke 1,0”) UI’s are no different! e.g., dragging; how about clicks/keystrokes?– if system detects error, recovery should be quick– infrequent/major actions obvious feedback e.g., don’t re-type command -- fix faulty part though limit use of most obvious! (e.g., dialogs) (6) Permit easy reversal of actions. (4) Design interaction to yield closure.– one word: UNDO– increases comfort level, decreases frustration– encourages exploration of the unfamiliar– after performing subtask (sequence of actions),user should feel closure– (“take one dip and end it!”)CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.17CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Principle #2Guidelines (7) Support internal locus of control. Guidelines are more specific, prescriptivemethods for designing interfaces– make the user feel like they’re in control– surprises are good for horror movies, not UI’s– “avoid acausality” (huh?)– line between principles and guidelines is fuzzy– actually, some use the terms interchangeably if you know the cause & effect, you’re happy You be the judge. Let’s look at some sample guidelines. (8) Reduce short-term memory load.– humans remember 7 2 things(normal humans, not Drexel students :) -they’re more likely around 10 or 12)– the more to recall, the more expertise is neededfor efficient use– let users find functions, not recall themCS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.18– and maybe some of this will sound familiar.19CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Page 520
Guidelines for Display OrganizationGuidelines for Data Entry (1) Consistency of data display (2) Efficient information assimilation – use common formatting (e.g., left vs. rightjustification) for text, numbers, etc. (3) Minimal memory load on user (4) Compatibility of display with data entry(1)(2)(3)(4)(5)Consistency of entry transactionsMinimal user input actionsMinimal memory load on userCompatibility of display with data entryFlexibility for user control of entry– but beware (!): when does flexibility interferewith consistency guideline?– clear ordering, clear links (5) Flexibility for user control of display– allow users to change columns, sorting, etc.CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.21CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Putting it all togetherApple Guidelines We have theories, principles, & guidelines. “Following the guidelines is to youradvantage because.– actually, theories principles guidelines– users will learn your application faster if theinterface looks and behaves like applicationsthey’re already familiar with– users will accomplish their tasks quickly, becausewell-designed applications don’t get in user’sway– users with special needs will find your productmore accessible– your application will have the same modern,elegant appearance as other Mac OS Xapplications But is there something specific to follow? Yes: Java Look-and-Feel Design Guidelines– there are others. Apple’s Human Interface Guidelines– the original, the classic! Microsoft’s Windows Human Interface Guidelines– all are very useful because they’re detailed,comprehensive, standard, and publicly available– Java maps best to onto our course.but let’s look at Apple’s for a minute.CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.2223CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Page 624
Apple GuidelinesApple Design Principles (quote continued) (1) Metaphors from the real world– use concrete metaphors and make them plain, so usershave expectations to apply to computer environments– whenever appropriate, use audio and visual effects thatsupport the metaphor– your application will be easier to document,because an intuitive interface and standardbehaviors don’t require as much explanation– customer support calls will be reduced– your application will be easier to localize,because Apple has worked through manylocalization issues in the Aqua design process– media reviews of your product will be morepositive; reviewers easily target software thatdoesn’t look or behave the way “true”Macintosh applications doCS 338: Graphical User Interfaces. Dario Salvucci, Drexel University. (2) Direct manipulation– users want to feel in charge of the computer's activities (3) See-and-point– (instead of remember-and-type)– users rely on recognition, not recall; they shouldn't have toremember anything the computer already knows– the general form of user actions is noun-then-verb, or"Hey, you --- do this"25CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Apple Design PrinciplesApple Design Principles (4) Consistency (7) Feedback and dialog– effective applications are both consistent withinthemselves and consistent within one another– keep the user informed– provide immediate feedback– user activities should be simple at any moment,though they may be complex taken together (5) WYSIWYG– (What you see is what you get)– there should be no secrets from the user, no abstractcommands that only promise future results– there should be no significant difference between what theuser sees on the screen and what eventually gets printed (8) Forgiveness– users make mistakes; forgive them– the user's actions are generally reversible;let users know about any that aren't (6) User Control– user, not computer, initiates and controls all actionsCS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.2627CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Page 728
Apple Design PrinciplesApple Guidelines (9) Perceived stability Ok, so far these principles sound like manyof the others we’ve seen. What’s the difference? Specific guidelinesthat go with the general principles.– users feel comfortable in an environment that remainsunderstandable and familiar rather than changingrandomly (10) Aesthetic integrity– visually confusing or unattractive displays detract from theeffectiveness of human-computer interaction– different "things" look different on the screen– users should be able to control the superficial appearanceof their computer workplaces -- to display their own styleand individuality– messes are acceptable only if users make them -applications aren't allowed this freedomCS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.– somewhat specific: “Try for a more centeredapproach to dialog layout as opposed to thestrongly left-biased approach.”– more specific: “Maintain a 20-pixel spacebetween the left and right edge of the windowand any controls”– more specific: “Set 16 pixels of vertical spacebetween groups of controls”29CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Apple GuidelinesJava Guidelines The Apple Guidelines include a variety ofinformation, some important, some not The Java Guidelines work best for us30– general and specific all relevant to Swing —namely, to their “Metal” look-and-feel– not important:properties of Applelook-and-feel– not important:Apple-specificcomponents What do the guidelines guide?– “flush 3D” style, “drag” texture, color.– important:ideas behindnice, clean layoutCS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.31CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Page 832
Our approachWindows What we’ll do. Windows form the basis of our GUI The 4 basic types.– we’ll look at various guidelines,general (from various sources) andspecific (from the Java Guidelines)– when we have a specific rule, we’ll underline it “Maintain a 12-pixel space between the left and rightedge of the window and any controls”– as the term progresses, we’ll continually expandour set of rules– it’s these rules that you’ll follow in developingyour larger-scale GUI projectsCS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.33CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Primary windowsSecondary windows Primary windows are handled mostly by theparticular platform you’re on Typically, dialog & alert boxes34– again, OS handles outside, Swing handles inside– OS handles title/outline, moving, resizing, etc.– Swing draws the content (assuming Metal feel)– e.g., on MS Windows. Key: dependent on primary window– if primary closes, secondary closesCS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.35CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Page 936
Utility windowsPlain windows Typically, used to display a collection oftools, colors, or patterns Typically, “splash screen” windows– that is, the window “announcing” the applicationas seen on launch Unlike secondary windows, are notdependent on primary window– thus, doesn’t close when primary closesCS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.37CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Creating windowsWindow visual design What Swing classes do we use for each?––––primary windows:secondary windows:utility windows:plain windows: Say we’re designing a new window.– we know components should go in the window– but where do we put these components?window new JFrame ();window new JDialog (); We’ll rely on Java’s Human InterfaceGuidelines to specify how to do thiswindow new JDialog ();window new JWindow ();– as discussed before, the guidelines aren’t perfect– but they do give us a cohesive, integrated picture Luckily, all these behave very similarly all specifications go together into a unified theme think style sheets in HTML.– just create them & lay them out as usual– in a bit we’ll talk more about putting them alltogether to work smoothly– for now let’s focus on a single windowCS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.3839CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Page 1040
Layout processLayout process (1) Determine the functional requirementsfor your dialog box and the type andimportance of the dialog box components (2) Create a window with 12-pixel marginsbetween the border of the dialog box andits components– example: “Find” dialog box– what information do we need?– Include 12 pixels between the top and leftborders of a dialog box and its components. find text options: match case? whole word?– what components do we need? text box for find text check/radio buttons (etc.) for options command buttons: “Find”, “Close”CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.41CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Layout process(We interrupt this program.) (3) Arrange the command button row andseparate it vertically from the rest of thecomponents If you read the Java Human InterfaceGuidelines, you’ll see things like:42– “Include 11 pixels between the bottom and rightborders of a dialog box and its commandbuttons. (To the eye, the 11-pixel spacingappears to be 12 pixels because the whiteborders on the lower and right edges of thebutton components are not visually significant.)”– Place 17 pixels of vertical space between thecommand button row and the other components.– Buttons must have the same width and mustright-aligned along the bottom margin. We won’t worry about this 1 pixel.Either one is fine.CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.43CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Page 1144
Layout processLayout process (4) Create a design grid, using the numberand width of the rest of the components todecide the number of columns and thecolumn width for the grid. (4) Continued.– design grid example for “Find” box– design grid rows & columns to structure design we’re not talking a strict grid we’re not talking GridLayout’s essentially, we’re talking guides to help with horizontaland vertical alignment– guidelines suggest that grid derives fromcommand buttons and spacing– we won’t abide by this — but having a gridroughly this size is a good idea that is, pick a grid and stick to itCS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.45CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Layout processComponent specifics (5) Add the components to the dialog box intheir logical sequence. Labels– Place labels before the component to which theyrefer (generally, above and to the left.)– Align labels with the tops of their components.– Insert 12 pixels between the trailing edge of alabel and any associated components.– Left-align all vertically aligned labels.– When designing a dialog box, place the mostimportant options, or those you expect users tocomplete first, prior to others (in reading order). (6) Align related components using thedesign grid. Insert 12 pixels after the edge of the longest label.– Align related components vertically using achosen design grid column, and horizontallyusing a chosen design grid row.CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.4647CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Page 1248
Component specificsComponent specifics Command buttons Radio & check-box buttons– Center all button text, with a 12-pixel left & rightboundary between button label and button edge.– Make all grouped command buttons equal width,which doesn’t change when window is resized.– Space buttons in a group 6 pixels apart.– Make the default button the left-most button.– Insert 17 pixels between these & rest of window.6– Align the leading edge with that of othercomponents.– Space grouped buttons 6 pixels apart.– Space separate groups 12 pixels apart.66666171212CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.49CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Component specificsComponent specifics Toolbar buttons Interface text– Most components use “headline” capitalization.– Space individual toolbar buttons 2 pixels apart.– Space groups of toolbar buttons 11 pixels apart.– Include 3 pixels of space above and below alltoolbar buttons.CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.50 [capitalize every word except articles, conjunctions,and short prepositions] Checkbox text (Automatic Save Every Five Minutes) Combo box text (Centimeters) Command button text (Don't Save) Icon names (Trash Can) Labels for buttons or controls (New Contribution To:) Menu items (Save As.) Menu titles (View) Radio button text (Start at Top) Titles of windows and dialogs (Color Chooser) Tool tips (Cut Selection)51CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Page 1352
Component specificsImplementation of guidelines Interface text (continued) Not surprisingly, Swing is set up toimplement the specified guidelines Some tips to help you.– Alerts, errors, and long labels use “sentence”capitalization. [capitalize only the first word in the sentence] Alert box text(“The document you are closing has unsaved changes.”) Error or help messages(“The printer is out of paper.”) Labels that indicate changes in status(“Operation is 75% complete.”)CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.– hard spacing around buttons, labels, etc.pane.add (Box.createRigidArea (new Dimension (0,5)));– spacing around main window with borderBorder spacer BorderFactory.createEmptyBorder (top, left, bottom, right);component.setBorder (spacer);53CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Implementation of guidelinesDialogs & Alerts Some tips to help you. (continued) Dialog boxes54– secondary window inwhich user performstask that issupplemental to theprimary window– typically laid out byprogrammer– layout managers are your friends for consistentalignment and spacing e.g., BorderLayout ‘South’ panels for command buttons e.g., GridLayout to get equal-sized command buttons Alert boxes– secondary window thatprovides brief,temporary interactionwith user– typically laid out bySwing (built-in)CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.55CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Page 1456
Types of dialogsDialog box design Modal: blocks allother user input Modeless: canstill interact withmain frame Official word: Basic design– In dialog boxes, include mnemonics for all userinterface elements except default and Cancel.– When opening a dialog box, provide initialkeyboard focus to the logical first component.– Consider the effect ofinternationalizationon your design.Use modeless dialog boxeswhenever possible. Use layout managers!Use modal dialog boxes wheninteraction with the applicationcannot proceed while dialog boxis displayed. In practice, this isn’t easyCS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.57CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Dialog box designDialog command buttons Tab traversal order General rules58– Place command buttons that apply to the dialogbox as a whole in the command button row atthe bottom of the dialog box.– Align buttons in the command button row alongthe lower-right edge of the dialog box.– Specify a logical tab traversal order for the userinterface elements in a dialog box.– The default traversal order is the sequence inwhich you add the components to the dialog box. do it this way,it’s easiest but there’s alsoanother, moreexcruciating way note: the alignment of command buttons in alert boxessupplied by Swing is different from the standardalignment in dialog boxes (why?!?)– Place command buttons that apply to one or afew components next to their associatedcomponents. e.g., “Browse” button at the trailing edge of the textfield it fills inCS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.59CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Page 1560
Dialog command buttonsDialog command buttons “OK” and “Cancel” buttons “Apply” and “Close” buttons– best for *multiple-use*, modeless dialogs– in most cases, “Apply” is the default button– Use “Apply” to carry out the changes users specify in a dialog boxwithout closing the window.– best for *single-use* dialogs,modal or modeless– in most cases, “OK” is the default button– When users click “OK”, save the settings (orcarry out the commands) and close the dialog. Whenever possible, use a specific action name (such as "Find") insteadof "Apply”.– Include a “Close” button in a dialog box with an “Apply” (or otheraction) button. Close dismisses the dialog box without applyingchanges.– If the user has made changes in a dialog box and clicks Closebefore clicking the Apply button, display a Warning alert box toapply changes, discard changes, or cancel the close operation. Whenever possible, provide the button with a commandname that describes the action (such as Print or Find)instead of OK.– When users click “Cancel”, close the window andrestore the settings to the state they were inwhen the dialog box was opened.CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.61CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Dialog command buttonsDialog command buttons “Close” button “Help” button– used to dismiss informative secondary windows– Never use an “OK” button in a window that has a“Close” button.– When users click the “Close” button, dismiss thedialog box and do not make additional changes tothe system.62– used in any dialog box that needs it “how do I do X?”, “what does X mean?”– When users click the “Help” button, open anadditional window that displays helpinformation. Avoid removing or obscuring information in the windowwhere users clicked “Help”.– Place “Help” at thetrailing (right) edgeof a group ofcommand buttons.CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.63CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Page 1664
Dialog command buttonsCommon dialog boxes Default button Find dialog– enables users to search fora specified text string– often modeless, multiple-use– represents the most likely user action– If a dialog box has a default button, make it thefirst (left-most) command button in the group.– Commands that cause the user to lose datashould never be the default button, even if theyare the most common option. Login dialog– enables users to identifythemselves and enter apassword– typically modal Progress dialog– provides feedback for longoperationsframe.getRootPane().setDefaultButton (okButton);CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.65CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Common dialog boxesCommon dialog boxes Preferences dialog Color Chooser dialog– enables users to view and modify thecharacteristics of an application– complex windows can be organized & simplifiedusing tabbed panesCS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.66– provides one or more content panes from whichusers can select colors and view them in context– chooser can be implemented as panel(s), notseparate window (so can embed into dialogs)67CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Page 1768
Alert boxesAlert boxes Alerts convey a message or warning to users,and also provide an easy way for you tocreate a secondary window Swing has four basic types of built-in alerts Basic designinformationwarningerror– Begin your message with a brief heading in bold.Start the body of the message on a separate line. use b . /b for heading, br for line break– If appropriate, provide a Help button in an alertbox that opens an additional window with moreinformation.– Different alignment rule for buttons!!! (Sigh.)question Create alerts as JOptionPane’s– this will give you the built-in goodiesCS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.69CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Alert boxesAlert boxes Info alert boxes Warning alert boxes– present general information to users– Provide a Close button to dismiss an Info alert.CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.70– warn users about the possible consequences of anaction and ask users for a response– Keep the message in a Warning alert box brief,and use terms that are familiar to users.– Include at least two buttons in a Warning alertbox: one button to perform the action and theother to cancel the action.– If the most common action could result in dataloss, do not provide a default.71CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.Page 1872
Alert boxesAlert boxes Error alert boxes Question alert boxes– report system and application errors to users– In the message of an Error alert box, explain what happened, thecause of the problem, and what the user can do about it. Keepthe message brief and use terms that are familiar to users.– If possible, provide buttons or other controls to resolve the errornoted in the Error alert box.– request information from users– sometimes, can be used for error correction– you can add your own components here(unlike other alert boxes) Label the buttons according to the action they perform. If users cannot resolve the error, provide a Close button.– If appropriate, include an error number in the title bar of an Erroralert box.– If appropriate, provide a Help button in an Error alert box to opena separate window that gives background information about theerror.CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University.73CS 338: Graphical User Interfaces. Dario Salvucci, Drexel Univers
CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University. 1 Lecture 8: Design Guidelines CS 338: Graphical User Interfaces. Dario Salvucci, Drexel University. 2 The GUI development process We've now seen some tools that enable us to build our interface. So let's get back to the GUI process.
ACADEMIC ADVISOR, ACE/NACT BSN PROGRAM Margaret Breslin, BSN, RN (267) 359-5794 or mmb55@drexel.edu Andrea Perry, MS (267) 359-5795 or amm26@drexel.edu ACADEMIC ADVISORS, BSN CO-OP PROGRAM Shannon Edwards (267) 359-5659 or sle63@drexel.edu Jayme Lloyd (267) 359-5779 or jll374@drexel.edu
Drexel Magazine, Vol. 26, Edition 3 Drexel Magazine is published three times yearly by the Office of University Communications, 3141 Chestnut St., Suite 309 Philadelphia, PA 19104. CHANGE OF ADDRESS Drexel University Records, Gifts and Stewardship 3141 Chestnut St., Room 310 Philadelphia, PA 19104 Tel: 215.895.1694 Fax: 215.895.4966
Nuclear Engineering (p. 52) Software Engineering (p. 56) About the College Drexel University's College of Engineering has emphasized its strengths in engineering, science and technology to train students to become the leaders of the future. In little over a century, Drexel University has
Drexel University chaomei.chen@cis.drexel.edu Steven Morris . that Pearson correlation coefficients could lead to counter-intuitive results in author co-citation analysis. 2.2 Network Evolution The latest advances in statistical mechanics of complex networks have at
May 01, 1987 · of the Year award from Drexel University’s Col lege of Business and Administration. The award will be presented at the college’s Honors Day ceremony on Thursday, May 14, 2:00 P.M., in Drexel’s Main Auditorium, 32nd and Chesnut Streets. He will also be a gue
Drexel University Policy Year: 2021 - 2022 Policy Number: 812834 . www.aetnastudenthealth.com (877) 409-7361 . This is a brief description of the Student Health Plan. The plan is available for Drexel University students and their eligible dependents. The plan is insured by Aetna Life Insurance Company (Aetna).
Generating Software Requirements Specification (IEEE Std. 830 1998) document with Use Cases James L. Goldman, George Abraham*, and Il Yeol Song College of Information Science and Technology (iSchool at Drexel) Drexel University, Philadelphia, PA 19104 {jimg, sga72, song}@drexel.edu * File Size: 285KB
1) Minimum wall thickness shall not less than 87.5% of nominal wall thickness in accordance with ASTM D2996. 2) Use these values for calculating longitudinal thrust. 3) No-shave pipe. Typical pipe performance Nominal Pipe Size Internal Pressure Rating1 Collapse Pressure Rating2 Designation in mm Psig MPa psig MPa Per ASTM D2996
