205
votes
Accepted
What is the opposite of Cancel?
Cancel might be too vague. I always like to be more descriptive when asking users to perform a quite destructive task. This often reduces any anxiety users might have.
download bmml source – ...
108
votes
Accepted
How to let users know that updates are not real time
Add the time of the last update. That way users have a better understanding how old or new the information is. But it only works if you can use the users system clock to determine the shown time.
If ...
97
votes
How to let users know that updates are not real time
There is no reason to calculate this for the user unless you truly believe they cannot tell time.
"Your order will be ready at 18:12" should suffice; it does not matter how many minutes away ...
55
votes
Accepted
How to implement seat selection on small screen mobile devices?
Do what the Android browser does when you are trying to touch things too small to reliably resolve to a single location - zoom to confirm. On the first touch, zoom the area around the touch so that ...
48
votes
What is the opposite of Cancel?
Have you considered giving the user an undo button instead? It reduces the cognitive overhead because no choice actually has to be made in the normal case and reduces the input from always having to ...
27
votes
How to implement seat selection on small screen mobile devices?
You can check book my show app they give the small window to show the overall seating and then the maximised view on the main screen which you can zoom in zoom out and select multiple seats by just ...
24
votes
How to implement seat selection on small screen mobile devices?
I have opted to use a pointer element (similar to the text range selection brackets in the iOS and Android) that allows to select a group of seats.
Visually, it looks like this:
Pointer refers to ...
21
votes
Accepted
UX alternative to Modal Windows on a mobile device
Showing a full page modal window on mobile devices means users may confusedly think they’ve been taken to a new page.
Modal windows are typically boxes which contain information relevant to the ...
14
votes
UX alternative to Modal Windows on a mobile device
Something I have gone with in the past is to takeover the whole screen for modals. We built a responsive modal so that on desktop you see the modal in a more traditional overlay, but on smaller ...
JonW♦
- 37.6k
11
votes
What is the opposite of Cancel?
The first thing that came to mind given your example was:
Cancel order
Proceed with order
One goes back, the other one forward. Maybe too forward-ey though?
11
votes
How to let users know that updates are not real time
Second choice is better to manage user expectations about estimated time.
You can create background process auto refresh every X second for update estimated time left, so user don't need to refresh ...
9
votes
Revisiting user-scalable=no
Do not prevent the user from zooming using user-scalable=no or maximum-width=1, minimum-width=1, unless your entire page is an interactive app with its own zoom mechanic overriding default pinch-zoom ...
9
votes
What is the opposite of Cancel?
"Cancel" in computers has very well defined meaning of "don't do the thing". That's the root of the problem here, as here the thing we're doing is "cancelation(sic) of an order".
I believe the best ...
8
votes
Accepted
What is a better way to indicate an optional message reminder when food order is ready
Reduce the amount of choices the user has to make at the same time. The first step is to decide if the user wants a notification or not.
Change the label to make it more obvious: Send a notification ...
7
votes
Accepted
Website navigation on mobile
The problem here is not that you have your menu options, but that you're using 60% of the screen just to show your logo.
7
votes
Accepted
How best to display a rankable list with a heading and submit button?
Use labels in the table headers to indicate ranking, and make clear that items can be moved.
Ranking as a concept
Test with your users, but Ranking (or equivalent word) is a fairly common concept in ...
7
votes
Accepted
How do I design a mobile table with multiple headers?
I think the problem lies in the origin, not the destination.
The hierarchy ranks in the original table are given by position, typographic style and color, except in the second hierarchy, which ...
6
votes
Mobile forms - Where to put the save and cancel buttons?
I think this article answers your question very well:
Why Users Miss Form Buttons Placed in the Action Bar
As they fill out the form, their eyes move from the top of the page to the bottom.
When ...
6
votes
Accepted
Input fields - Is <input type phone> more user friendly for credit cards than <input type number>?
The fields should be configured in a way that directly relates to what data goes into it.
So, in this case, while it might be slightly easier to input the numbers with the tel format, that's not what ...
JonW♦
- 37.6k
5
votes
Pane vs Modal vs ?: Across all screen sizes
I have faced the debate, this is my conclusion thus far.
Slide Out vs Modal
In an application, it is important to make the distinction between information that requires immediate attention/action ...
5
votes
What is the opposite of Cancel?
I know another answer with Yes / No buttons has already been given, and accepted, but I just want to add this.
If a button says something and then a confirmation dialog pops up saying "are you sure ...
5
votes
Is it a good practice to extract some menu items from the main navigation on medium sized screens?
Hamburger menus aren't typically used as overflows for existing navigation - they're usually either used to contain the entire navigation (or sometimes to contain non-navigation actions).
I think how ...
5
votes
On some screen sizes the CTA goes below the fold
The general shape (horizontal square) and position of the primary button (right above the fold) creates a false bottom.
So the problem here is that the user is not aware that there is another button ...
4
votes
What is the opposite of Cancel?
For me, the opposite of "cancel" is "continue", at least in your scenario.
After someone presses "cancel order", the simplest confirmation would be:
Do you really want to cancel this order?
No, ...
4
votes
On some screen sizes the CTA goes below the fold
Alternatively, the height of the image at the top could be sacrificed to make space for the content below. A smaller image would serve the same purpose.
Below 300px, the elements may be scaled down ...
4
votes
On some screen sizes the CTA goes below the fold
I think the best solution for you is as the following:
1- Try to Shorten the long title for every button but taking out the redundant words.
2- The buttons must have the same place even on a small ...
3
votes
Accepted
Different implementations of a menu for a responsive social media website
I'd look at what users are used to seeing. On mobile my experience is with Android, and it's pretty consistent that menues on the left can be viewed with the following icon, known as the "hamburger ...
3
votes
Improve line graphs on responsive mobile view
The way you are approaching it looks correct to me.
Maintain the height at 100% and let the width adapt
Make the width scrollable
I would suggest you take out some of the options that are not used ...
3
votes
What text should be used - 'Save for Later' or 'Add to Wishlist' or 'Bookmark it' or 'Shortlist it'?
Probably "Save for later" is the most business-driving option from the choices you put above I think. It's a direct message that he or she would buy it next time.
"Add to wishlist" is also ok, but ...
3
votes
Accepted
Vertical video on mobile devices
The problem with those arguments is that they ignore reality, human vision is binocular and has a wide field of view, so we derive another degree of information on landscape, mainly depth. On the ...
Only top scored, non community-wiki answers of a minimum length are eligible
Related Tags
mobile-web × 395mobile × 117
website-design × 84
responsive-design × 53
navigation × 45
web-app × 42
usability × 38
mobile-application × 31
forms × 22
interaction-design × 19
menu × 19
e-commerce × 18
gui-design × 17
user-behavior × 17
touch-screen × 14
web × 13
user-expectation × 10
buttons × 9
scrolling × 9
modal-windows × 9
mobile-first × 9
design-patterns × 8
accessibility × 8
tables × 7
layout × 7