Podcast #128: We chat with Kent C Dodds about why he loves React and discuss what life was like in the dark days before Git. Listen now.

Questions tagged [interface]

An interface is the point of communication between user and system, allowing for input to the system and feedback to the user.

Filter by
Sorted by
Tagged with
130
votes
19answers
37k views

Intuitive interface for Composing Boolean Logic?

I'm interested to know how people have, or would construct an interface which simplifies constructing logical boolean conditions? (Yes, it's a database query builder) In my mind a bad interface has ...
64
votes
5answers
21k views

Why does the space bar do page down in browsers

Why is the space bar doing a page down in some viewer apps, especially browsers and PDF readers? For me this seems to be a bit counter-intuitive, and also this behaviour affects games and other ...
48
votes
14answers
11k views

Best color to display hot/cold but also on/off

I'm not really sure about some colours of one section of the application I am writing. Basically, I need to have a section that displays if something is ON/OFF, but also HOT/COLD. Now, usually, I ...
46
votes
15answers
15k views

Why are keyboards still the predominant input device? [closed]

While reading about the history of the computer keyboard I was a little surprised to hear that it is still the primary interface between humans and computers... Despite the development of ...
35
votes
7answers
12k views

Best error color on blue color?

I have the color: #4285f4 and I'm looking for a easy to read error color code. I'm using Google's default error color: #dd2c00. However this doesn't read very well on the page...
35
votes
5answers
2k views

The Pinterest Trap

First a bit of context: I have been falling victim more and more to "Pinterestization" or the "Pinterest Trap" in my design. I have a feeling I'm not the only one. See this excerpt from Hana Schank ...
30
votes
8answers
6k views

Is there such thing as “touchscreen-friendly” user interface?

My understanding about touchscreen-friendly is that the controls are not too small so that they can be tapped by the finger. Are there "touchscreen-friendly" user interface standards? Or is there even ...
23
votes
10answers
6k views

Best way to communicate “tap anywhere to continue”

I have an iOS game which shows a screen every time you win or lose a game. On that screen, the user can tap anywhere to return to the gameplay screen. However, this does not seem immediately obvious....
23
votes
2answers
3k views

Better way to show books in a row

I need to set area on site with most downloaded books and I'm facing the following problem: Book covers can have different width and height ratio, meaning not all books have proportional edges. There ...
21
votes
6answers
68k views

What is the iOS alternative to a radio button?

There is a radio button in android and WEB but what is the best alternative in iOS? And please don't say segmented control becuase it's not working in my case. The case is a list of items 3-6 which ...
20
votes
3answers
999 views

Purposefully obscure user interface design to encourage behaviours

Installing Windows 8 makes it seem that it is mandatory to create a Microsoft account, however the option to install without one is there, albeit wilfully buried. Logging out of the Windows Phone ...
20
votes
8answers
911 views

Users don't read (or even see) things. How can I deliver important clues?

I am building a website. Some pages contain instructions (a few simple sentences, nothing intimidating) and have fairly standard controls (drop-downs etc). There's not a lot on any one page. The ...
19
votes
5answers
2k views

Disable past dates or display error message?

I am working on a project where there is a datepicker field. Users are not allow to choose past dates(only current and future dates allow). Right now we have two options to design this, which is ...
18
votes
5answers
5k views

Why does the caps lock key have a down arrow as its icon?

The caps lock key has a downwards arrow like this as its icon on most keyboards: Isn't that hugely counter intuitive and inconsistent with the way the Shift key is designed like? One would imagine ...
18
votes
4answers
2k views

Toolbar buttons - to be or not to be?

I need to create a toolbar for my application, and let's assume that due to external constraints it must be a regular toolbar, not a ribbon. The application itself has a significant number of ...
17
votes
3answers
1k views

Multi shapes buttons damage User Experience / User Interface?

This is a question I have been thinking about in the past few days. I'm making a social app(Similar to Facebook or Instagram etc). As I started working on the design and I though of a question. The ...
17
votes
8answers
20k views

What fonts are good and which ones should we avoid for our application's UI?

What do you advise when it comes to selecting fonts for your User Interface?
16
votes
5answers
3k views

Do input box highlights improve user experience?

Modern operating systems and web browsers lightly highlight text input fields on mouseover: The highlight is so minimal it's easy to overlook. Other form elements (such as dropdowns) highlight more ...
16
votes
4answers
5k views

Visually indicating user to change orientation of device

I am developing a site which has a component which is optimized for desktop or big view-ports, and tells users to use the "Tablet in landscape mode". When not on mobile, a message saying "Use tablet ...
15
votes
5answers
4k views

Extra wide tables best practices

I have a table with large (25+) amount of columns in it. Right now it looks very complex and has a horizontal scroll. I want to make it more useful for the users. One solution is to group columns by ...
14
votes
6answers
657 views

Should I combine these 2 mutually exclusive actions?

I have an interface for managing multiple email addresses associated to an account in my web application. This interface is to be used by an administrator. The interface shows a list of email ...
14
votes
2answers
1k views

What do the three bars in old installers mean?

Quite many old setups look kind of like this: I always wondered what the three bars in the bottom left-hand corner mean. I really have no clue.
13
votes
4answers
1k views

Pick a unique activity for each day of the week

I am making an app that creates custom marathon training schedules and I want the user to be able to pick one of 7 activities for each day of the week without picking the same one twice. I made a ...
13
votes
2answers
2k views

When to use the gestalt principle of common region?

The image below, which can be seen on this medium article uses lines to separate various graphics, but could also use different backgrounds, which is something pretty common when designing dashboards....
12
votes
5answers
4k views

Why most footers have a background color as a divider of section?

Why most footers have a background color as a division from the other content of the page? Wouldn't it be enough if they just used enough whitespace to separate? For example nielsen norman group: It ...
12
votes
5answers
2k views

Volume controls: Why is left down and right up?

I see a lot of people discuss the order of buttons (e.g., should OK be on the left and cancel on the right? or submit button on the left or right?) but something that I wonder: Why do volume ...
12
votes
5answers
4k views

Sorting tables after multiple columns

I want to add a sorting functionality to a table. It should be able to be sorted after multiple columns. A standard approach is something like this: download bmml source – Wireframes created ...
12
votes
4answers
1k views

What's the purpose of the bottom bar in popups / modal windows?

There seems to be a common pattern where the bottom of a modal window contains an area that looks slightly separated from its content. I'm trying to find out where this habit comes from, and what ...
12
votes
6answers
5k views

Best way to show search results for different content types

On a website that has different types of content on the same topic, how should this information be displayed after a user searches. Let's say a site's topic is "trees" and the content types are as ...
12
votes
4answers
2k views

Use bad UI till overall redesign or add good UI in small steps?

I started working as a UI/UX Designer for a large company with a big website. Since the developers are busy with developing backend functions, the resources are limited right now. Should I start ...
12
votes
5answers
1k views

Why are car keys and house keys different?

When inserting a car key into the ignition, I am able to do so quickly and easily, without having to carefully line up the key with the keyhole. I can do this despite the fact that the keyhole is ...
12
votes
1answer
3k views

North American electrical outlet, why so sad? [closed]

I wasn't sure whether it was more appropriate to post here or rather on electronics SE, but please bear with me... Why was the 120 VAC outlet and the pinout of the plugs shaped the way they are? ...
11
votes
4answers
513 views

Getting the real name of an user

Currently, when registering on my site, users are presented with a first name field and a lastname field (plus an email and password field as usual). My reasoning behind this was to encourage users to ...
11
votes
3answers
5k views

Are there any special design guidelines for big touch screens (30–50 inch)?

I'm about to develop an application for a large touch screen (around 40″). Now to my question, are there any special design guidelines for such a large screen? I have read Android/iOS/Windows RT ...
11
votes
5answers
3k views

Why are there no arrow keys on most mobile on-screen keyboards?

When typing on smartphones or tablets it is very cumbersome to move the cursor to a different position. Why is it that the onscreen keyboards on these devices usually don't have left/right arrow ...
10
votes
4answers
410 views

Another phrasing for the term “Directions” in this case?

Below is a short browser based linux simulator for training purposes. It basically starts off with a blank screen, and gives directions for the user to enter a linux command to do a given task. If the ...
10
votes
5answers
3k views

What is the term for a numeric input field of a specific format?

There are new HTML5 input types being defined for commonly used numeric input types such as date, time, telephone number, etc. These terms refer to a specific input format based on the type of numeric ...
10
votes
4answers
686 views

Naming features of an app or site

Working closely with external clients, every now and then you run into one that's especially creative. They'll come up with very specific names for certain features they came up with, that don't align ...
10
votes
6answers
15k views

Radio buttons or Toggle switch for one out of two options?

I am a bit confused on what should be used when you have to select one option out of the two possible options. Working on a touch screen interface For ex 1- Selecting a Tax type in a retail store, ...
10
votes
6answers
2k views

Is culture or language a stronger influence on UI design differences?

I read the article by Dan Grover on Chinese Mobile app UI trends and the differences compared to English or western mobile apps. The main list is provided below: Input is Hard Indeterminate Badges ...
10
votes
4answers
10k views

When to use reversed/mirror arrow cursor?

Is there an established pattern for when to use a reversed (right-pointing) arrow? I most frequently notice it in Outlook on part--but not all--of messages in my inbox: My Google-fu failed at finding ...
10
votes
3answers
1k views

What is the rationale for the design of search input fields?

Having read through a whole bunch of literature on search behaviour and looking at different design patterns, I am interested in the large variation of search input field on the web. Specifically, I ...
10
votes
3answers
660 views

How to go about presenting a large family tree?

I'm currently developing a game, and one of the features involves breeding the creatures you collect. Since it's a game, a large amount of promiscuity is to be expected, and individuals could ...
9
votes
1answer
1k views

Best practice on Web Chat “please wait” messaging

We are currently integrating a web chat functionality on a utilities website, where customers can query their bill, or changing plans etc. with their electricity bills. (this will be available to all ...
9
votes
4answers
358 views

How to take advantage of white space on a blank interface

I'm working on an interface that allows users to create and edit playlists. As first time users will have no playlists, they will come across a fairly empty page that consists of a 'create playlist' ...
9
votes
7answers
3k views

Showing user's (name) initials but what if more than 1 user have the same initials?

I'm designing an app where users can assign tasks to other people. The space I have available to convey to whom the task is assigned to is about 23-25px. So right now we're just showing two initials, ...
9
votes
2answers
434 views

Making a signature field look like a physical signature box

I am making an app that involves a four-day schedule and a "signature" that certifies you are going to abide by the terms of the schedule. I would like to make the signature field look like a ...
9
votes
4answers
256 views

Is the following approach better for mobiles? Missing 'save' option in Google Keep

This is one of the example from Google's approach with almost all online products these days... In Keep, when you create/edit a note it is automatically saved(ofcourse) but you don't get any ...
9
votes
1answer
827 views

Volume control and Pause/Play toggles are inconsistent, why?

I'm facing a UX struggle that I've never noticed before, and even though the behaviour is what everyone expects, feels right, and is fine, in the end, it's just not consistent. Let me explain. You ...
8
votes
4answers
2k views

If text is editable, how important is to show it (appearance wise) inside a text box?

A new approach we adopted for one of our applications is that all our editable text such as name, a description that was once filled out to be border-less. To edit the text the users simply click on ...