When designing a form I have the option of putting a close button at the bottom of the form. The form will also have a close form "x" button in the upper right corner of the window as provided by winforms.
Based on the principle of "There should be one and preferably only one obvious way to do it" I was thinking the close button should be removed because of the forms existing default functionality.
What have the rest of you found in your experience that works best for users or has been the standard for UI setup?
I have done a considerable amount of design work, and I can't say I have heard of the principle of, "There should be one way to do [some task]." In fact, I have heard (almost) the opposite: "There should always be one obvious way to do a task, but additional methods could be used to help different user types." An example of this is the ability to hit the "Save" button to save a document. But, you can also do "File > Save" and you can also hit Ctrl + S. Three ways to do the same task.
Also, if you're programming in a Windows environment (as it appears you are), you will automatically get multiple ways of closing a window. The [X], of course, Alt + F4 is typical, you can setup Ctrl + C, etc. I wouldn't particularly put a close button on the bottom of the form unless it flows with the form's input. For example, if you want to [Submit] or [Close] the form - does that make sense? Would it be better to [Submit] or [Cancel]? Think about what your users are doing and how they are using the form.
Here are some guidelines I follow:
If the form is an application (it was launched directly from Windows), it should probably not have a close button. Users expect to be able to close the application by clicking the X in the top-right corner.
If it is a dialog (it was launched from another window within your application) that simply displays information, it should probably have a close button and you can optionally leave the Windows close button as well.
If it is a dialog that allows the user to edit data it should have a Save or Apply button and a Cancel button but no Windows X. The reason is because it is ambiguous what it means. Should it save the data? Cancel it? Display a dialog asking them what they want to do?
In general I do agree that there should be only one way to do something. The reason is that a reasonable user will have to wonder if they do different things (even if they are named the same). Even if the user discovers they do similar things, they may wonder if they are subtly different.
Of course there are exceptions to the rule. For example, most users understand that the file menu, toolbar, and keyboard shortcuts of the same name all point to the same command.
I think that principle applies mostly to coding (and not for every language, think of Perl!), for UI's usually it's good to have different ways to do things... because it allows you to do things faster.
Think about any common operation like cut or paste, you can use the edit menu, the contextual menu, the keyboard shortcut or even the icons in the toolbar. Try to remove any of those ways of doing it in any application and you'll have hordes of users screaming to get it back.
So here the main principle is to not change what the user expects. Another remark: be consistent, though there might be different ways get access to the same functionality, all of them should work in the same way (I'd be very pissed of if copying with the keyboard shortcut did a different thing than copying with the right mouse button XD).
Related
There's probably a ton of stuff I'm probably missing but recently I was thinking how viable it would be on forms to have users perform an action in the UI such as drag/drop a (for example) paper widget into a box widget (possibly also randomly placed on the page) to represent submission of a form.
The idea behind it being, find some action that a human would more likely be able to perform than a bot. Would this in any way prevent spambots?
(I'm laughing as I type this btw, but I just wanted to see how crazy this idea really seemed)
Sadly I don't think it would help. All that happens when a user clicks, drags and drops a component is that events (like click) get fired. You could just as easily fire those events programmatically if you were a spambot. Nice idea though.
Like most home-made spam prevention methods, it'll work until your site is large enough that a spammer decides to pay some specific attention to your site -- at which point, it'll be broken to pieces. But there's no need to get as fancy as what you're describing. Spam-protection methods as simple as "type 'orange' into this box" or "what is one plus one" will work just as well, as long as your site is only being hit by automated tools.
I'm looking to add a 'close' button to my main window's menu. An example can be found in the picture here: http://ifyoucodeittheywill.com/img/crimson-editor.png
(So, there's the normal close button in the window caption area, but, there's also a close button in the window's menu bar -- on the far right).
I'm using basic win32 API's, though an example using MFC would also be fine.
Does anyone know how to do this?
Thanks,
Andrew
These buttons usually come with MDI windows. However I'm pretty sure the depicted application uses either its own, or more probably some advanced third party toolkit. Because, to be honest, what the Windows API and MFC (which is just a classed wrapper around the windows API) give you for GUI programming is unbareably limited.
If you want to design neat UIs steer clear from MFC and better have a look at something like Qt, wxWidgets or the like.
A really simple way of doing this is to use a regular menu item, using AppendMenu, but use the following flags:
MF_BITMAP with a close button bitmap, or MF_OWNERDRAW or to draw it yourself
MF_HELP (aka WM_RIGHTJUSTIFY), a not-very-well documented flag, which will justify the item to the right.
Here's one reference to MF_HELP that I found on msdn - it's actually about using the Win32 API to right-justify a menu item, but using Visual Basic.
MF_HELP (defined in winuser.h) is something of a holdover from Win16 days, back then, the convention was to right-justify the Help menu item, so it would stand apart. It was 'renamed' - an additional #define added with the same value - to WM_RIGHTJUSTIFY around Win95.
Note that bitmap menu items aren't accessible (eg. to users that are relying on a screenreader to read out where they are on the screen); if taking this approach, then at least add a regular 'Close' menu item elsewhere in the menus (eg. under File), so that a user doesn't have to rely on this item, and can also close it through usual means. Also be sure to implement the Ctrl-F4 shortcut, which is what most applications that support multiple documents or tabs use to close the current item.
By all means do not try to create this behaviour yourself. This is functionality that you get "for free" if you are using the MDI architecture of MFC. The close button "next to the menu" as you call it closes the active MDI child window. If you are not using the MDI architecture then there is no point in trying to add a close button there. Can you explain if you are using the MDI architecture?
I like how MsgBox stops all further processing until it's clicked but I don't like how it pops that little msgbox in the middle of the screen. Is there a way to do something like a msgbox but keep it on my Form (which is always in view) so I can go ahead and click a button on the form instead of having to bring the little msgbox window on top of windows that may be covering it.
I use the msgbox to inform me that a certain situation has happened, which I manually fix and when I'm done I click the MsgBox to continue processing. It'd be nice to have this button right on the form.
which I then have bring to the front if there is a window covering it
That shouldn't happen, but can happen if you display the message box from a thread in your program. The window has the desktop as the parent and has no Z-order relationship with the windows in your user interface. And yes, can easily disappear behind the window of another app, including your own.
There's a MessageBoxOptions option that isn't exposed in Winforms, MB_TOPMOST, which ensures the window is top-most. You'd use it like this:
MessageBox.Show("text", "caption", MessageBoxButtons.OK,
MessageBoxIcon.Information, MessageBoxDefaultButton.Button1,
(MessageBoxOptions)0x40000); // use MB_TOPMOST
But by far the best thing to do is to display the message box on your UI thread. Use Control.Invoke() to do so. That way the other windows of your app are disabled, no way for the user to not notice the box.
Still one problem with this, the user won't expect the box to show up since it is shown asynchronously from anything she does. Which means the box can easily get dismissed by accident when the user just happened to press the Enter or Space key. Or clicked at just the wrong spot. Nothing much you can do about that.
Centering the box in your main window is technically possible, but fugly to do. Check this answer.
Do you mean that the form shall exchange its contents with a message plus an OK button?
This would be similar to the way a text mode interface typically works.
You can make it happen by adding a disabled panel or UserControl with message and button topmost on the form and enable it when you wish to alert the user. However, I am puzzled how to implement the blocking behavior similar to MessageBox.Show() and Dialog.Show().
What do people think about using pretend hyperlinks, in Winforms apps?
Example:
In my example you would click "into" the Organisation record card for Acme Corp Inc or "into" the details of the next appointment.
If we ignore, for the moment, how the user edits the Organisation or adds/removes an appointment, is it a sensible UI in Winforms to use blue & underline to signify click here and i'll take you to a new screen
As in:
TextBox1.Font = New Font("Blah", 8.25!, FontStyle.Underline etc
TextBox1.ForeColor = Color.Blue
Not forgetting:
TextBox1.Cursor = Cursors.Hand
This would be for a reasonably rich application (for example a CRM) where you have a lot of different kinds of screens and the user is navigating between all sorts of records. And you want to show the user that he can navigate between detail views, grids, children, parents, siblings etc.
Pros:
it's familiar to users and it's
obvious, without being obtrusive or
taking up any screen real estate
easy to implement
the often-used alternative (a button
with an icon or even just three dots
[...]) looks a bit old-fashioned,
doesn't work very well in grids, and
takes up space
Cons:
with all the flexibility and control
you have in a Winforms front end, you
should be able to devise a smart ui
without needing to borrow from
browsers (maybe???)
these pseudo links won't behave as
true anchor tags (there won't be any
"visited" [ie. turn me purple if I've
already been in here] or "hover"
behaviour and no open-in-new-tab
features, without a lot of work) ... potentially annoying to users?
detracts from genuine hyperlinks (as
in email addresses etc) - these no
longer stand out as links "out to
the internet" (to the browser, to
email client) ... very minor issue?
Not even browsers work this way. Use a LinkLabel, not a TextBox.
In general, it’s a good idea to use hyperlinks (real or simulated) in thick-client apps for opening forms of additional information. It is helpful to distinguish between a control that merely navigates (a hyperlink) and a command that changes the underlying data (a command button), so the users know what they’re getting into. I don't think most users care (or even know) if a browser is involved or not. Navigating is navigating.
Making an attribute value look and act like a hyperlink like you’ve done is fine except for one thing that is a showstopper for most applications: it precludes any other interaction with the attribute. The user can’t edit or even copy the attribute value since any clicking in the field will launch the new form. Keep in mind that to edit a value, such as to correct a day of the month, the user may be inclined to click in the middle of the field to position the cursor. Even if you’re using a drop-down menu (e.g., to set the organization), you want to allow users to click in the field and select by typing the first few letters of the value they want. If your app has one drill-down-able field that needs to be editable, then for internal consistency none of your fields can use hyperlinks –all drilldown needs to be by some other method.
Also, while hyperlinks are intuitive for navigating, such as drill-down, I’m not so sure they’re good for assigning a field value. There is a difference between getting more information about Acme Corp organization (which is what your Acme Corp link implies) and getting a dialog to pick the organization for John Smith (an assignment function). So if your intent is assignment rather than true drill-down, then links are probably not a good idea. For assignment, the button with the three dots makes a lot of sense. Assignment changes the underlying data, so it should use a command button. It’s a natural extension of the button in a dropdown control. The three-dot button caption minimizes the space used and is associated with dialogs since that’s what they imply in menu and button captions. It might look old-fashioned, but that’s why it works –it’s consistent with past user experiences.
Looks okay to me. The concept of links has anyway already migrated from web to desktop applications. Users should accept this without problems (maybe after first ten minutes playing out with your program).
Also quite popular in enterprise applications.
Maybe consider changing the color, to, maybe brown or green, so that it doesn't immediately imply a native web link.
Also many web applications built with some event-driven frameworks (like ASP.NET WebForms, JSF etc.) heavily use links that do not link anywhere but invoke some server-side processing (basically an event handler). So it's not unusual use.
I don't like it. If I see a link I expect it to open a browser window when clicked. More standard would be to have a little "edit" button/icon next the label. You could get away with having a link-style "(edit)" after the text, that would also look quite normal rather than suggesting a browser is involved.
e.g:
Organisation: | Acme Dustbins (edit) |or
Organisation: | Acme Dustbins| (edit)
Is there a simple way to tell what triggered Click event of a Button apart from setting multiple flags in Mouse/Key Up/Down event handlers? I'm currently only interested in distinguishing mouse from everything else, but it would be nice to handle Stylus and other input types if possible. Do I have to create my own button control to achieve this?
Edit: To clarify why I care: in this particular case I'm trying to implement "next" and "previous" buttons for a sort of picture viewer. Pictures in question may be of different size and buttons' positions will change (so they are always centered below picture). It's quite annoying to follow such buttons with mouse if you need to scroll through several pictures, so I want to keep mouse position constant relative to clicked button, but only if it was clicked by mouse, not keyboard.
Edit2: It does not matter whether the buttons are on top or down at the bottom, since the center can change anyway. "Picture viewer" here is just an abstraction and in this particular case it's important for me that top left corner of the picture retains it's position, but it's out of the scope of the question to go in details. Scaling the picture is not so trivial in this sort of application as well, so I do want to know the answer to the question I asked not going into UI implementation discussion.
if (InputManager.Current.MostRecentInputDevice is KeyboardDevice)
You should instead handle specifically the MouseXXX, StylusXXx, and KeyboardXXX events.
Could you elaborate on why you would care?
Having written many custom controls myself over the years, I cannot recall one instance where I cared how a click event was triggered. (Except for that pre VB6 control lifecycle glitch that fired the got focus-click-lost focus in a different order depending on whether you clicked a button, used an accelerator key, or pressed ENTER as the default).
Personally I find it annoying when people place buttons at the bottom of Windows forms and web pages. Read some of the literature on UI and you will find that most people don't even get that far if they don't find something interesting on the page/form. I like to be able to click next as soon as I know the content is of no interest to me, so keep the nav buttons prominent at the top.
I would put the prev/next at the top of the picture where you can control their position. Dancing those buttons around goes against most opinions on UI consistency. Further creating a different experience for a mouse user versus a keyboard user also goes against most current wisdom on good UI design.
The alternative is to choose a constant max size a picture can obtain on the UI and if it exceeds that scale to fit, otherwise allow it to change freely within a frame. This keeps your buttons at the same place if you absolutely must have them on the bottom.
You could create an enumeration with the different devices, have a global property that you set every time the mouse/keyboard/etc. is initiated, and just refer to this when needed.