wordplaydev / wordplay

An accessible, language-inclusive programming language and IDE for creating interactive typography on the web.
Other
60 stars 22 forks source link

Unclear meaning of tutorial highlights #355

Open RuweydaAbdi opened 8 months ago

RuweydaAbdi commented 8 months ago

Expected behavior

Unsure what the original intent is for these circular signaling, as a user. I would assume it wants me to click it and direct me to what it is referring to.

Actual behavior

The circle would blink quickly bringing my attention to it, when I click onto the ones near certain words ie. the bolded "editor", and "Stage". I think it's going to bring me to that location, instead it causes the next arrow button to blink too, no matter which one I click. Then there are also two other circular shapes (4 in total) that signal me to nowhere. One on top of learn, and another in the textbox. These other two, when clicked don't do anything. I believe this is an error in its code, and its design is to signal the user how to navigate the page. This is a link to the direct issue in Learn Verse - program 5/11 : https://test.wordplay.dev/learn?locale=en-US&act=1&scene=2&pause=5

Similar behavior in a different location, there are two circular shapes in total. One near bolded "Revert" and another on top of the revert button. Seems to be signaling to the user where the button is located. However if the user clicks the circular signal near revert, the next button in learn will blink This is a link to the direct issue in Learn verse - program 6/11: https://test.wordplay.dev/learn?locale=en-US&act=1&scene=2&pause=6

Screenshots

This screenshot is of “Program verse 5/11” image

This screenshot is of “Program verse 6/11” image

Environment

I am using an ASUS vivobook S14 Flip, Touchscreen ,windows 11. Chrome browser, OS- 22621.3007, Version: 22H2 , Processor: AMD Ryzen 5 5600H with Radeon Graphics, 3.30 GHz

Design Specification

This issue needs a design proposal. The original reporter is indicating confusion about the meaning of the user interface highlight indicators, thinking they are clickable, when in fact they are just highlights. How should the design change to prevent this confusion?

amyjko commented 8 months ago

Thank you for reporting @RuweydaAbdi! A few revision requests:

  1. Can you reformat the issue using the bug report template? (The one that's shown when you create a new issue?) The headers in the template help everyone understand the issue content.
  2. Instead of using text to link to the section of the tutorial, provide an exact link to the pages where this is happening. The more exact the reproduction steps, the more able developers will be to reproduce and repair this.

Thanks!

RuweydaAbdi commented 8 months ago

Will do!

amyjko commented 8 months ago

Thanks! The organization is better. For future reports, when you report reproduction steps, make sure to organize them as steps. (Do A, then B, then C, then you see the problem). Think of it as a sequence of inputs that produce the failure.

RuweydaAbdi commented 8 months ago

ohh ok I'll be sure to do that