Tag Info

Hot answers tagged

216

It's a shame no one has mentioned the impact of the Mac OS X "Aqua" interface on all this. Aqua was the name Apple gave to the user interface style it introduced in Mac OS X. It changed the Mac's software from looking like this: …to looking like this: Here's Steve Jobs introducing it for the first time at MacWorld San Francisco 2000. As he says: ...


216

Persona Meet Carlos. He is an academic course-coordinator in a university. He is a very busy man who spends most of the day in front of his computer. User Observation As Carlos goes on about his daily tasks, every half an hour or so he checks the time. Reasons vary: How long has he got before the 11:00 meeting? How long before lunch time? How long ...


146

It's a big part of Skeuomorphism vs flat design, a debate about which Sacha Greif has a good writeup. Skeuomorphism like gloss, reflections and textures make things look like “real” objects, but all the fancy can increase cognitive load, and gives an unfortunate “samey” feel. The majority of iOS icons have the same or similar gloss effect on their icons, ...


105

Almost all of the testing I've managed has proven content delivered via carousels to be missed by users. Few interact with them and many comment that they look like adverts and so we've witnessed the banner blindness concept in full effect. In terms of space saving and content promotion a lot of competing messages get delivered in a single position that can ...


91

Carousels are effective at being able to tell people in Marketing/Senior Management that their latest idea is now on the Home Page. They are next to useless for users and often "skipped" because they look like advertisements. Hence they are a good technique for getting useless information on a Home Page (see first sentence of this post). In summary, use ...


84

Luke Wroblewski wrote about this in Top, Right or Left Aligned Form Labels (April, 2007). In it, he references eyetracking data from an article by Matteo Penzo called Label Placement in Forms (July, 2006). Matteo drew several conclusions from this study, including that right-aligned labels have a lighter cognitive workload for users: Alignment of ...


73

You're introducing two big problems right off the bat; breaking conventions and clashing styles. Don't forget that Apple and Microsoft have released different interface guidelines for their respective platforms : Windows UX Guidelines and the OS X UX Guidelines. Using conventions is important and helps users work in your app without thinking (Don't Make Me ...


73

An interesting read by John Gruber on the shift away from skeuomorphism makes the argument that increasing pixel density resolves some of the issues that gave rise to certain skeuomorphic practices like shadows and gradients: The trend away from skeuomorphic special effects in UI design is the beginning of the retina-resolution design era. Our designs no ...


60

You definitely should not make users learn new patterns (especially only due to personal preference). I think the right way to go is to follow the common practice, and I believe (please correct me if I'm wrong) the common practice in this case is using asterisk. You will, definitely, find other patterns in various applications, yet in this case, I think ...


59

Option 3 with no intrusive validation. 1 sucks because it's out of the norm. Copy and paste may or may not work. Tabbing to the next field may or may not work. People are good at correcting mistakes and the limited fields mess up their muscle memory. For example I might type 1912 When I meant 192 My fingers will nearly instantaneously correct ...


47

People don't generally use hierarchical structures 'in the real world' -- it seems to be something that has been forced upon them, a technical remnant of the past. What needs to be understood is the way that people recognise and organise things. Our brains don't work in a hierarchical way (without generating a lot of heat). Instead, we recognise things by ...


44

Not A Standard The usage of the asterisks as an indicator for a modified in-memory change is something that appears mostly on the Windows platform. Mac and Linux have not been too quick to follow this, but there are a few multi-platform editors that do use it. The asterisks is used when the UI element (title bar or tab) is capable of displaying only text. ...


43

I believe the going name for it is a Hamburger Menu, as a reference to the icon that's commonly used for it (, similar to the Unicode character ≡ U+2261 Identical To), and to the stacked nature of the drawer itself. Hamburger Drawer and Hamburger Sidebar would also be recognizable terms to the UX community. A bit of discussion on what I believe to be the ...


40

Just because your brand color is red doesn't make the use of red for errors obsolete, it's just a matter of extent. Take the Viaplay signup form for example: Viaplay has red as their main accent color, which is used throughout the website for actions buttons, icons, header, graphic elements etc.. however, in the form they do tone down the use. They ...


37

The users experience in your application should fit with the experience they have come to understand and work within in their chosen (or forced upon) OS. They have built laws and rules of interaction on that experience, for good or bad. A major drawback with designing an app to look more like OS X UI than Windows 7 or Vista UI is that the overall look and ...


36

This largely a question of design trends, but there are some UX aspects to it. Glossy icons and buttons were (arguably) mostly used to show affordance. It was also then used almost religiously in all Apple designs. Even today, most iOS icons are glossy by default. People don't neet to be shown some gloss or gradient to know that they can interact with ...


35

In all the testing I have done, home page carousels are completely ineffective. For one, anything beyond the initial view has a huge decrease in visitor interaction. And two, the chances that the information being displayed in the carousel matches what the visitor is looking for is slim. So in that case the carousel becomes a very large banner that gets ...


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.


32

Progressive disclosure Deferring advanced features to a secondary screen is one of the best ways to satisfy the conflicting requirements of power and simplicity. This is called progressive disclosure. You seem to be aware of this. Intimidating users An example of progressive disclosure is a search box. The search box typically contains a link to an ...


32

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 ...


30

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

As a user I find carousels faintly annoying: Most have usability fail which I fall into the categories described in this article: 5 Big Usability Mistakes Designers Make on Carousels No ability to bookmark a particular item on the carousel, for example take a look at the BBC News photo carousel they use: http://www.bbc.co.uk/news/world-africa-14619799 ...


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 ...


28

It can work well, but I wouldn't recommend the method that you are proposing. You can use breadcrumbs as a form of progress bar, which not only solves your navigation issue, but shows what still has to happen better than a pure progress bar. It is also common practice on some of the most used websites, so your users are likely to already be used to it. ...


27

Displaying multiple progress bars is not a new concept. Your case is an ideal scenario in which usage is justified. One progress bar represents the overall progress and the other represents the current task's progress. If you want to use just one bar, then it makes sense to show just the overall progress rather than showing the current task's progress. A ...


26

Offical Google Android Design Guidelines 10 Tips For Android UI Design Android UI Design Tips Designing For Android Android User Interface Design Android App Developers GUI Kits, Icons, Fonts and Tools Trending Android UI anti-patterns Google I/O 2010 - Android UI design patterns - In this session, the Android User Experience team will show the types of ...


26

You have a lot of information in that form - it isn't organized very well. Consider subdividing the form fields into logical groups that will help orient and guide the user (the HTML fieldset and legend tags work well here). Also, present a uniform visual style - right now your inputs are all over the place. Line up your form fields so that the user's eye ...


26

I don't think it's that the clock should be in a particular location, but rather that it's not in a particular location — namely the upper left, which tends to be the primary focus for most left-to-right language readers (and the clock is usually a secondary bit of information not pertinent to the immediate tasks). On a phone, however, it is perhaps ...


25

You're here! This is the right place! You can answer real people's real questions about real situations and needing real answers, - maybe with just real ideas, or with real mock-ups and real designs! All manner of problems and challenges are raised here - take a look at previous questions (especially the unaccepted/unanswered ones) or watch the new ones ...


25

The standard is that the light source is at the top of an item, as this is where light sources are usually located in real life (the Sun, ceiling lighting). Items lit from below or on top appear unnatural. Lighting and shadows help controls like buttons look like buttons, and that's what they should do. Whether the light comes from top or a little to the ...



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