Easy-to-learn developer tips

Question

What are some key interface design tips every developer should know?

Although there are a number of UI resources for developers (for example, Joel Spolsky UI Design for Programmers ), I'm more interested in the list of bullets that can be transferred in 1-2 pages.

I’m interested in more tactical, daily user interface hints , as opposed to the general goals of user interface design, which will be discussed at a meeting on user interface design (presumably at least one person with a good interface). A collection of these tips can cover about 80% of the cases that an ordinary programmer would encounter.

Answer 1

• use the standard menu (amateur graphic designers seem to be plotting their own course here for some reason). Make sure the first elements are File, Edit, and View, and the last is Help
• Do not worry about color themes or skins; stick to a standard view compatible with your platform.
• use the system default font
• Use menu accelerators appropriate for your platform.
• stick to the proven and correct layout using the menu bar at the top, the status bar at the bottom and, if necessary, the navigation bar on the left.
• never use system capture
• If you have a choice, make all windows resizable.
• use amateur radio groups for "choose exactly one". Always make sure that one of them is selected by default. If you want the user to not select an option, add another radio cup for “no choice”
• use groups of control buttons for "select zero or more"
• if necessary, restrain input (that is, simply ignore non-digital digits in the numeric input field), instead of waiting for the user to enter data, send, and then call the dialog "hey, letters are not allowed!". If they are not allowed, do not accept them first.
• Be liberal in what you accept as input. For heaven’s sake, do not drop the fit for the SSN field if they do not include hyphens, or set when you do not want them. The computer is smart, let's find out that xxxxxxxxx and xxx xx xxxx and xxx-xx-xxxx are valid social security numbers.
• always allow spaces in long fields such as serial numbers and more. Data quality goes up if the user is allowed to group numbers in sets of three or four. If your data model cannot handle spaces, you can remove them before saving the data.
• Avoid pop-up dialogs such as the plague. Never show it unless you absolutely must. If you decide what you want, stop and review your design before continuing. There are times when they are needed, but these times are much less common than you could imagine.
• Pay attention to keyboard bypass. Most toolkits attempt to do this correctly, but always double-check. Usage should be able to use the tab key to logically go to widgets.

All of these rules, of course, can be violated. But just break it if you break it for a good reason.

Remember that software helps the user, he must do what he wants, instead of doing what he needs.

Answer 2

When you are about to perform an action that will change or delete information, do not ask “are you sure” - users will learn how to press a button as part of the action. Try to enable Undo in your system design.

Answer 3

Make the default choice for those who like most users.

Answer 4

Always provide your user with an "exit" from any point where it does not require the use of the "Back" button.

The best example:

If an error occurs, give them a link to where they were (or at least to where they can start).

Answer 5

Use tool tips as much as possible. It's amazing how these little guys can add most of the help to the end user, and they are unobtrusive to the application itself.

Answer 6

• ask the user, don't just do it.
• simplify - delete a step, remove clicks, etc.
• read usability principles

Answer 7

I think this link would be a good starting point from the Microsoft "Windows Vista User Guide:
http://msdn.microsoft.com/en-us/library/aa511328.aspx

And it can be very close to the list of pages with two pages you are looking for: "Top Violations":
http://msdn.microsoft.com/en-us/library/aa511331.aspx

Very close to Earth prompts, for example: "Set the minimum window size if there is a size below which the contents can no longer be used."

Answer 8

Proper foot tabs are required.

Answer 9

When designing the user interface, make it as simple as possible, but simpler.

Answer 10

Do not increase "openness" due to simple clarity and ease of use.

Answer 11

Find what the user will do most often, and then make it the easiest.

For example: I have a long personal manuscript with a microwave design.

Many require you to set a watch that you never use for anything before using the microwave, and it forgets every time it loses power. This requires 10 keystrokes on these hard-to-reach buttons.

A simple usability test will mean that the most common cook time used on microwaves is the standard “minute” and the multiplicity of this. An ideal microwave oven should therefore be able to cook for 1 minute at high power with 3 or less actions.

Within a few minutes, but within 5 minutes from the golden minute “1”, there should be several more steps, but this is not so important, and only a significant number of actions are required for the cooking time> 5 minutes. (which is pretty rare)

---

2 examples of a large microwave design

1. 4 parts. Door, temperature dial, timer, lighting sequence

The temperature dial is analog and is retained from the previous setting with a variable acceleration range.

The timeline is digital, but simulated analog, clockwise rotation increases the hours of operation of the clock (shown by the sequence of lighting under the dial). Turning the dial counterclockwise reduces the time in hours. Cooking reduces time in hours.

The door closes, and time on the clock begins to cook. Opening the door pauses cooking.

standard work: open the door, load, turn the time, close the door (or, if desired, close the door again, and cooking starts as soon as> 1 s on the watch)

2. 6 parts, door, dial, power button, start button, reset button, digital time display

The start button without a selected time starts cooking for 1 minute at high power.

The start button during cooking adds 1 minute of time.

Temporary dialing is maintained between sessions. Turning the dial causes the time stored in the dial position to be copied to the digital timer.

Pressing "power" before starting cooking will

• if the dial has not been rotated, copy the current time stored in the dails position to the digital timer.
• if the dial has been rotated, decreases the power level selection by 1 or, if at the lowest power level, returns to the highest.

Pressing the power during cooking reduces the power level on the fly.

standard operation: 1 minute in height = start of pressing.

1 minute medium high = press the start button, press the power button.

2 minutes - press the start button twice.

<at any time> in high = mode, rotate the disk all the way, press the "Start" button.

<anytime> on & any anypower> to turn the disk until it becomes happy, press the power button all the way, press the "Start" button.

<preselected time> at high values ​​= press power, press start button

<pre-selected time + 1 minute> at high values ​​= pressing force, press the start button twice.

As you can see here, adding a small number of additional buttons, you can add more expressiveness and functional design.

Any design with a numeric keypad for time specification, as a rule, does not meet my criteria for a good design.

He noted that these projects may, for some people, have a higher learning curve, but as soon as they learn, muscle memory makes him instinctive. In contrast to the more (obvious?), But overly complex projects that even scientist users will have to spend a tedious amount of time repeatedly to perform tedious arbitrary operations, simply to achieve common goals.

Answer 12

Make a few checks on the usability of the hallway (exactly the same as viewing the code).

Even a very quick test "Hey, try this one" (so to speak) with a guy next to you will make a big difference. The main thing is for someone other than you to try the little user interface that you just created.

It's amazing how many times other people get stuck using your new user interface, and it only takes a couple of minutes (usually) to find the biggest problems.

Answer 13

If you are using a popup from the editor, be sure to return the insertion point or state to what it was before the popup. Too many programs just leave you hanging and need to find their way back.

Answer 14

Instead of arbitrary buttons “OK” and “Cancel”, which may be ambiguous in a given context, and users blindly press one, the buttons should contain a brief description of what they are doing.

[Ok, Please Cancel my subscription ], [ Please do not cancel my subscription ] 

much better than

 Cancel my subscription? [ OK ] [ Cancel ] 

(these crashes often appear on a daily basis)

Answer 15

• Collapse clicks
• Single view (text size, buttons and other controls)
• Minimize free changes ... (for example: in the address record ... specify the states in the drop-down list ... etc. etc.)
• In the drop-down list of countries ... first indicate the country of residence ... (how many of you are upset that the US is listed below and you need to scroll down?)
• General drop down lists can be ordered as users.
• No spelling msitake;) at all
• Pay attention to the text with the inscription: for the email address (enter the signature in the form of email ... trust me ... I saw it as an e_mail address :)
• Currency symbol for amounts. single digital display in quantity .. ex: $ 12.15 ==> $ 12.15 $ 10.9 ==> $ 10.90 9.Progress / Status bar
• A Buddy label to indicate an error field before the user clicks the OK / Save button (for example: for an email address, if there is no "@", there is no need to wait until the user clicks OK, and then give them an invalid email address)
• Avoid re-logins ... (for example: remember me on the login screen)
• global application that allows the user to continue working from the place where it was stopped in the previous instance)
• when displaying data in a grid ... excel style filter options
• default values ​​for inputs.

People ... do not hesitate to drop any of the above items with reasonable reasons !!!

Answer 16

Grandmaw test.

This is my term for the conceptual question: "Can your grandmother, who never used a computer outside of email and checked www.cutecats.com, use it?" (Assuming she has real knowledge to use this particular application). "

Everything in common should be obvious; nothing should be a black box mask with side effects. Unusual things should be available in the general format that the user used before.

Clear markings, clear the route to the help file, perform clear actions with obvious effects.

If Grandma can't use your Paint program, you really need to think about your interface.

Answer 17

My basic rule of user interface design is for each page to perform one task and only one task. It simplifies a simple page, which makes the design clean and makes the application more understandable.

This type of design is called the Inductive User Interface. Here is the document that Microsoft released in 2001 on this topic. The text may be a bit dated, but the principles are generally pretty good. The only caveat is that there is balance in the design of such an equilibrium. If you simplify too many users too much, you will have to move around the place to complete simple tasks, and the gain in comprehensibility will be lost for underproduction.

Answer 18

Some simple tips for daily web UI design and app design:

• Use simple static sketches to get started with your preliminary web application development plans. -Do not allow users too many options. instead, use the caterpal design to send users along a path they find useful. -Discover key user groups and trips they made -Use iterative design within the user interface to provide ROI

Answer 19

I like to follow these recommendations:

• Standard - follow known standards / patterns, reuse ideas from all products that you respect.
• Simple - simplify and simplify your decisions (if necessary)
• Elegant - use less to accomplish more