Why is the mouse cursor slightly tilted and not straight?

  • Is this a legacy thing or does a tilted cursor serves a purpose? I can tell that, the angle provides a totally vertical left edge which helps when highlighting text but what else apart from that?

    EDIT: When cursor is swapped by the little hand cursor when hovered over buttons, the angle seems to be smaller. Why the difference?

    Modern times. For generations, kids used to ask the same thing about bananas.

    When you're highlighting text, the cursor changes to an I-beam on any decent UI.

    I have seen straight cursor in some old DOS GUI apps and have also tried it in Windows and Linux - straight cursor just looks and feels nasty like handling a spoon straightly perpendicular to your face when eating (feeding yourself) or positioning your elbow to the center of your body when giving a handshake... Also can cause some Freudian associations when thought about :-)

    Also, consider that some text (for cultural reasons or others) are written vertically, having a straight mouse would hide the next letter after the one you point at. Making it go towards the right side and down makes it very practical in many situations.

    The historical reasons are given by some great answers here. However, I would like to add that a tilted pointer hides as less information as possible. Of course not in all cases, but generally, data is aligned vertically or horizontally. Therefore, the diagonally aligned cursor is not in the way.

    It was straight by default. I added an underscore at both ends and it turned italics. Weird...

    @Max you got me to join just to upvote that comment. too funny!

    To check the progress bar is still functioning?

  • This is the historical reason:

    Concept drawing of the standard mouse cursor at an angle

    (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 screens in those days, drawing a straight line (left edge of arrow) and a line at a 45 degree angle (right edge of arrow) was easier to do and more recognizable than the straight cursor.

    And of course Bill copied it from Steve who copied it from Douglas ;)

    @jjt the *right edge of the arrow* is 45˚.

    So pixel layout is the real reason :) To make it vertical and still look smooth the cursor would have to be twice as wide. Also that most def. is 45º, just think about the image... it's a grid.. one line goes down down down down, the other line goes down right down right down right. It must be 45º

    @AlbertRenshaw: ...at least if you assume square pixels--but that wasn't a given in those days (e.g., it wasn't normally true of an EGA or Hercules card at their maximum resolution).

    @JerryCoffin Ah! Well I was just basing it off of the image above which does have squares, but you are right, even today a lot of pixels are rectangular.

    I think it leans at 22.5 degrees - that's why one edge of the arrow is straight.

    The image isn't a reason, but an exemplar; the text explanation seems plausible but lacks a citation which substantiates it.

  • Take your right hand and point to your question.

    There, you see.

    finger pointing at screen

    What if I'm left-handed?

    Ok, that's your hypothesis. Can you give evidence that this is actually the reason, or even had any basis behind the 2D, small, on-screen arrow? Surely if this *was* the case then it wouldn't be an arrow at all, it'd be a finger?

    Clearly no one is left handed ;-)

    The average you is not left handed. :(

    @ErikPeterson You may be left handed, but the person pointing on the screen isn't. Get it? :)

    If I recall correctly, Windows had an option to make the pointer left-handed.

    Technology is made usually with the majority in mind. Most people are right handed, so they are the favored ones in this case.

    If this answer made any sense, we'd use a massive photo of a hand to point with.

    I actually like this answer the best. I understand the technical answers and I viewed Doug Engelbart's demo where the pointer is indeed vertical. However, this mimics the hand better, looks more natural -- and in addition, it does not obscure the pixels right below the target, which the user is presumably more likely to want to see than pixels to the southeast of the target, when viewing it, due to the heuristic that many graphics employ horizontal and vertical guides. Also, why does it have to cite sources, when it has a picture of a hand?

    I wonder if it would make sens to have left-handed cursor on a computer showing a right-to left language, Farsi for example.

    If this were true, why is the hand cursor used to point to links pointing upwards, with no angle?

    @PlasmaHH Sorry for being a stickler, but the finger does have a slight tilt on OSX.

    @PlasmaHH The angle of the standard arrow prevents the arrow covering up what you are looking at, eg whn dragging something. The way the hand is used is different: You first see the hyperlink and then move the cursor over it, the changed cursor shows the link's active. This is a newer idea, at first the arrow cursor didn't change, the hyperlink text is underlined when the cursor is over it.

    @Mohamad: Intresting, I have never looked at it on a mac. Do you know if it was the case in 9? I see only "straight" fingers around here on linux and windows.

    @QuentinUK: I don't know how you do drag and drop, but for me, I have the upper left corner of the mouse cursor approximately in the middle of the icon. Same for buttons I click. Same for stuff I drop into. So no matter how the arrow is oriented, it will cover a part of "what I am looking at", although I do not really need to look at it anymore, since I did it and identified what I want to point at, then pointed at it, and now I don't need to see anymore all of it to see what I am currently pointing at.

    For left hand case (Please correct me if I'm wrong) In early versions of windows like Win 3.11 there was an option with mirrored cursor.

    It’s a nice idea, but I don’t believe it for a moment. The mouse cursor was designed by programmers, not designers. Most likely it's because anything other than horz/vert/45° is badly aliased, a vertical arrow using those angles is too large, and possibly also easily confused with e.g. a scroll arrow.

    @ErikPeterson used to be when you set your mouse to left handed, the cursor'd swap to a mirrored one on some operating systems.

    @JúlioTurollaRibeiro, how do you explain the Windows hand-shaped pointer that points straight up, then?

    Then why does the actual hand icon (when hovering a link) have a finger pointing straight up?

    The other advantage to pointing at an angle is that you won't obscure other items in a vertical or horizontal menu. The bulk of the cursor is down and to the side.

    This answer is great and gets to the real reason sideways (pun intended). When you point at something you don't cover up context to the right and bottom (if you are right handed.) You do this without thinking about it. The mouse pointer does it for the same reason.

    Which part of being left-handed stops you from taking your right hand and pointing to the question, as per the respondent's instructions?

    @DavidWallace The same reason left-handed people don't use their right hand when asked to do something? They can, it's just hard, awkward and unintuitive.

    There's a paper by Prof Alan Dix called "Hands across the screen" http://alandix.com/academic/papers/scrollbar/ where he suggests that psychologically the pointer is our hand. He uses this to explain why scroll bars are on the right hand side of the screen, and not the left as used to be the case on early systems. I'd suggest the pointer is a hand proxy, and so comes in from the right for right handers - clearly it should be reversed for left handers.

  • 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

    when you program the detection of the "active" part of the mouse, you are using an area that is not related to the shape of the pointer itself, that area, is a little square which work with any design. If you are not old enough to have used/programmed old cursors/pointers, you may know themes for windows, many of those have cursors with very uncommon shapes for the cursor and they work as well as the arrow. That's because the active area is not related to the shape you see

    @PatomaS: That was a later generalization when machines became fast enough.

    While this certainly sounds plausible, your source is just a Reddit post that has no citations in it, so could just be totally made-up.

    Although this is a theoretical benefit, I highly doubt it seriously informed the decision. Even by the standards of the 1970s, adding two offset numbers is an extremely trivial operation that could easily fit within the mouse update interval. Remember, just like today, there *were* other pointers in use depending on the application (e.g. text selection, row selection, paintbrush) and they didn't all have (0, 0) origins but worked just fine nonetheless.

    @nmclean is right, this answer is completely incorrect. The cited Reddit post is merely a direct copy of this Yahoo! Answers post from 2009, and that post also had no citations. On the contrary, here are two examples of Alto cursors that do *not* have the hotspot at (0,0): a cross in a circle and a right-pointing arrow.

    With regard to the calculation time, my ballpark estimate is that it the custom hotspot took between 4 and 8 instructions at 400,000 instructions per second, or between 1/50,000 and 1/100,000 second for each mouse update: https://news.ycombinator.com/item?id=7253841

    @MichaelGeary: It might not be the speed, it might have been the one instruction to shave of to make the OS fit into the available 3500 bytes of core memory.

    @MSalters what was the generalization? the themes and so?

    @PlasmaHH - Yes, that could be a reason why someone might leave out the code to do this calculation. But they didn't. We already know that the Alto supported cursors with hotspots other than (0,0), so it *had* the code to do this calculation. Put another way: Should we talk about an alternative history where people might have made this coding decision or that, or the actual history where people wrote the code they really wrote, including the few instructions it took to provide custom cursor hotspots?

    @MichaelGeary: When we already know it, there is no point in hypothesizing about the execution speed (where I also would note that back in the days such instructions might have taken much more than one cycle per instruction). But while this is true for the Alto, what about others? It seems that the ( http://origin.arstechnica.com/images/gui/8-Star.jpg ) hat an upwards pointing arrow, so things were not settled back then, and not necessarily everyone copied from everyone else (yet?).

    @MichaelGeary As much as I also believe it to be correct, saying the reddit post with no citations is just a copy of another post with no citations in no way makes it more legitimate. Yahoo Answers doesn't hold more weight than reddit!

    It has nothing to do with calculation time and everything to do programmers wanting to make their lives easier. I would have made the same decision *(and in fact, I have - video games often implement their own cursor logic)*. +1

    This answer is clearly wrong. Every mouse cursor implementation I have *ever* seen has a hotspot field in the cursor definition. Otherwise it would be impossible to do a crosshair cursor, and that would just be silly.

    The execution time for adding coordinates is a non-factor. The real simplification-related benefit to having an upper-left-corner hotspot comes from the fact that the top and left edges won't need clipping. On some hardware sprite implementations, the only way to get clean clipping at the left screen edge is to shift data left within the shape, which is more work than simply requiring the whole cursor to fit on screen, but doesn't require so much work as to be unmanageable.

  • 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, lightness, size, orientation, etc.).

    The popout effect

    As visual information is processed by these areas, some visual irregularities truly pop out (ie, they are highly distinguishable), which greatly helps visual search (trying to find an item in a visually busy field). The popular name for this phenomenon is the popout effect.

    A famous research from 1988 - A. Treisman, and S. Gormican: Feature analysis in early vision: Evidence from search asymmetries summarises many of these popout effects, and the irregularities they involve.

    Orientation

    One such irregularity is orientation, and it is neatly explained by the following illustration:

    3 images showing many vertical lines and how a tilted line pops out

    You should find it next to impossible to find the search target in 1 (a straight line in a group of straight lines). But rather easy in 2 - finding a tilted line in a group of straight lines. In 3 it should be equally next to impossible to find the tilted line in a group of tilted lines (of the same angle).

    Since vertical and horizontal orientations are the most common ones on screens (and in life in general) a tilted mouse pointer will be more easily found.

    More information can be found in Chapter 2 (What we can easily see) of Visual Thinking for Design, Ware 2008.

    I have a feeling that this answer is totally unrelated to the real reason for the tilt, but it is cool nonetheless. However, whenever I need to find my mouse, I just wave it about wildly until I see it moving.

    @naught101: I do that too. We should have animated (spinning?) mouse pointers so they really stand out and we don't need to wave the mouse about to see where the pointer is :-)

    @Brendan: Having the mouse cursor animating constantly when one isn't using it would simply be annoying. On the other hand, it can be useful to have a keystroke defined which causes an indicator to "zoom in" on the mouse cursor.

    MIT Lisp Machines had a cool feature to help find the mouse cursor: if you moved the mouse back and forth quickly, the cursor would magnify (the documentation described it as "big like Godzilla").

    @cr0ybot you can already do something like that in Windows. I had a synaptics driver and it had an option to show circles around pointer when certain key was pressed. I don't have that PC right now but may be googling might help.

    @user13107 I'm sure that's actually a standard feature. Control Panel|Mouse|Pointer Options|Show location of pointer when I press the CTRL key. Another option that helps find the mouse (though imho it's less effective and more annoying than the former): Display pointer trails.

    Windows also has the option of your mouse leaving trails that fade out behind it. Very good for people with not-so-great sight.

    This is a nice idea, but the place where that'd matter the most is in selecting text - and yet in that situation we have the "I-Beam" cursor. And if you hide your I-Beam cursor amongst a load of text, it becomes almost invisible - it's narrower than a letter 'l'

    @Piku: My I beam is white with a black boarder, *and* a shadow, *and* it has serif. So it's much wider than a capital I, and quite visible. I'm using the oxygen cursor set for KDE. If yours is smaller, I suggest you get a better cursor set :)

    @JoranDenHouting obviously not. Unless a joke, I didn't get what does this demonstrate. If you're after an extreme (hypothetical) context you'll be able to rule out anything - an umbrella won't work if the surface you walk on bounces rain drops 3 meters upwards (since no surface does, an umbrella is still a good design).

    I found the search target almost immediately for #1, took 5 seconds for #2, and spent around 30 seconds looking for it in #3... I hope that doesn't mean I'm weird **:)**

    The wiggling -> zoom thing is activated by default on macOS.

    Boy, I am so glad that everything on the screen is not all leaning left at a slight angle! It would be so hard to find the mouse cursor.

  • 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 rendering something resembling a hand would be impossible.

    [Edit: Someone stole the only thunder I've ever had on StackAnything. Thanks!]

    Hand pointing at screen

    I think this is an actual "non-historical" answer. Otherwise we would've seen reverse-angle and straight cursors in abundance.

    @Den We have not seen user interface operating systems themselves in abundance. Most of the world is based on several operating system hegemonies.

    @Kaz - most of games have custom cursors. Old Dungeon Keeper is a perfect example - it's literally a hand shaped cursor pointing the way your hand would - inclined to the left. I am sorry but this answer is the only correct one.

    It's curious how this answer got 2 upvotes but a same answer with an image got 122.

    @jinawee: Because people like pictures and don't read words as much. And the one with the hand has an arrogant 'there, I proved it' attitude - despite neither that one or this one being based on any actual evidence, just reverse-engineered guesswork.

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

    enter image description here

    enter image description here

    So strange, I wouldn't even think that the cursor could move.

    feels like the computer is flipping me the bird

  • 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 vertical) and 45 degrees lines are the only possible lines that look smooth without anti-aliasing.

    That is why almost all arrow mouse cursors are based on one straight and one 45 degrees lines. As a result, the bisector line has angle of 45/2 = 22.5 degrees.

    The tail of the arrow is much harder to be drawn well, but it is not so important as well.

    An arrow with edges that are vertical and horizontal, or that are +/- 45 degrees, would also clearly identify a point without aliasing issues, but would obscure more of the screen underneath. Having one edge vertical and one 45 degrees reduces the obscured width.

    @supercat - Yes. And also, such arrow will have angle of 90 degrees and will look too "pointless" and as a result ugly. 90 degrees arrows are OK for some tasks, but not for mouse pointers (IMO).

    Drawing a sharp anything is difficult *with* antialiasing. If you want sharp, you game the aliasing. :)

    @Arne - It must be 22.5 in order to be OK. But is usually drawn as 2px:1px ratio. That is why it looks a little bit wrong angled.

  • It is a right-handed world.

    It used to be that if you switched our right/left click buttons the arrow would point towards the right (opposite of the images cited).

    This supports that the arrow mimics a hand pointing while providing angular contrast. Without a reference, it is an extension of the desktop metaphor.

    Thanks for reminding all those of us that are left-handed that it is a right-handed world. Like we didn't already know. Glad someone else has noticed this, though. I wonder why, when you change the mouse buttons over to use the mouse with your left hand, the direction of the mouse pointer doesn't change any more?

  • The fact that the mouse cursor is slightly tilted to the left makes a lot of sense. A very interesting fact:

    If it were straight, it would take a nanosecond more to place the cursor on the desired object. Human mind is generally used to perceiving elements from left to the right, that is why the cursor is designed into the opposite direction, anticipating the intent of interaction with the element you are about to click on.

    A nanosecond of time optimization is the closest thing to the absolute idea of irrelevance. With that I agree. However, on a perception level, it makes a huge difference.

    The tilted cursor becomes similar to an athlete who's always on the start position, ready to take off towards anything you want to click on at any time.

    It's a sensation that gives you so much comfort without you realizing why.

    Semiotics, Cognitive Science and Psychology are all embedded into the simple and subtle decision of keeping the tilted cursor, just to simplify by a bit your experience.

    Why was it tilted in the first place? Well, in its history, it seems like it was only an accident determined by some technical limitations:

    Why Your Mouse Cursor Looks The Way It Does

    spam removed, stop it please

    Light travels one foot in a nanosecond, so I don't think it can make a perceptible difference.

  • A straight cursor would also obscure more of the object underneath raising the same issues when designing for touch interfaces

License under CC-BY-SA with attribution


Content dated before 6/26/2020 9:53 AM