Reusable solutions for commonly occurring problems in user interface and user experience design.

learn more… | top users | synonyms (1)

1
vote
2answers
819 views

“Compare products” functionality on a product listing

Are there any good practices when it comes to "Compare products" functionality on product listings? I would like to do some A/B testing with different ones, but to be honest I have not seen something ...
2
votes
2answers
119 views

Is a “Clear input” button only for search fields?

I noticed that the "Clear button" are usually found in search fields: Why is it so uncommon for this button to appear in other input fields. For example this small configuration form:
2
votes
1answer
62 views

Shopping cart in store management software

I'm currently designing a store management application to be used by employees of certain stores. At many points within the processes of this store, the user should be able to search the database of ...
2
votes
1answer
268 views

Filtering results in a given radius [closed]

I have the following structure on the server : Parent -> child object. I have around 30-40 parents which each parent has 1-10 childs. A user can search children at a given point in a given a radius, ...
0
votes
2answers
41 views

Begin the column at the top of the title or at the top of the first main content text block?

On our homepage we have a content and a column with some boxes. What is the better approach: 1. Begin the first column box at the top of the title: 2. Begin the first column box at the top of the ...
6
votes
3answers
2k 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 ...
0
votes
1answer
99 views

UI design pattern, or excellent example, for repeat delivery

Suppose I'm running a website that does repeat deliveries (e.g., ship you a Nuttella sandwhich and a tin of spam once a week). Are there any prevailing UI design patterns for displaying a customer's ...
55
votes
5answers
8k views

Should “Deletion successful” confirmation be red, or green?

What color should a deletion confirmation message be? This is related to the question Should 'yes, delete it' be red, or green?, but different because this question asks about a passive confirmation ...
34
votes
8answers
6k 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 ...
3
votes
1answer
63 views

Introducing a new pattern vs learned pattern

Assume that I have a heat map UI showing company stocks. The current pattern that users have been exposed to for the past 2 years is dark green being low value and light green being high value. To me, ...
15
votes
3answers
3k views

What do you call websites that make heavy use of vertical scrolling?

This question is similar to Why did scrolling vertically became a pattern? I see a lot of modern websites moving to larger, singular pages with more content and more vertical scrolling. This is often ...
4
votes
3answers
301 views

Is it better for website accessibility to have the menu before or after the content

I have seen two approaches to menu/content markup order in relation to accessibility for keyboard only users: Menu first then content with a skip to content link at the top Content first then menu ...
2
votes
1answer
45 views

Pattern for multiple roles that have access to different parts of the same view?

Imagine I have two roles: Administrator Teacher Imagine a view Class Administrator has a subset of the functions allowed in the class view: Create a new class Name the class Add/remove students ...
3
votes
3answers
359 views

Best practice to include developer's area inside user's account options

In this concept, normal users see an option for "signing up as developer" then they would receive access to developer's options. the normal way I assume is like this: But I think of some ...
2
votes
6answers
1k views

Tooltips to shorten your content

At my job there is no UX expert, which can be frustrating since most of the daily discussions I have with colleagues is about user experience / interaction. Right now there is a discussion regarding ...
7
votes
5answers
785 views

Different styling for different tooltips on a single page?

I am working on a web application, and we are focusing very much on the consistency of the look&feel. When we are designing tooltip styles, we can see there is the 'plain style' tooltip and all ...
4
votes
3answers
163 views

Tables with a lot of rows - where should the delete option be?

Question regarding how to handle large tables with many rows: Where should the delete option be? I see many examples placing the delete icon or text on the far-right of the row. Is this best ...
1
vote
4answers
95 views

Data tables - what's column should be first?

When creating a table with a lot of rows and a number of columns, what is the recommendation for which column should be first and most important? An example scenario for the data table would be a ...
6
votes
1answer
159 views

How to Display Occasional Announcements on a Website?

I’d like to add an announcement banner or an element with the same functionality (e.g. alert, button) to a website to notify users about an upcoming survey. It should contain a call for participation, ...
0
votes
0answers
151 views

Multi level Master Detail Single Page

We're building an application and on the main maintenance page the customer has asked for all the data to be presented on one page in a hierarchical format. There is a lot of data and quite a ...
3
votes
1answer
128 views

How can I design a 'non-linear' user permission table with two column relationships?

I'm exploring the idea of using a two column relationship to deal with granting user permissions. The left column has rows where the user can be granted a 'view' or 'edit' permission in each cell row. ...
6
votes
1answer
115 views

What are the manage tools for “One-Person UX Team”? [closed]

Context: I am working as a UX, interaction and graphic designer on an enterprise web app. The team has never have a designer before and all design was done by developers and project managers who would ...
2
votes
2answers
97 views

How to display AND / OR groups and exclusions

I hope I'm able to describe this functionality effectively. We have a feature which allows a user to create "Authenticator Groups". The groups determines how a user can register. There are "Allowed" ...
1
vote
1answer
64 views

Android design convention for saying a user needs to complete an action first?

I've read the Android design conventions, but can't see a good solution. I have a 3 tab mobile application. Tabs 2 and 3 need a selection made on screen 1 before they will work. The user enters at ...
6
votes
5answers
577 views

Does a log in/sign up field always have to be top right?

Best practice says that log in/sign up fields should always be top right of the website, no arguments there. There seems to be a trend towards simply having "Sign up here. Or log in if you already ...
2
votes
1answer
95 views

How prominent should the deactivate account function be?

Our app allows users to interact with multiple accounts. When any one account has outlived it's usefulness, it can be deactivated. Although users can still navigate to deactivated accounts, most ...
6
votes
3answers
213 views

Where did the pattern of displaying username in the top right emerge?

What was the initial intention of displaying the user's name along with the avatar on the top right of the app-bar? This is fairly common in some sites like Facebook, OneDrive etc., while other ...
1
vote
1answer
778 views

Avatar vs Profile Picture vs Display Picture

I have noticed that on message boards, that we use the name avatar for the picture on our profiles. On Facebook and Twitter they are called profile pictures, and on Skype it is called Display Picture. ...
0
votes
0answers
23 views

What is the best way to indicate required fiels for deskop style web apps? [duplicate]

I am interested for best practices for indicating required fiels for deskop style web apps.
1
vote
2answers
143 views

Link-heavy web GUI patterns

There is an enterprise system where all entities are interconnected. Let's say we have following entities for a example: Customer, Order, Product, Contact, Employee. The preferred GUI style is ...
4
votes
5answers
473 views

What is the best pattern to distribute items into several buckets

Let's consider the following: A company wants to ship 3 types of fruits (apples, watermelons, strawberries) between two cities. Company has got 3 cars that can be loaded with fruits. Each car has a ...
4
votes
2answers
305 views

How can you show human element without showing pictures of people?

With a company that changes all the time, how can you show the personal touch of human interaction without showing pictures of humans? Essentially, blurring the line between technology and people, ...
12
votes
6answers
3k 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 ...
0
votes
0answers
100 views

What is the standard design pattern for file sharing?

I want to know if there is any design pattern for file sharing between devices or users. How can I chop down some steps without compromising the user experience for the file sharing. Actually, the ...
2
votes
1answer
56 views

What is the sorting order for displaying tiles on a multi-column layout

The use of a tile or card design pattern to present information as a replacement for the conventional list and table view presents a rather interesting challenge for programmers when they have to ...
4
votes
2answers
167 views

Why Google and Facebook use one text field by page for account creation?

I would like to know if there is some reason to have the account creation tunnel that way. Is it only because user focus more on an action by page?
0
votes
2answers
86 views

Picking a hymn with a minimum numbers of clicks from main menu

I am building an android app (hymn book). Users need to pick a particular hymn with a minimum number of clicks from the main menu. The problem is that the hymns are around 800+ and will keep ...
2
votes
1answer
178 views

Why do radio buttons precede the labels?

Radio buttons always seem to precede the label and not the other way around. Is there any reason for this? Don't user first read the label before selecting a radio button? Does this have to do ...
1
vote
2answers
91 views

Action requires users leave and interact with another site, how to ensure they come back?

I have a scenario in which a user must copy code from a Site A, paste it into the source code of Site B, then return to Site A to confirm the action was successful. What's the best way to make ensure ...
0
votes
2answers
127 views

Any online tool for creating style guide [closed]

My client has 10-12 years old web system. It includes websites, widgets, applications, different online forms etc. I could not find any pattern/ consistency across. Considering ongoing projects, I ...
2
votes
3answers
278 views

Canonical names for GUI design patterns

In communication with colleagues and clients, which authority (website, book, …) should one refer to for canonical names of GUI design patterns (for web pages, mobile apps, desktop applications etc.)? ...
2
votes
3answers
85 views

What's the best way to show resize handles for objects

I'm working on a web-based editor that lets people include shapes, images and different kind of objects on an interface. Considering this, they must be able to resize the objects, place them anywhere ...
22
votes
4answers
7k views

Best pattern for international address forms?

I've noticed an emerging pattern in web-based forms is to put the country field before city/state. This is contrary to how we would normally fill out an address on paper, but it allows us to have ...
2
votes
2answers
107 views

Including interaction on a graph

I'm doing some design work for a client on an iOS app and I've got a question about adding interactivity to a graph. It's a wine app and the idea is a user answers some questions and the app creates ...
0
votes
1answer
725 views

UI Design Patterns for image upload and management

We are looking for best in class design patterns for image upload and management for advertising? Specifically services that convey to the user all the needed sizes and aspect ratios for their ...
0
votes
0answers
157 views

UI for Map and Navigation with multiple destinations

I'm currently developing map functionality using Google maps, using it's wide array of services, that includes directions service. My question is can anyone recommend UX practices to create a good UI ...
14
votes
6answers
466 views

What is it about our mental models that app-centric seems more intuitive than content-centric?

I always thought that content-centric was the easiest for people to deal with, i.e. "I want to change this document", and not "Let's run this app so I can then change that document". It seems that ...
1
vote
1answer
530 views

What pattern should I use for merging data display tables

I have a situation where i'm splitting one huge table (it is beyond 3 folds of screen) and creating two tables (one is new and other is updated version of old) Which are again huge in terms of ...
6
votes
2answers
421 views

Pattern Library Software

I've been looking at a recent A List Apart article on creating pattern libraries. They point to a few example pattern libraries: A List Apart Code for America MailChimp Now working in a UX Team ...
2
votes
4answers
238 views

Too many text-only buttons

I support a rich client line-of-business Windows application. Several of my forms have started to get bogged down with an array of buttons specific to that form. These buttons have historically been ...