Reusable solutions for commonly occurring problems in user interface and user experience design.
16
votes
5answers
2k views
The notification tray at the top of Stack Exchange sites: what is it called? And are there other good examples of this?
I'm trying to clean up notifications for a client site and was wondering if the notification pattern that Stack Exchange employs has a name that I can use to search for more examples.
34
votes
6answers
5k views
When is endless paging appropriate?
When is it appropriate to use endless paging in a web application (e.g. auto load or a "see more" link)?
Examples
Google Reader
Facebook
This also creates a few issues for the user:
Returning ...
29
votes
1answer
3k views
What is the significance of the three dots “…” on menus and buttons and how to use them right?
Adding three dots after the title of items in a dropdown menu seems to be a common practice (as you can see on the picture of a drop down menu in Google Chrome). They generaly mean that there is ...
20
votes
6answers
2k views
Why does the golden ratio work? Or does it?
This is just one example of an article promoting use of the golden ratio in design. Over the past few years I've seen quite a few similar articles, but none of them really seem to go into depth beyond ...
4
votes
5answers
567 views
Where do people get web design patterns/inspiration from?
I like to think I come up with original concepts as and when I can but I do find it really gives me a kick start when I can see examples of what other people have been doing to inspire my own design ...
6
votes
4answers
2k views
Best Web UI for Large Amounts of Data Input
I'm looking for a good solution when users need to enter large amounts of data into a web application.
Example
A store owner wants to enter 30-40
new products into the system every
month. The ...
4
votes
3answers
3k views
Table data in Mobile phones
I want to display a table with 4/5 columns and possibly 100 rows (as in desktop app right now) in smartphones. The table cells are also editable. Now we want to port this desktop app to smartphones ...
18
votes
8answers
737 views
What are the best IxD/UI Pattern libraries? [closed]
Quite a few question as about design patterns for x or y interface. Where are the best design pattern libraries?
13
votes
8answers
1k views
Do you know any comparative resources like mobile-patterns.com [closed]
Mari Sheibley is the lead designer of foursquare and has created this awesome site comparing mobile UI patterns - for example showing how a feed page looks in different applications, etc.
I've found ...
23
votes
9answers
1k views
What is a good way to display infinite nested comments?
Is there a way to do infinite nested comment threads in a way that doesn't look horrible? I realize that one could simply restrict the levels of nesting, but perhaps there's a better way of indicating ...
22
votes
6answers
1k views
Best UI pattern for letting a user assign items to groups
Problem: the user has a list of about 5-20 uncategorised items and needs to categorize them into 2-4 groups. The tricky part is that the same item can be placed into more than one group (this is an ...
7
votes
4answers
832 views
Good solutions for boolean filter with sub conditions
I'm looking for a good and a clearly represented solution for a boolean filter with sub conditions (max. 5 Levels). Best, a variant with tables. Many apps use the typical mac osx filter (see ...
24
votes
7answers
2k views
When should you use a modal dialog box?
There seems to be an increasing use of modal dialog boxes on the web, but when should you use them? Why would you choose to use them instead of inline controls or another page, and when should you ...
4
votes
2answers
1k views
What is the difference between a 'slider', a 'gallery' and a 'carousel'?
From a pattern perspective is there a difference? Or are they really different names for the same thing?
3
votes
2answers
793 views
When designing (UX/IA) a property search system what are some important things to remember?
I'm designing the UX for a property search system. The platform is FSIS. I am basically looking for best practices in doing a Faceted Search while being able to incorporate many refiners based off the ...
3
votes
3answers
855 views
What are innovative, new ways to design Master/Child relationships on a page?
I'm currently working on a ASP.net application that has a variety of master, child relationships, portrayed on the page in a master gridview with tabs below. While this works for a somewhat small set ...
2
votes
3answers
216 views
UI: name of multiple column interface?
Is there a "proper" name for the UI wherein it has multiple columns, and as you interact with the first column, the second column gets populated with with appropriate data? These columns act as a ...
25
votes
4answers
1k views
Design Patterns for Discoverability
What are some tried and true design patterns for discoverability in UI/UX, where information or a feature isn't necessarily overt at first glance, but is discoverable by using the interface through ...
11
votes
3answers
2k views
Design pattern or best practices for top notification bars?
The top notification bar on SE pops up to show messages like 'badge x earned'. What are the best practices for this type of UI?
Specific details:
On showing - Displace content downward (like on SE) ...
21
votes
2answers
1k views
Do progress bars help completion rates?
I'm expanding on a question I posed in comments on How do you indicate progress to users in a multi-step form?.
Roland made the comment "because everybody wants to reach 100% percent" when discussing ...
6
votes
2answers
575 views
Industry standard for documenting IxD / UI Design Patterns?
What's the industry-standard way to document a design pattern?
I have seen websites like ui-patterns.com and patternry.com that host and share design patterns, but when creating an reusing a design ...
18
votes
5answers
793 views
What should be the difference between enabled and disabled buttons? (especially if they are grey)
What is the best way to show that a button is Enabled or Disabled? (especially if it has grey color)
For example what do you feel about the following button? Is it enabled or disabled?
How could it ...
13
votes
3answers
760 views
Labels above the field or to the side of the field? What about prompt text and validation messages?
Which layout works best for your users?:
Field labels on the side of fields
Field labels above the data entry fields
What about prompt text, format tips, examples and validation or error messages?
...
11
votes
5answers
1k views
How to represent optional fields?
I've read somewhere, that if you have more required fields than optional, best practice is to mark the optional form fields.
However I think that asterisk notation for required fields is a widely ...
4
votes
6answers
555 views
Creating a shared pattern library
I work in a small but growing team of UX designers developing a suite of web applications. It's become obvious that we would benefit from a common pattern library, but are unsure how to get started or ...
21
votes
5answers
1k views
Should Android and iPhone UI be different?
I'm not completely new to developing apps, but I'm at a point where I'm trying to develop something and deploy it on several mobile platforms. To only concentrate on two major ones, suppose I'm ...
8
votes
4answers
1k views
ICS style guide - Is there a standard icon to indicate drag and drop in a list view?
I searched here but didn't see an answer. I've gone through the new ICS Android design guidelines but did not see a standard icon or recommended icon for drag and drop in list views.
Is there one? ...
5
votes
3answers
464 views
What is the UI pattern used for managing people in Google+ called?
I've tried to find more info on this particular UI pattern Google+ exposes, and I'm sure I've seen it before, but still, I haven't been able to find references to it.
If you go to the Circles section ...
2
votes
2answers
193 views
What's the best design pattern for splitting things in parts?
I want to design the following interaction: user buys 1 ton of sugar and 100 apples, and wants it to be shipped to him in 3 different packs:
Pack 1: 200 kg of sugar and 50 apples
Pack 2: 100 kg of ...
8
votes
1answer
589 views
Case studies on using gradients in a design
Are there any case studies on the use of gradients in a web design? I'm looking for answers similar to this answer about the usability of rounded corners.
Specifically, I'd like to know:
Is there a ...
6
votes
2answers
172 views
Layout for adding one or more contacts to a record
The context:
The user is creating a client record. Against each record their could be one or more contacts (people) provided. Often this will be adding 1 or 2 but could sometimes be up to 5-10.
The ...
6
votes
3answers
592 views
Problem with avoiding right caret on Android
I am currently adapting an Android app to follow the design guidelines more and more.
One thing I am doing is removing the right carets as suggested. While this works fine for listview where each ...
21
votes
7answers
3k views
Why did scrolling vertically became a pattern?
Why do most of today's websites, especially news and blogs, use mostly vertical scrolling?
Also why has it become a pattern, that the more you scroll down you find older material, rather than ...
16
votes
6answers
2k views
Autosave UI pattern
I'm developing a web app that puts great focus on simplicity and "just-use" mentality. The basic idea is to write notes. When planning the concept, we where very positive towards the idea of ...
10
votes
1answer
771 views
How do I make a table row on a web page look draggable?
I have a table on a web page where I need to let the user reorder the rows. I was thinking of letting the user drag the rows to reorder them. But how would I let the user know that he could do that? ...
8
votes
4answers
451 views
What is the name of this combined button/popupbutton?
This button is in the new Firefox, but what is the name of it?
5
votes
2answers
5k views
A Better alternative to display Hierarchical Data than using TreeView
I am a ASP.net Developer and am looking out for other alternatives to Treeview control. Reason behind is shipping too much of viewstate information for each request. Functionality of treeview would be ...
3
votes
5answers
1k views
Slide out teasers near the bottom of the page?
On more and more sites now I'm seeing what I'm calling "slide out teasers" appearing at the bottom of pages. What happens is I'm scrolling down the page and nearing the bottom, and then a small box ...
3
votes
2answers
447 views
How to use topic maps
Some time ago I found a very interested technology: Topic Maps.
It solves to find information and to share knowledge. One of examples of this technology is presented on this site. See "tags", ...
11
votes
1answer
365 views
Is there a name for the pattern of a categorized autocomplete?
Lately, I've noticed that Facebook search presents it's autocomplete options as a nice categorized list:
However, I'm uncertain what to call this pattern. It reminds me a bit of what Peter Morville ...
6
votes
5answers
176 views
Is there a pattern for cycling or toggling through time periods?
I'm looking for a pattern for toggling between different periods of time. Currently I've prototyped an example which is a single button that, when tapped, will cycle through 3 time periods: by month, ...
5
votes
4answers
749 views
Design pattern for merging duplicate contacts?
Have you seen any good examples of applications (web or desktop) that make it easy for a user to identify and merge duplicate contacts or other records? We need our users to manually approve the merge ...
5
votes
3answers
516 views
is there a name for the itunes selection design pattern [duplicate]
Possible Duplicate:
UI: name of multiple column interface?
you know: with multiple select boxes arranged horizontally, with selection filtering from left to right....
4
votes
2answers
177 views
How to best enter long digits on a small touch device without using keyboard input
my current task is to create an user interface for a mobile strategy game. stuff can be transported from point a to point b. the user can select an amount of stuff between 1 and 1.000.000. it is ...
3
votes
1answer
279 views
Internal Consistency vs. Consistency across the Industry
Does anyone have any recommendations on how to balance having styles/patterns/icons being consistent to a single website vs following recommended practices/patterns/icons that are popping up across ...
2
votes
1answer
424 views
Patterns and models for representing Many-to-many relationships in interface design
I seem to spend a lot of time trying to figure out how to design User Interfaces for many-to-many database relationships.
There are lots of resources available to assist with the data-modelling ...
0
votes
0answers
222 views
UX design pattern for whitespace [closed]
I logged in my Google+ today and found out that they change their user interface. I haven't notice the large whitespace on the right-side of news feed until only when I have seen a post that hundreds ...
0
votes
2answers
424 views
What are some wpf specific design resources for best practise in themeing controls? [closed]
What are some wpf specific design resources for best practise in themeing controls?
Could you design legends point me to some sweet resources for themeing of WPF controls?
I'm familiar with some of ...
