Tag Info

Hot answers tagged

46

As you correctly point out, this is a typical problem you encounter when you have a set of only two elements: it's never quite clear which element is selected. It seems to be difficult to highlight or otherwise emphasize the currently selected element. In my experience, stemming mostly from user research we did, what works for one user, doesn't work for ...


27

If there are two options, you could consider using a switch/toggle instead of an arrow as well. Took this from Dribbble:


26

First of all: why do you ask at all? Why not simply always send the gift card with the order? Who would object to getting more value than what they ordered? If you don't ask, you don't have your problem to begin with. Generally, asking fewer questions from the user results in higher conversion, so from that perspective, removing the whole question would be ...


23

You could use a source area (list of items) and a target area (drop zone), to which the user can drag items from the list. download bmml source – Wireframes created with Balsamiq Mockups The drop zone should clearly state how many items are need to be placed there. I suggest to use a text message that emphasizes the remaining count of items, ...


23

two rows of radio buttons as e.g. on the wikipedia http://en.wikipedia.org/w/index.php?title=Wikipedia&action=history


22

First things first; you're not really asking them to pick one plan out of 100 distinct options, you're asking them how many users they want. Make the form input reflect that. Technically on your end they are picking one from 100 distinct plans, but that's an implementation issue, don't make your users worry about it. Sounds like what you really want is an ...


21

I'd suggest putting a button that they have to press to complete the selection, and using that button's label text and active/disabled state to transmit the information you want to pass to the user. Something like this: download bmml source – Wireframes created with Balsamiq Mockups The idea is that the combination of the selected options and ...


20

By definition, a filter is a tool that help users narrow down to a subset of results that is most interesting to them. Consequently, when a filter is active, the results displayed should be less than the total number of original results. For this reason, I find option B not intuitive enough. If I'm not mistaken, option B treats the icons using an additive ...


18

The best interface is no interface at all! Have your site detect visitors' counties by their IP address. You can do this to 99.5% accuracy for free. Pete


18

Keyboard The Shift modifier is used for keyboard selection as well, and not just for single selection. No matter where you are, no matter how long the list, [Shift] + [END] selects everything from your current item focus to the end of the list, [Shift] + [PgDwn] one page (however that is defined). This also combines with the word jump of Ctrl where ...


18

download bmml source – Wireframes created with Balsamiq Mockups You can go to a two Combo interface. The first one with all the choices, and the second one with all the choices and an empty field.


18

You give the entire list on the left side. Once the first item is selected show the selected item in right top window. Once the second item is selected show you can show the comparison between the two. Edited Components List (Collection of Nodes) Box A (For Node A) Box B (For Node B) On Mouse Over on any node show the option to select A or B (No ...


17

The short answer is no, don't use country flags. http://www.456bereastreet.com/archive/200604/indicating_language_choice_flags_text_both_neither/ The preferred method is to use the name of the language in the language itself (and watch out for diacriticals, language specific capitalization, etc).


16

One solution is to show a magnified version directly above where the user is currently hovering. Look at how YouTube deals with seeking long videos, for example: This allows the user to select a rough time period they are interested in, then make a finer selection using the shorter-interval magnification. The Music app on the iPhone/iPod has a feature ...


16

Instead of double clicking to finish, you could: Click the starting point to close the shape (assuming all shapes are closed in) Have a button nearby labeled "Finished" or "Close Shape" or "I'm Done" etc. that closes the shape If you aren't able to use the OS to detect double clicks, I'd avoid them altogether. I've seen people with disabilities have the ...


15

A dropdown with 450+ values is extremely unusable on any device, including desktop. But you say that you're only looking for a solution for the basic mobile version, so let's stick to that. Probably the best way to simplify this for the mobile is to have a first screen/popup display the alphabet, then as you tap a letter you drill down to the list of ...


13

If you have a default that will be true in most cases, you should consider using it. Otherwise, I would avoid pre-selecting radio buttons. The prime reason being that you have no way of knowing whether someone actually wants it selected or they just missed it. In addition to that, if your radio buttons are only a Yes/No question, then I would suggest using ...


13

Having your cursor slanted would be a UX improvement over a permanently vertical cursor. Many word processors already do this. Here are some examples from MS Word: It gives additional feedback to a user that the text they enter will be italic, and it is visually less confusing when selecting text. At the same time, I can't think of any reason that it ...


13

Not a complete answer, but some thoughts about why drag-and-select is not so good. Dragging with a pressed mouse button is physically hard to do. You have to keep a constant pressure on the mouse button, and if it becomes too light, your work is undone. Too much pressure and the mouse can't glide well, and the cheap ones feel like they will fall apart in ...


12

First, connect list A to list B visually, possibly like this: Then also position the character box below both list A and list B. You would then have a clear hierarchy of connectedness.


12

Unless you have auto complete, a list with 450+ options is never very user friendly, and always hard to use, especially when you even allow multiple selections. Given that the task to add books to the library is a very common one, that should be done fast, I would propose a more simpler backend-powered solution using two simple steps: First the user is ...


12

There is no recommended maximum number of items to put in a drop down list. No-one can say the maximum is 7 or 12 or 200 or 10,000 and definitively say that for all scenarios, that is the maximum you should use. There is a myth for drop down lists and menus that you should not use more than 7 +/- 2 because that's how your memory chunks things, but that's ...


10

I would have a fist checkbox called something more descriptive like "All permissions" or "Admin". I would then make the other checkboxes visible (or active) based on whether that checkbox was selected. This should be fairly easy to implement, and should be visually clear and fast to scan. Example mockup:


10

Windows default double-click time is 500 ms (half a second) Reference http://msdn.microsoft.com/en-us/library/windows/desktop/bb760404(v=vs.85).aspx


9

Double clicking is more of a problem on touch screen devices (or even just cheaper laptops) where the finger or a stylus is used instead of the easier-to-double-click mouse. The problem is some people suffer from (Pam Martin's) Double Dysclicksia - as argued by Jef Raskin in The Humane Interface. New Directions for Designing Interactive Systems (Chapter ...


9

Why not try something like what you get in the iOS Mail app. A simple text input field Drop down auto suggest (just like in Google Search) When you have added a single item (like author in your case), you can type another one, by pushing the + button at the end of the input field (and previously entered items can be deleted ony by one.) This solution ...


9

I can think of three approaches for this : download bmml source – Wireframes created with Balsamiq Mockups With regards to letting the user know at which point the device is unsupported,I would suggest doing it at the earliest so that the customer agent doesn't spend a great deal of time trying to help and then in the end give the response that ...


9

Take a look at the bigger picture. What is the user going to do next? Probably not undo - possible but not probable? If the likely next step is to move another item from the left list to the right then you should leave focus on the next item in the source list, so that the user can move multiple items easily be sequential pressing of the arrow button. So to ...


9

Is the concern about implementation or UI clarity? I can't see why a "Select Full Row" option should be any harder to implement than the rest. A sugesstion might be to somehow highlight the last column a bit differently than the rest since it performs a function somewhat larger than the rest too. I'd almost be tempted to make that "Select Full Row" a ...


9

This sounds like a case of inline editing. We use inline editing across the app that we're developing. What it means is that the data is saved to the server via ajax without a page reload. Since there is no page reload the user needs to get feedback to show him that he has triggered a save, which can be done by highlighting the saved field (our field ...



Only top voted, non community-wiki answers of a minimum length are eligible