Tag Info

Hot answers tagged

26

On a slightly related note; there have been some studies into rounded corners vs sharp ones and whether rounded ones aid cognition. "A rectangle with sharp edges takes indeed a little bit more cognitive visible effort than for example an ellipse of the same size. Our "fovea-eye" is even faster in recording a circle. Edges involve additional neuronal ...


20

Many years ago That's probably the key factor. The rendering technology we now have is considerably different than what we had in say 1985 or 1995. Now, that shouldn't really change the principles of good icon design, but it has changed the trends over the years. OS X and Windows have become progressively 'shinier' over the years at times implementing ...


20

The problem lies in why the button was hidden in the first place. Presumably not for space-saving reasons, but for aesthetic reasons. This effectively rules out any visual representation on the device (otherwise, why not just put the button where people can see it?). The only options at that point are to draw attention to the button in other ways, of which ...


19

Typically even a tri-state checkbox is still to be treated as a two-state check box in terms of the user's interaction. The user should not be able to switch it between all three states - only between checked and unchecked. It is only if the information that is related is not in either state that the box is 'displayed' in the tri-state. What does it even ...


17

Fade out the edge that wraps (as well as leaving the button hanging over the edge so that it's clearer that there is more unseen content. Clearer because not only is what is off screen not visible but a little bit of what is on screen is not visible as well. Alternatively try and make out that it's like a conveyor belt or something that physically wraps ...


16

The whole of the following linked article is interesting, but the following section is pertinent and I think worth including in the context of this question, even though not providing actual patterns. From Scott Berkun's The myth of discoverability (2003) How do you actually make something discoverable? As a designer, you have a handful of ...


16

Affordance is related to the object itself. Eg: A button looks clickable. Discoverability is related to the product/solution. Eg: An image-manipulation toolbar shows all features it is possible to use when you want to work with an image. A physical example: If you walk down a corridor, then the affordance of the door-handles will "tell you" how it ...


16

I think Instagram relies on the concept of accidental discovery to try and get users to realize that double tap leads to Liking. IOS uses that extensively to show features and options to users which are often discovered accidentally . With example to why Instagram went for the option of double tap to like, I believe it is because the tap is the common ...


13

The option of unlimited could be indicated by a simple checkbox which, when checked, disables the other field. This could be located in close proximity to the original field so its association is obvious. The control now becomes a coupled pair of controls that act as one. In the Bittorrent example in the question it would be positioned inside the field ...


12

Try using psychology. We've been exploring social proof and set completion in our app to get people to try out more stuff. It boils down to keeping track of features they use and then suggesting that if they use one more, they'll complete some visible metric (like a badge, or a LinkedIn-style profile completion meter). We don't actually give them anything, ...


12

I agree 100%, the edges of the andriod icons are nice each by themselves but when scanning the eye gets very confused. However, the advice from that tutorial is still solid. They are talking about within the icon. Bold shapes and unique contours catch peopels eye. A few more bits of advice I gleaned from a presentation from Bess Ho: (You can check it out ...


12

One idea is to align the functionality you want discovered with existing user behaviour. (I only have one example in mind, so can't in good honesty call this a "pattern" just yet.) The example of this method is noticing that users tend to reflexively attempt to scroll for more in twitter or rss iphone/ipad apps, especially if the twitter/rss stream tends to ...


11

There are two major visual pathways that help us recognise objects: the dorsal pathway, which is all about working out where stuff is and how we might interact with it; and the ventral pathway, which is about what that stuff actually looks like. (Ungerleider & Mishkin, 1983; Goodale & Milner, 1992). Evidence from neuroimaging studies suggests that ...


10

They're definitely different principles. Affordance aids discovery, but discovery isn't about the visual look and feel at all; it's not even about expressing what a single control does. Say you have a delete button, it's red clearly 3D, depresses when you press it, just begs to be touched, and has a big trash can icon on it with the word "DELETE" written ...


9

There are lots of ways to do this, but I would recommend against using an icon like the one you have chosen (which could be platform specific). The concept of more information is a bit abstract to represent with an icon that can easily translate across cultures. Option 1 If the information is to be shown in a overlay panel, then a downward arrow should be ...


8

My preferred approach is this: It's changing the dynamic from it being an advert to it being signposting. In this case you're being signposted to the advert information. This largely overcomes the ad-blindness problem. The most important place to advertise new features is on the page the new feature will be used from. If your acme-data-munger now ...


7

Just to be slightly contrary... is there a possibility that the users aren't using them because they're not the right features? Where do the features come from? Who are they targeted at? What needs are they addressing? Can you tell a story to the users about the new feature where it's solving a problem that they have? If there are more features coming ...


7

Basically 2 ideas here, the first is showing small circles, the one highlighted in the center is the current page/album being shown, as you click on the arrows it would highlight the next/previous one. This gives the users an idea of how many albums are available for the given artist. (re-purposing of Matt Lutze excellent ASCII drawing) [Settings] [Random ...


7

How about rearranging that whole construct and change its wording? I would suggest something like [x] Limit download rate to [.......] kB/s with the [x] being your checkbox. If unchecked, the whole thing would become disabled. This would work similarly for your transcoding option - ask if the resolution should be changed at all, and if so, enable that ...


7

The use of Android's contours definitely limits the search space as compared to no change of contours (and the whole point of scanning is to limit search space by doing easy preliminary check). I can totally see why the speaker and camera icon are confusing because they are very similar, BUT you still need to only differentiate between two icons that are ...


7

For me, the approach you have used for having icons scroll along a UI item that looks like part of the keyboard (a real-world item) does not work. A keyboard in real life does not have a revolving panel, so the fact that you are trying to create something that looks like a real-world item, and then make it do something that wouldn’t happen in real life, will ...


7

I answered a similar question a while ago, here are some insights from the relevant part of the answer: The big challenge about keyboard shortcuts is to make them learnable and discoverable. The former can be addressed by following conventions and "mnemotechnics", ie. HJKL for navigation, F for "Favorite" and L for "Like" and for the latter I can ...


6

I don't know where I saw it, but the best timezone picker I ever saw allowed you to pick a map that had shaded bands for timezones allowing you to pick the band. It was the easiest I've ever seen and the most intuitive. Ubuntu for example:


6

I know this question is answered and all, but I've just seen this and thought it was relevant. UX Movement | Why Distinct Icon Outlines Help Users Scan Faster


6

New users will be overwhelmed with too many options or functions, while experienced users are likely to want many more than they already have. The solution to this is progressive revelation or treasure hunt if you prefer. When a new user starts with the application, give them just the basics that they need to get things done - hide everything else. That ...


6

If the user is very likely to want see the more-info details you could find it worthwhile to go to a fixed master-child UI layout, similar to illustrated. This provides affordance and fixed positioning for data. download bmml source – Wireframes created with Balsamiq Mockups Note details area could be positioned at right hand side of ...


5

Is the item something that you can add a tooltip? For instance, on a forgot-password image, I added a tooltip: <a href="{% url password-reset %}"><img src="/media/bitmaps/qmark.png/" title="forgot password?" width="50" height="50" /></a> Which results in Alternately, if it's not some single object(s), then what about storing a ...


5

Summary A way to get good affordance and reduce navigation actions is to provide two routes to 'assess'. One route uses a button with good affordance, the other is direct from the sparklines. The combined result is a UI that is discoverable - users will find the assess function - and it is efficient - experienced users will be able to use it with minimal ...


5

If you want to do it via Ad banners (leaderboard/sidebar) then I'd style the banners visually consistent with the rest of the site design. This way they'll stand out from the random Ad banners. However, the downside of Ad banners is that most people are conditioned not to look at them regardless, especially on the sidebar(aka junk drawer). Since your goal ...


5

You have a couple of other options to: when the site loads make the scroll bar visible for 3-5 seconds, then make it go away, it will probably make the user focus on that area you could always put an arrow down to symbolize the more option for that panel and try to integrate the arrow within the pane with the items so that when the user goes over it it ...



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