203

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 – Wireframes created with Balsamiq Mockups Edit As LightnessRacesinOrbit made me realise in the comments, mixing up buttons with links that act like buttons (or in ...


107

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 you see that people don't think about refreshing the page, you can also provide a link for it:


98

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 that is. This allows the user to make a quick mental note of when to check on their order instead of forcing them to think "Oh, it's 18:10 right now and 9 ...


66

The problem with your buttons is that they are not raised above the background, so they don't seem clickable. I highly recommend the Material Design for details on how to choose between flat buttons and raised buttons, with exhaustive do's and don'ts. http://www.google.com/design/spec/components/buttons.html#buttons-flat-raised-buttons


62

You're looking at the problem from the wrong angle. A user could also open a different browser, or use a second device, which means you can't rely on the idea of opening tabs(and preventing it), nor on IP address. Your solution needs to be server-side. Signing them out would just annoy them. Either make it so your website show them the same game no matter ...


55

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 the individual seats are clearly separable, on the second touch select the seat you want within the zoomed area. Because this is part of the normal browsing ...


49

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 do two actions (click cancel and then confirm/other) to only a single action when the user actually wants to cancel: Wireframes made in Pencil.


41

On any site, it is not ideal to break a user's expectations. As a user expects to be able to navigate the internet using tabs in their browser, you shouldn't break it.


32

From the A/B Testing (based on the article posted by keiwes) we can infer the following: download bmml source – Wireframes created with Balsamiq Mockups There seems to be a correlation between correctly identifying the hamburguer icon functionality and the age of the users. Hence from the usability perspective, you need to question yourself were is ...


27

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 one click.


24

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 the starting position of the seat selection, i.e. if user is buying 3 tickets, then the pointer will select 3 seats starting with the seat which the seat pointer ...


23

James Foster of Exis Web did an interesting A/B test on the hamburger icon: Tests on mobile showed a difference, though not all that significant, when the icon was used with a border (so it looks like a button): Perhaps more interestingly, the A/B test seemed to more clearly indicate that desktop users don't understand the icon: I tested 4 variations of ...


22

My company caters towards an older population, so we included text along with the hamburger icon. Here is an article that had similar results with the older population: http://mobile.smashingmagazine.com/2013/09/11/responsive-navigation-on-complex-websites/ Google defines a convention as "a way in which something is usually done, esp. within a particular ...


21

The UK site GOV.UK published some initial test findings about how users on mobile devices use a DOB field they were testing against. Initial reports suggested that having two dropdowns (one for day and one for month) followed by a text field for year was well received by users, although not exclusively. (emphasis mine). ...This tested much better, and ...


21

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 current page but which don’t require the user to leave the page they’re on to view that information. Considering these facts, I think, it would be best if we ...


20

If you have a separate site for mobile and non-mobile then yes, most definitely yes, let them go to the full site to complete what they wish if it isn't offered on your mobile one. Mobile doesn't just mean 'people sat in a coffee shop for 2 minutes looking at their iPhone'. These days Mobile means 'anything that isn't a laptop/desktop' (and even that line ...


17

The problem is it's not flat enough Are they icons or buttons? This is a common problem with flat design (see other answers) but one possible solution I haven't seen here yet is to remove information until the only viable option is to click. Think tiles. ...And at this point it should also become obvious that </> never was a suitable icon.


13

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 viewports the content of the modal takes the place of the whole screen. Something like the 'JUST ME' example here: https://tympanus.net/Development/...


12

Google hangout has the same requirement as your application. You cannot do two hangouts at the same time. Yet Google does not shock the user by disconnecting the first call when a second call is attempted. Instead, you see an error message in the second call's window. Why don't you try the same approach?


12

i thought of something like showing the first skill and let the user figure it out himself, that the others are clickable / tapable aswell (sorry I din't have much time on my hands to do this, but it may help) download bmml source – Wireframes created with Balsamiq Mockups


11

How about using a visual cue that users are most likely used to: an underline? Below is an example with solid underline and a dashed one.


11

Stop using "user-scalable=no". Period. In the last 6 years, I cannot count the times that I've had to put away the iPhone and go to a desktop computer to examine something on a website because it simply wasn't visible and there was no way to increase its size because of this particular meta-tag. This is far and away the most useless tag. I wish it had ...


11

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

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 the browser manually. Make Optimistic UI with time display as countdown and give progress bar on circle.


10

I would argue that breadcrumbs used on a mobile site could in fact provide better usability, and share a multi-purpose. One of the things mostly seen today with responsive (mobile) sites is collapsing navigation that turns into a drawer/hamburger icon up top, once that navigation is hidden the only way to give a visual aid to the user of what page they are ...


9

Jakob Nielson and a large group of other studies suggest scrolling is not a con. Users are acclimated. Put it into context. If you're sitting at a desk, the monitor is roughly 28 inches away vs. a mobile device that is 12 inches. Should it be larger if it's closer? Four years ago, Smashing Mag found the most popular body font size on the web was 13px. ...


9

We need to quit thinking "mobile friendly" and start thinking "device independent". Even mobile devices have resolutions and physical sizes once only found on desktop computers and some cannot be detected as mobile or not. You cannot point to any one width based on resolution where you can be sure it will fit most devices and, even then, that may all change ...


9

I would strongly advise against right text alignment from the readability point of view, at least for countries where the text is read from left to right. It is the same case as reading a book, if it would be right aligned, your eye would get quickly tired by searching the start of every line. See the image: Also when user knows what he is searching for, he ...


9

Please Ignore the Following Rant Congratulations. You’ve been web-abused. You’re the victim of all those other sites/apps failing to apply a consistent simple absolute distinction between clickable and non-clickable elements. After all, that’s probably only the most important single thing you need to communicate with your graphic design. So users get TAMIDS ...


9

I see quite a few areas where language and cultural impact immediately on UI : Color: Color is a culturally sensitive! look at country flags and you can get and immediate sense of how it matters. of course there audiences for which colour matters more than others so i would consider the impact of colour when designing for specific geographical locations. ...


Only top voted, non community-wiki answers of a minimum length are eligible