personalizedrefrigerator / js-draw

Draw pictures using a pen, touchscreen, or mouse! JS-draw is a freehand drawing library for JavaScript and TypeScript.
https://personalizedrefrigerator.github.io/js-draw/typedoc/
MIT License
79 stars 8 forks source link

Make features more discoverable #51

Closed personalizedrefrigerator closed 8 months ago

personalizedrefrigerator commented 9 months ago

Usability issue

Currently, it's difficult to discover some features. For example, disabling touchscreen drawing. It has been commented that the autocorrect feature may also be difficult to discover.

Proposed solutions

  1. Add tooltips to buttons that explain their use
  2. Add an information icon that shows all tooltips at once: screenshot (i) icon highlighted, tooltips shown for different actions (or perhaps allows navigating between tooltips).
  3. Make the information icon instead show help for one tool/button at a time (and allow navigating between help items).
personalizedrefrigerator commented 9 months ago

Alternative solution

An alternative design could show information about one control at a time and allow switching between controls.

For this: diagram: Shows a fullscreen, darkened overlay with Next and Previous buttons. On each screen of the overlay, a label is connected to a button with an arrow.

This design would, in some ways, be more complicated. It does, however, remove the need for preventing tooltips from overlapping.