Adjust the pointer areas for better usability on touch devices

phetsims / number-line-integers

"Number Line: Integers" is an educational simulation in HTML5, by PhET Interactive Simulations.

GNU General Public License v3.0

0 stars 4 forks source link

Adjust the pointer areas for better usability on touch devices #34

Closed jbphet closed 4 years ago

jbphet commented 5 years ago

In the 10/3/2019 review meeting for this sim, @kathy-phet suggested that we go through and adjust the pointer areas, since she found it tricky to use on her phone. Since the sim is pretty much functionally complete, it would be a good time to that now.

jbphet commented 5 years ago

At a review of this sim today, @kathy-phet had two suggestions:

increase the pointer area for the combo boxes
increase the size of the pointer areas for the point controllers such that they are easier to grab from further away from the number line. See the screenshots below - the yellow portion indicates the extension (roughly)

jbphet commented 5 years ago

@SaurabhTotey and I have implemented larger and asymmetric touch areas. I've tested them on my Win 10 computer with touch screen, and they seem to work pretty well. @kathy-phet - can you test on your phone and give us feedback?

KatieWoe commented 5 years ago

For https://github.com/phetsims/QA/issues/457. They seem a bit large to me, especially since they go out of the toolbox. Haven't used on a small screen yet, so reserving judgement in that area.

amanda-phet commented 5 years ago

@KatieWoe said

They seem a bit large to me, especially since they go out of the toolbox.

Can you clarify what you mean by "they go out of the toolbox"? Do you mean the points when they are still in the panel and not on the number line?

kathy-phet commented 5 years ago

@KatieWoe - They are the way they are so that you can pick them up but have your finger out of the way on a small touch device. Previously, it was not possible to control it without also obscuring the point on the numberline - on a small device. Just FYI - so when you evaluate it you know what the goal was.

KatieWoe commented 5 years ago

@amanda-phet yes that is what I mean

jbphet commented 4 years ago

@KatieWoe and @kathy-phet - we're getting close to an RC on this one, so I need your input on what, if anything, you feel needs to change from the current implementation. The current dev version has the latest in terms of these pointer areas, see https://phet-dev.colorado.edu/html/number-line-integers/1.0.0-dev.10/phet/number-line-integers_en_phet.html?showPointerAreas.

KatieWoe commented 4 years ago

If what was described in https://github.com/phetsims/number-line-integers/issues/34#issuecomment-554046452 is deemed fine then I don't think I have anything to add.

kathy-phet commented 4 years ago

This is working well for me. I can adjust the points and still see all the values at the same time. Closing.