130
votes
How to make text look *not* clickable
tl;dr → use familiar patterns
Make the text objects look less like navigational tab controls.
The elements seem unnecessarily divided: Place the search field in the main header.
Make search look ...
125
votes
How to make text look *not* clickable
Well, since people are trying to interact with this information, I'd use it as an advantage. As mentioned by Mattynabib, it really makes sense.
However, if for some reason you prefer not to, the ...
75
votes
Accepted
Button changing its text & action. Good or terrible?
You can change the button to reflect the only available action, but separate the display of state.
You've replaced the button label with the only available action: reverting (unregistering).
Where it ...
73
votes
Accepted
Should read-only text appear as plain text or in a read-only textbox?
If it's uneditable, show it as plain text, no text field.
Putting uneditable text in a text field can cause confusion. The user might wonder (and with good cause) why they can't edit the value.
62
votes
Accepted
2 buttons that do the same thing
That is exactly how it is done.
What usually happens is that the description of the company itself, the open position and the candidate requirements alone are more than enough to fill a screen. ...
59
votes
Accepted
Is it good practice to allow users to navigate simply by hovering on a menu item without clicking?
This seems full of usability issues, as well as possibly performance issues loading interim unnecessary pages (e.g., user moves mouse across tabs to access one several over). To start, if there's user ...
58
votes
What is better: to have a modal open instantly and then load its contents, or to load its contents and then open it?
The first option... but with more feedback.
You should have the modal appear immediately. This is important so that the user knows that their action has been successful (i.e. you don't want them to ...
53
votes
How to create better user account creation experience for customers who do not want to create an account
Interesting question. To answer it I think we have to understand what's frustrating to users and then provide some alternate ways of doing things.
Also remember, if you don't need the user to create ...
51
votes
Accepted
How can I convince others that text over background images is a bad idea?
Yes, there are guidelines for placing text over images
Here is guidance from a few highly regarded organizations:
Nielsen/Norman Group provides good guidance on how to place text over images while ...
49
votes
Accepted
What is such a presentation of music cover art images called?
It's called Cover Flow.
It's used by Apple in OS X (among others).
Cover Flow is an animated, three-dimensional graphical user interface
element that is integrated within the Macintosh Finder ...
47
votes
What is such a presentation of music cover art images called?
It's an ordinary Carousel with a fancy 3D touch to it.
Image source: Yahoo design pattern library
Carousels are often used on webpages, in this context a carousel often shows a single item at any ...
45
votes
Accepted
How to create better user account creation experience for customers who do not want to create an account
Update: i have extended the answer and added some examples, i might further enhance the quality of the answer if i get feedback
Thought you'd never ask, here are some things to look at:
1. Does the ...
44
votes
How to make text look *not* clickable
The grey text actually makes them look more clickable as they stand out from the rest of the header. I would change them to the same color as the rest of the text (black).
Also, instead of "6 books ...
33
votes
Should read-only text appear as plain text or in a read-only textbox?
In terms of UX, copying into clipboard should be taken into account.
I'll borrow your mock-up. From what you indicate, your application is rather a business one than entertainment one. In business ...
33
votes
Accepted
Prepare a user to perform an action before proceeding to the next step
I think you are putting too much expectation in the video without any prior warning of what will happen.
I have the image of the Olympic's dive: before the jump there's an animation on the screen of ...
32
votes
How to create better user account creation experience for customers who do not want to create an account
I'm sorry for the presumption since I know nothing about your use case, but I'll be the one to say it: don't force them to make an account. Just don't. Users can understand when making an account is ...
31
votes
Is it good practice to allow users to navigate simply by hovering on a menu item without clicking?
This is annoying.
Ignore any hypotheticals we can't judge in the gif. There's still an enormous usability problem. There are a lot of buttons and whatnot at the top of the browser (or even above that ...
30
votes
How to make checkbox selection less of an eyesore?
Note: This answer is a frame challenge.
The checkbox should not be there at all.
According to your screenshot, your users use your search engine to find a solution to their billing problem.
You write ...
27
votes
Should read-only text appear as plain text or in a read-only textbox?
If users can't edit the input, prefer using a label to avoid user confusion.
If users can edit the input in some cases, prefer using readonly textboxes.
26
votes
How to create better user account creation experience for customers who do not want to create an account
Single Sign-On
Heavily utilize SSO services.
Add as much support for as many platforms as possible. Even though this is time consuming and compatibility issues increase as you increase the number ...
24
votes
What's a good way to display settings that can be configured from both "directions"?
If the number of groups or permissions are relatively few (say 12 or less), you can arrange this information as a matrix.
Now the user can see groups for each permission and permissions for each ...
17
votes
How can I convince others that text over background images is a bad idea?
Those problems you mentioned are not really "problems" and the current state of www is a good demonstration of that.
However, your question was about convincing people, so I suggest you do exactly ...
17
votes
What's a good way to display settings that can be configured from both "directions"?
I would use tabbed container in your situation.
One tab to see settings per group and another one to see them by permission; of course with clear titles of the tabs.
Switching between tabs is a ...
15
votes
Why websites usually block the navigation interaction when under a full screen overlay?
Let's look at the example you cited: Twitter's tweet modal
The full-screen background overlay here serves two purposes:
It helps focus the user's attention on the modal by visually dimming non-...
15
votes
Which time format to use in a flight booking?
Times for flights are almost always given as local time in a 24-hour
format.
https://travel.stackexchange.com/questions/83626/how-to-read-time-of-flight-for-emirates-airline
Most airlines use ...
15
votes
Is it good practice to allow users to navigate simply by hovering on a menu item without clicking?
Having content-obscuring changes happen at all on "hover" is an accessibility bug, so this is a non-starter. Not only may it be difficult or impossible for users with particular ...
14
votes
Should read-only text appear as plain text or in a read-only textbox?
This answer is for desktop UI-s with distinct control types, not for in-browser forms where most content can be selected anyway, regardless if it's in an editable control or not.
This is my personal ...
14
votes
2 buttons that do the same thing
A lot depends on the visual design of the screen. If there is enough visual distance between their placement it might be useful to the user. They won't have to scroll to use the button, nor remember ...
14
votes
What is better: to have a modal open instantly and then load its contents, or to load its contents and then open it?
Your app will have a more polished feel by intentionally avoiding the amount of elements quickly flashing or jumping around on the page. A loading indicator isn't needed if the data is returned in 1–3 ...
Only top scored, non community-wiki answers of a minimum length are eligible
Related Tags
design-patterns × 969gui-design × 145
interaction-design × 132
usability × 121
website-design × 113
forms × 71
navigation × 64
user-expectation × 58
user-behavior × 46
mobile × 44
design × 43
terminology × 42
buttons × 37
web-app × 34
layout × 33
tables × 27
search × 27
interface × 25
android × 23
mobile-application × 20
menu × 19
information-architecture × 19
lists × 18
ios × 17
guidelines × 17