Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Should Web Chat buttons display the cursor as pointer on buttons? #1767

Closed
abishekreddy opened this issue Feb 27, 2019 · 3 comments
Closed
Assignees
Labels
front-burner p2 Nice to have size-s 1 days or less

Comments

@abishekreddy
Copy link

Clickable elements like buttons, etc. should have a pointer type cursor on mouse hover so that the user gets to know that the element is clickable.

Repro steps:

  1. Open sample bot from https://microsoft.github.io/BotFramework-WebChat/01.a.getting-started-full-bundle/
  2. Type help.
  3. Buttons are displayed.
  4. Use your mouse to hover over one of the buttons.
  5. The cursor is of default type giving the user the impression that the element is not clickable.
@corinagum corinagum changed the title Clickable elements should have a pointer type cursor on mouse hover Should Web Chat buttons display the cursor as pointer? Mar 6, 2019
@corinagum
Copy link
Contributor

corinagum commented Mar 6, 2019

After a little bit of research it looks like this may be a debated topic: the pointer is intended for links, not buttons, because links have low affordance. According to this article, buttons should NOT have the pointer because they by nature are more noticeably a clickable object.

Your request is also something that Web Chat doesn't have control of: the Adaptive Cards explorer shows that the cursor does not change to the pointer when hovering on Action.Submit.

Converse to the original request, this raises the question, should Web Chat buttons display as pointer or the regular cursor? My inclination is to say that we should actually update Web Chat to display the regular cursor because of the following:

  • Different buttons (Web Chat vs Adaptive Card buttons) behave differently on the app. We do not have control over the pointer in Adaptive cards, meaning that for consistency it would be easier to change Web Chat's native buttons.
  • It looks like there's no accessibility benefit to changing the cursor on button hover

@compulim, @cwhitten, @a-b-r-o-w-n, do you have thoughts? @DesignPolice and @mewa1024, if you have feedback please chime in.

@corinagum corinagum added the needs-design-input UX/UI design item label Mar 6, 2019
@corinagum corinagum added question Further information is requested. Stack Overflow candidate Pending labels Mar 6, 2019
@corinagum corinagum changed the title Should Web Chat buttons display the cursor as pointer? Should Web Chat buttons display the cursor as pointer on buttons? Mar 6, 2019
@DesignPolice
Copy link

I will defer to MSFT link above- weak affordance of links vs buttons.

This quote from Adam Silver I agree with.
"A well-designed button does not need a hand cursor to help the user realize it does something. "

If we need to look at our button design and if it needs hover states to make it a better button I think that would be a different issue.

@corinagum corinagum added 4.4 size-s 1 days or less p2 Nice to have front-burner and removed needs-design-input UX/UI design item Pending question Further information is requested. Stack Overflow candidate labels Mar 13, 2019
@corinagum
Copy link
Contributor

Based off feedback we'll use this item to track the changes of making sure that all Web Chat buttons do not change the pointer to a cursor.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
front-burner p2 Nice to have size-s 1 days or less
Projects
None yet
Development

No branches or pull requests

4 participants