Hot answers tagged

619

This is the historical reason: (Concept drawing taken from document: VLSI-81-1_The_Optical_Mouse.pdf) The mouse, and therefore the mouse cursor, was invented by Douglas Engelbart, and was initially an arrow pointing up. When the XEROX PARC machine was built, the cursor changed into a tilted arrow. It was found that, given the low resolution of the ...


297

Take your right hand and point to your question. There, you see. EDIT: I guess @user43174 was a couple of hours ahead of me in posting the exact same answer. I request that upvotes go to his answer instead of mine: http://ux.stackexchange.com/a/52355/43246


161

In addition to Bart's answer, I'd like to add one more reason. The reason the arrow was tilted to the left was so that the click position was easier to calculate, because the origin of the cursor's bitmap was in the upper left. This saved the mouse tracking subroutine a calculation on every click (its not much but it helped on older machines). Source


107

As pointed out in comments and other answers, pointer trails were originally "intended for" and "especially useful if you [were] using a liquid crystal display (LCD) screen" in Windows 3.1. LCD monitors at the time were mostly passive-matrix, whose typically slower response times meant your cursor didn't have time to get redrawn as it moved across the ...


98

Low level visual cognition In addition to the various answers given, there is also sense in a tilted mouse pointer if one considers the visual processes in our brain. Visual information arriving from our eyes is first processed in the primary visual cortex by the V1 area, then by the V2 area. These two areas recognise low-level visual features (hue, ...


93

To add to DA01's great answer, here's the history of cursor arrow. The link also links to a well known document from Xerox with further explanation, from which I took the image below. However, this document doesn't explain the reason behind the tail. This being said, the reasons for tilting explain why tilting was needed. Now I'll take the same image ...


65

The original purpose of the "mouse trails" feature, according to the Windows 3.1 documentation, was to make the mouse easier to track on the very-high-latency LCD panels used in early laptops, by ensuring that the pointer was drawn in each position for at least a full refresh cycle of the screen. It turns out that it also makes the mouse easier to ...


53

It's an arrow: pictograms of arrows have mostly always had at least the arrow head and the shaft: Whoever drew the cursor as we know it was drawing an arrow. It became the default standard. You are right, it probably would work without the shaft (or tail) just as well. It's just that it's not what the UI designer chose when it was created and we've ...


40

The "busy" cursor and "background busy" cursor are frequent sights in Windows. You say, "...I haven't seen a wait/busy/hourglass cursor in quite some time." I believe this is because you have grown accustomed to them and no longer notice. Open Microsoft Word (2010), click on the "File" ribbon and click "save." You will see the "busy" cursor flash a few ...


36

I've always thought that the arrow cursor is shaped similarly to your hand if you were point (naturally) at the screen with your (as typically dominant) right hand. I have no support of this other than my own subjective experience but it strikes me as a natural shape when trying to relate real world interaction into a low resolution computer screen where ...


33

In case anyone wonders : some less known interfaces did use a straight arrow as pointed in Reddit


28

Buttons are a traditional desktop software UI control - a context where the hand pointer has never been used before the advent of internet. When web pages started to use the same control, they just kept the button as it was in a desktop environment.


22

It's all about Affordance. Buttons have a high affordance which visually suggest how they can be used. The hand pointer is used when affordance is lower to provide an indication of how to interact with that item. Here's an extract from Microsoft's Windows desktop applications > Design > Guidelines > Interaction > Mouse and Pointers) 'Well-designed user ...


22

The common solution to this issue is to leave the default mouse cursor and instead "gray out" or somehow make a visual change to the part of the screen that cannot be interacted with, rather than your mouse cursor. Look at some disabled web form controls for an excellent example.


21

Here's the patent for the blinking cursor patent: http://www.google.com/patents/US3531796 According to that, it was invented by Charles A. Kiesling at Sperry Rand. Patent filed Aug 24, 1967, granted Sep 29, 1970. This isn't iron clad proof that it was first invented at that time, but the time seems about right (computers were getting powerful enough that ...


18

I think you've answered your own question. The special cursors demonstrated on that web site are rarely needed, whether in a browser or outside of one. Of the 31 cursors, 14 of them are for resizing elements, which isn't really a common task.


15

I see Progress and Help used fairly regularly. Other than that, the rest of them are mostly situational... there's no need to use them out of specific tasks and environments. Using cursors where not absolutely necessary violates the rule of don't confuse your users, ever. If you can use a normal cursor, do.


14

Having your cursor slanted would be a UX improvement over a permanently vertical cursor. Many word processors already do this. Here are some examples from MS Word: It gives additional feedback to a user that the text they enter will be italic, and it is visually less confusing when selecting text. At the same time, I can't think of any reason that it ...


14

Also, there is another answer to this question. As a rule, the arrow mouse cursor must have one sharp tip (vertex) - because it is an arrow :) On the other hand, it is better for a mouse cursor to look good and slick. But drawing sharp tip on a rectangular pixel based display is very hard, especially without anti-aliasing. The 0 degrees (horizontal or ...


13

Simple answer, it was Charles A. Kiesling Sr. He was my father and he did indeed write the code for the blinking cursor when he worked at Sperry. He passed away yesterday in Minneapolis at the age of 83. I remember him telling me the reason behind the blinking courser and it was simple. It was not because it looked like an "I". He said there was nothing ...


12

The hand cursor icon is used for controls that provide navigation-like interaction. The regular cursor icon is retained when the interactive items are not for navigation, e.g. command/action buttons. The distinction between navigation and navigation/action can sometimes be subtle in apps like Gmail, but it is an important one and can drive user expectations ...


12

Move objects to rearrange them, grab objects to perform operations on them The move cursor should be used when objects are just being rearranged (translated) without any alteration to their properties other than position. For example: Rearranging shapes on a canvas Rearranging items in a list The grab cursor is usually used for drag and drop operations ...


11

"Default", "Pointer" and "Text" are defaults in browsers. Others we forget to specify for developer — because we paint static images. But if we work with interaction our-self, we will remember to use "Not available" cursor for disabled elements for example.


9

Google has added this differing in hovering feedback to make a visual distinction between navigational elements and action elements in the UI. It's really to distinguish the semantics between actions like Compose a new mail and Open email. So that is basically the strategy behind the behaviour. The reason however, how they feel that this will improve the ...


9

This is the not-allowed cursor (as opposed to the same cursor used for no-drop) and which is part of the CSS3 cursor spec - for example see it used on jsFiddle - move the mouse over the preview/result area to see it in action (as set by the CSS code at top right) Note: the demo is the CSS code running - not jsFiddle itself changing the cursor! I would ...


9

The default Windows cursor (white with black outline) uses the red pixel as its hotspot. The default Mac cursor (black with white outline) uses the topmost pixel of the black arrow as its hotspot. Two down, and one to the right of the red pixel. As far as user intentions go, they are going to expect the cursor to act the same everywhere and not suddenly ...


8

Both CSS 2.1 and CSS3 Basic UI specs definitely say that pointer cursor is exclusively for links. One of the authors of the CSS 2.1 Test Suite wrote a following remark in W3C mailing list: Even when hovering the cursor over an <img onclick="...some function...">, a push button, a radio button, a checkbox, the cursor under Windows does ...


7

Custom cursors suit custom actions. For example in some 3D interactive interface, (CAD, games, etc) then custom cursors are going to help immensely, but if you're providing a similar level and style of interaction to the rest of the desktop or to other applications on the same platform then it makes sense to make use of the familiarity of system cursors ...


7

Interestingly, hovering the submit button on this comment form changes the cursor to the hand. I would say "arrow=do and hand=go" was probably a convention at one point, but it's been widely discarded through a) ignorance to it and b) better design. Make a button look clickable and the cursor change won't matter to the end user.


7

I think you and your co-worker are examples of those folks in the User Interface Conservatism versus Liberalism article. It's battle between liberal designer (you) and conservative designer (co-worker). What I really like in this article is: The problem with UI liberalism is not that it necessarily makes for bad interfaces. On the contrary, there ...



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