A solution to this may be that when a maximum is reached, that the sliders cannot be moved any further, until the user reduces another. This allows them to have control of where percentages are being adjusted instead of some automatic adjustment by the sliders them selves. Only comparable examples I can think of a data usage calculators for pay monthly tariffs. The AT&T example actually gives you a warning when you reach the limit: http://www.att.com/att/datacalculator/ iWireless change the message to red when you've reached the maximum, but still indicate the level that you're currently at. In your case, the 100% total may then change red and show 120% for example, giving the user a visual queue of how much then need to reduce sliders by: http://www.iwireless.com/data-calculator.asp

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 others. You can't imagine how many discussions I had and how much advice I got on how to make this clear. Even using a highlight color (e.g. blue) wasn't always working. In the end, what worked best for us was to connect the buttons with the view they toggle and to indicate the currently selected view with an arrow. That's the solution we've found that reliably ended all discussions.

I say it depends on the styling of the flip switch i.e. does it seems 3 dimensional and what does the on state vs off state look like? Also think about context in relationship to other elements around it. For example if you had a group of these toggle switches and some of them were switched on and some of them were switched off than it will be more obvious to a user that these can be toggled. On the flip side of this if the toggle switch is alone it might be more difficult to allude to this fact.

As I rule, I try to avoid using hover for any actions that the user might want to perform. Hover is great for giving out extra information, but an action (or access to an action should be available on click. What will happen if the user is on a touchscreen without hover capabilities? Will that option not be available for him/her?

The label "refreshes every Z seconds" is a "dead" one, that doesn't convey the feeling the system is online and working. You can try instead add a countdown timer, that will show the time until the next refresh. This way, the user would know exactly when the next refresh is going to be, but still will have a feeling that the system would do it (you see the clock ticking!). I also suggest adding the "refresh now!" button next to it, for those eager users with no patience. download bmml source – Wireframes created with Balsamiq Mockups

You are asking the wrong question. The point of showing the number of items in the cart is to show the 'Status' of the cart. It works as a really good signifier to the user that he has added X number of items in the cart. Scenarios to think when you do not show number of items: You add an item to the cart, but, actually the click didn't register and you are unaware of this. There is no way of confirming the 'addition to cart' without manually click the cart and viewing it after every edit. You double click an item and it gets added multiple times to your cart. Same as above, action cannot be checked unless cart is manually inspected. These situations can be fixed by changing the interactions and designs during the add to cart and other related phases, but, why would you like to go through that much work when you can just show the number directly. On a personal note, I would be quite frustrated and might end up never visiting the site again if it did not match such basic expectations. It's a terrible user experience. On the matter of price, I think it matters to show the price in certain cases where you have other restrictions eg: Minimum bill of 20$ required for home delivery or something. In such cases it helps the user keep track of how much he needs to order or not.

Best strategy is to place the cursor in the first expected input field as soon as the page loads. Remove the need for selecting the field completely. However, if the user can have more than one alternatives, you should avoid auto selecting since it can lead to confusion. As for the next fields, use a proper tab-navigation to allow a mouse free typing experience. eg: Look at facebook and gmail login pages, as soon as the page loads the cursor is already in the username field. If you want to annoy the users who left their speakers on, you can start making error beeps when the user starts mashing keys outside of the input fields. (Problem is, it messes with the browsers keyboard navigation shortcuts)

If you want to sort of the selection, then you should go ahead and add a label to the field. Else, you will be breaking your system's consistency. download bmml source – Wireframes created with Balsamiq Mockups

Highlighting the entire row should be a good indicator. download bmml source – Wireframes created with Balsamiq Mockups Changing the background color (of the row) also helps. download bmml source

There are two ways to go: Pick indicators that don't have a value attached to them. Disabled/enabled clearly has one set valued differently from the other, whereas blue/purple doesn't. Pick indicators that support the goals of the user of the system. If someone needs to go through all people that aren't checked in, they should stand out (and vice versa). You could use checked/unchecked boxes or a color combination (e.g. disabled (grey) / enabled (colored) )that supports that. If your interface can be used in a way that users might sometimes be interested in the people that are checked in and other times more interested in those that aren't, that speaks against option 2. If those two workflows are separated you might be able to have one set of people stand out in a way that makes the workflow easier.

Since there are different type of roles it is probably a good idea to separate their management. You could use something like that for roles that are unique : I'm of the assumption that the administrator knows the users she want to be Finance and Legal. download bmml source – Wireframes created with Balsamiq Mockups If it is relevant you can remind this role next to the user's name in the matrix.

Am using different messages in different examples, pick whichever one sounds better in your use case. On the page where the user is redirected, display a message 'Your file is being downloaded. Check your download folder when the download is completed.' Be explicit to avoid confusions. You can have a splash/overlay message saying 'Your file download has started...' and the user can dismiss it and continue with his work.

This may be a case of tailoring your content and page to show the correct visual hierarchy. If having a testimonial isn’t the most important piece of content on the page and not what you want the user to focus on, you might consider moving it to the right column with the other content and putting it at the bottom. You will also want to give it the least amount of visual weight so user’s eyes aren’t drawn towards it instead of the content you want them to see first. You could achieve this by decreasing the font weight, picture size or border weight. Visual Hierarchy Objects with highest contrast to their surroundings are recognized first by the human mind. When an element in a visual field disconnects from the ‘whole’ created by the brain’s perceptual organization, it “stands out” to the viewer. The shapes that disconnect most severely from their surroundings stand out the most.

1) to display content: is it better to use a 3D animation representing something like a folding notebook? Or using plane paginated tabs over the background image? You don't provide any insight into the kind of information or it's structure. If this is just a question about the pro's and cons of a visual design... I'd say both options are viable, but it's usually easier to create a high class look and feel by keeping it plain. Unless you need a 3D animation to matches other parts of the design I'd keep away from such a thing. But that's almost personal preference. 2) is it better using the real captured image as background, or substitute it with a static product image. This way people won't be forced to stay right in front of the label during the navigation. It could get really annoying if the information disappears as soon as the camera isn't looking at the product anymore. I'd propose capturing an image with the camera and keeping that as a static background behind the information. Alternatively you could use a stock image here, because now the image isn't the focus anymore but the information is. And only change the information that is displayed when a user actively scans a different product.

No, it is not good idea, because: The equipment is rarely findable by users, even with blinking lams, especially in such dense and plural environment, as office and restaurants, not fields and forests :). The coverage of networks usually is greater than strait visibility of the area. The design of such equipment is hard to implement without visual imbalance in any interiors, and it's forms are rarely have enough affordance to straightly identify them with Wi-Fi or Cellphone network accessible. Final and most important note: People do usually search networks by using their devices for scanning and looking for typical signage (for instance, icons "wifi zone" at entrance doors). So it is better to make good signage at good places (entrances), clear network names and other accessible options than to show ugly and rarely unfamiliar equipment in areas, that do not suppose to make it visible.

I don't see any disconnect at all between the two. Most people will have a faster response to objects on the right side of their visual field. So that applies to moving balls; tigers that want to eat you; etc. It is about a tiny increase in visual perception. This has nothing to do with learned importance. Reading from left to right has taught us that we start reading on the left, and so text on the left will be processed first. It's important to remember that the processing of what we read takes significantly longer that the tiny delay in perception for items on the left when compared to items on the right. As a result of our left to right reading (for most people), interfaces have put the more important things, or things that the designers want us to read first, on the left. This has re-enforced our concept of the left being where we start. TL;DR: Speed of perception is not the same as importance Something else to note is that most content is on the left side of the page, and so Nielsen's graph is misleading. Of course we spend most of our attention on where content is.

There are two main eye patterns for web design. The first: F-Shaped Reading Pattern The second: ZigZag/Triangle Reading Pattern Deisngs that fit into one of these two will work well with user. However if you are looking to get even more creative you can try out using the Golden Ratio to design a webpage, specifically placing content in the golden spiral formation.

Default signs in most finance systems are arrow indicators: red down arrow for spent and green up arrow for received money. So it is the clearest way to represent balances using such signs, for instance in such compact way: download bmml source – Wireframes created with Balsamiq Mockups

Came across this post today and wanted to provide a response based on some developments in the past couple of years (since 2012). Google offers a good solution signaling its Gmail users of sortable elements by using two rows of stacked dots on hover (desktop)

I haven't see many of them, but here are my impressions from the link you gave: If it's on the top, I see it as a visual design element that probably doesn't mean anything. If it's on certain elements but not others, I have to think (usually a bad thing) about what it means based on the context. If it's on the bottom right, though, it immediately makes me think of a book turning to the next page, and so I try to click on it to see more content. On the web, though, this usually isn't a good experience because it just acts as a link, but I expect it to complete the metaphor (as on iOS) and have a page-turning animation.