Tag Info

Hot answers tagged

57

Selected – Create an inverted selection state which would make this feature more prominent. Many ways to accomplish but as an example; Make the button background black with a white or light grey pencil icon. Enabled – Increasing the contrast. Our eyes become less sensitive to light and see a narrower section of the colour spectrum as we age. Increasing the ...


45

contrast Your icons are lacking discernible contrast--both between the icon and the background, as well as between the active icons and inactive icons. Increase the contrast.


37

A save button should always save everything. Accidental data loss is about the worst thing that can happen to users. This is why many applications (e.g., GMail) don't even have save buttons; they just auto-save everything. If technically feasible, auto-saving is an even better solution (as long as there is an effective undo). Note: when auto-saving, it is ...


34

Simply because it requires less mental work :-) You are referring to a paradigm called WIMP, which was developed at Xerox PARC back in the 1970s. WIMP (Windows, Icons, Menus, Pointing devices) experimented with a "digital version" of real-life elements, represented by icons. This was very intuitive.


33

If you are looking for the most easily recognizable use of a 5-star system, they should work from left-to-right. The star-rating system is very common now, and when is the last time you say it work right-to-left? Users will likely find it confusing and will have difficultly understanding why they only gave something 2-stars, when the meant to give it ...


32

This menu got "famous" because Facebook and Path implemented it for the first time. Personally I'm not really attracted to this menu but if I need to choose a side I would choose the right side. That's because aprox. 67% of users use the right thumb (so that means the right hand) and in several studies have proved that the screen area is more difficult to ...


29

In the team I am on, our idea on the matter is as follows: Continue is used when you're talking about a directed flow forward only. Continue implies that anything you've done hitherto will be saved, so that you can move forward in the workflow. Ideally in a Continue-based setup, there will be alternate ways to return to previous app states, if your design ...


24

There are many factors contributing to this. Enterprise apps are evaluated by their functional features, not by their UI. When the UI does come into play, it's evaluated by its efficiency, not by its look and feel. By "efficiency" I mean comparisons like "with our software your employees will complete the task in 10 minutes, and with the competing software ...


23

Seamless has a nice implementation of this actually: Here, the user can slide each option either way, or just leave it and continue scrolling if the condition was not discussed. Adapted from the elegant and modern design of @tim.baker (I would just add in the "x"s and "check"s, to help with clarity and in case of a person who is colorblind). This also ...


21

I hate to be a stickler for tradition but I think, in this case, it sounds like management's taste in UI has over-taken the user experience. In UX terms there is nothing wrong with what you had, in fact it sounds lie it may have been better - given that everybody understood it. Colours also might help with your contrast ratios. It might be worth ...


19

No, skeuomorphism, as a UI tool, is used as much today as it always has been. What has changed are visual design trends. Though related to skeuomorphism, it isn't the same thing. The term skeuomorph isn't a well defined term. I'm going to borrow the image from Trevor's deleted answer (which, BTW, I think is a very valid answer) Where I usually find ...


18

Why not replicate the way the users are used to deal with this on a form? That's what you're basicaly already doing in your second mockup. download bmml source – Wireframes created with Balsamiq Mockups The way to change from the one into the other would be clicking on it, and cycling through the three states.


18

The interfaces may look very similar to you, but they are constantly evolving, and have been refined for many years. Firefox in particular is very open about their UX process, and how they rely on user telemetry to understand how people use their browser. They don't simply copy features. They try to understand their users. In the early days, browsers could ...


17

Your assumption is correct, items ordered in a vertical list rather than a horizontal list or as a grid is a lot easier on the eyes to scan. The reason is quite straight forward, horizontal lists need to span a larger area and therefore the user has to move their focus larger distances which is tiring on the eyes. Same thing with grids, here the user has ...


17

The idea behind this bar can be traced back to Gestalt's law of similarity which states: Elements within an assortment of objects are perceptually grouped together if they are similar to each other. This is why you shall see two columns in (a) and two rows in (b). The latter also demonstrates that colour wins over shape (in this specific example at ...


17

As often, we need to read the first section of the Wikipedia article. In computing, graphical user interface (GUI, sometimes pronounced "gooey", but more often as "gwee") is a type of user interface that allows users to interact with electronic devices through graphical icons and visual indicators such as secondary notation, as opposed to text-based ...


16

It might be a good idea to provide the percentage as additional information if applicable, and display the absolute changes instead, e.g. +9 (900%) but then leave it out if not applicable +10 This way a user recognises that there was a change and also gets an impression on how much has changed relative to the previous number.


15

Designers have to do what is best for the user First, why are you designing something? Users will not use products they don't like. If they are saddled with using them (e.g. their employer determines what they have to use at work), they will hate using products they don't like. If you don't care if anybody ever uses your design, then you are not bound by ...


15

The UI element you are referring to is called the List Builder Reference: http://msdn.microsoft.com/en-us/library/windows/desktop/dn742407.aspx#usage List builders allow users to create a list of choices by adding one item at a time, and optionally setting the list order. A list builder consists of two single-selection lists: the list on the left ...


14

There's a number of issues here. Input controls aren't meant for displaying data, they're meant for, well, input :). When you show a disabled textbox, the user understands that in some cases it can be enabled. You should use a read-only textbox for the folder path. It would be a good idea to populate the New Name field with the current name, and just name ...


14

Why don't you try something like this. Once the user clicks on the item to drag just highlight the valid and invalid sections like above. I would suggest you do it as soon as user clicks (before starting to drag), this will actually a pre cursor for the user, where to drop the item. In the approach mentioned by you, the user will actually drop the item ...


13

Netflix uses filled stars from the left even though the ratings are right aligned. This follows the ability to quickly scan down the list of ratings and quickly assess at a glance which film is higher rated. Same goes with Paragraph alignment, as per Evil Closet Monkey's answer.


13

Following the great work of Anders Taxboe who has categorized different types of UI elements in a classification which is easy to understand and easy to follow. At the very highest level he uses the following labels. It may look odd in the beginning, but going through each category, it makes the UI Design World quite understandable: Reference: UI ...


12

Sometimes it's called Token input. For example here: http://loopj.com/jquery-tokeninput/


12

Wikipedia says this on Enterprise Software: Enterprise software, also known as enterprise software application (ESA), is purposed-designed computer software used to satisfy the needs of an organization rather than individual users. Such organizations can vary from businesses, schools, interest-based user groups and clubs, retailers, or governments. ...


12

Playing sounds can be useful when showing error messages, information dialog boxes etc. However... It is not the responsibility of your application to force the user to hear these sounds. This is something that must be configurable by the user, and since most operating systems already have such a configuration possibility, I see no added value in creating ...


12

I believe it’s a means of providing the ability to cancel a half-executed command. Imagine a user is 45% down a long page. The user attempts to perform a drag operation on the contents of the window (maybe to move an icon or select some text), but accidentally “catches” the scrollbar slider instead, resulting in scrolling page to X% down, and leaving the ...


12

I am as surprised as you that users have difficulties to add a folder with this standard dialog window. But users are surprising, that is why we like them I don't think there is a perfect solution but maybe what you need is a combination of complementary solutions First you should keep this "folder selection" system because it is the more standard for ...


12

One idea: when the dragging starts, gray out the box and then if the user does drag over that region, make sure the mouse cursor indicates (red circle with a cross?) that region can't be dropped on. And extending that idea further: when the dragging starts use a red or gray to indicate it can't be dropped on, but also maybe use a green or some other ...


11

There are various approaches to this problem, but largely you need to consider the use of whitespace, grouping, and symmetry to create a balanced impression, as well as whether one or two of the images might reasonably act as primary images. Websites like Google and Flickr generally tend to resize some images to fit nicely into a row, but when your row only ...



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