when to make "cueing arrows" visible for atoms

[pixelzoom]

Related to #35.

Via email (Subject: Molecule Polarity and Touch), @kathy-phet said;

Projectile motion design made me realize that they cuing arrows we settled on don't really do anything for touch interaction? Thoughts?

Via email, @emily-phet replied:

You could have all the arrows show at first, when the sim opens and then disappear once an atom is moved.

Via email, @kathy-phet replied:

Yes, I think we should do that.

[pixelzoom]

I'm not convenience that the current proposal is the best solution. And it's non-trivial to implement (though that's a secondary consideration.)

First: I think the "cueing arrows" are largely unnecessary, and that students will find (and have found, in interviews) the atoms to be "inviting" to interaction. If that's not the case, then we have a larger design problem.

Second: As I recall, the primary purpose of the arrows was not to indicate that the atoms are interactive. They are to indicate what type of change will occur when moving an atom - and even that can be quickly determined by trying it.

Third: If there's really a concern that the student won't discover that the atoms are interactive, then that should be a concern for both mouse and touch. So I think a better approach would be to make the arrows visible by default (in both screens), then hide them when the student first interacts with any atom.

Does that sound like an agreeable alternative?

[kathy-phet]

@arouinfar did some interviews on this sim today on touch. And they did not find that you can move the molecules or rotate anything.

So I think the solution to have the cuing arrows there on start up is appropriate.

Here are my recommendations:

• Screen 1: Cuing arrows up on start up. They all go away if you successfully move either atom. But not if all you do is tap the atom.
• Screen 2: Cuing arrows up on start up. The ones on Atoms A/C go away if you move either to change the bond angle. The center one goes away if you successfully rotate (manually) the atom ... but not if it rotates itself due to the e-field. Again, neither goes away if all you do is tap the atoms.

[kathy-phet]

Second, if there's really a concern that the student won't discover that the atoms are interactive, then that should be a concern for both mouse and touch. So I think a better approach would be to make the arrows visible by default (in both screens), then hide them when the student first interacts with any atom.

Chris - This was Emily's suggestion. And I agreed with it.

[pixelzoom]

Your initial question was about touch, and I don't see anything in @emily-phet's reply that suggested doing it for both touch and mouse. Thanks for the clarification.

[pixelzoom]

Estimate is 2-3 hours to implement.

[kathy-phet]

OK. Fit it in when you can. Did the specifics of this sound OK?

Screen 1: Cuing arrows up on start up. They all go away if you successfully move either atom. But not if all you do is tap the atom.
Screen 2: Cuing arrows up on start up. The ones on Atoms A/C go away if you move either to change the bond angle. The center one goes away if you successfully rotate (manually) the atom ... but not if it rotates itself due to the e-field. Again, neither goes away if all you do is tap the atoms.

[pixelzoom]

Did the specifics of this sound OK?

Yes. That's what the estimate is based on.

[pixelzoom]

Here's a dev version that implements the specification in #50 (comment):
http://www.colorado.edu/physics/phet/dev/html/molecule-polarity/1.0.0-dev.20/molecule-polarity_en.html

Notes:
• Behavior is identical for mouse and touch.
• For the diatomic molecule, the initial dipole direction is temporarily flipped (pending decision in #51) so that you can confirm that visibility of the cueing arrows is affected only by user interaction, and not by the E-field. Turn on the E-field, and you'll see the molecule rotate without changing the arrows.
• For the triatomic molecule, the molecule can be rotated using atom B or either of the bonds. This is not a change, just pointing out that dragging atom B is not the only drag that changes the molecule's orientation.

@kathy-phet or @emily-phet please review.

[emily-phet]

I like the behavior of the arrows. Just to confirm, the arrows still appear on hover in a non-touch environment, correct? (I think they should)

The one issue I see is that there are some differences between the hint arrows and the dipole arrow, but they're (at first glance) pretty similar. I think if the hint arrows were 'fatter' - something more on the scale of something designed to be touchable - they would 1) stand out a bit more, 2) look more touchable than the dipole arrow and 3) align more with some of our other interaction hint arrows.

Could you double their width and let us see how that looks?

[pixelzoom]

@emily-phet asked:

Just to confirm, the arrows still appear on hover in a non-touch environment, correct? (I think they should)

Correct.

Could you double their width and let us see how that looks?

Will do.

[pixelzoom]

By "fatter", I assumed you meant that the tails of the arrows should be thicker. So I experimented with increasing the thickness of the arrow tails. (This also required increasing the width of the arrow heads, since the heads were originally 2x the width of the tails.) Dipoles are "on" in all of these screenshots, so you can compare. (For my benefit, I've also indicated the values used to create the screenshots.)

(1) Original arrows. To be honest, I'm not convinced that there's a problem here, but will defer to @emily-phet.
{ headWidth: 20, headHeight: 20, tailWidth: 10 }

(2) Doubling thickness of all arrows feels too heavy, especially the rotation arrows.
{ headWidth: 30, headHeight: 15, tailWidth: 20 }

(3) Doubling thickness of only the straight arrows feels aesthetically imbalanced.

(4) Here's a compromise where the arrow tails are 1.5x thicker.
{ headWidth: 30, headHeight: 15, tailWidth: 15 }

@emily-phet Does (4) address your concern and look acceptable to you?

[pixelzoom]

Here's a dev version with option (4), arrow tails 1.5x thicker:
http://www.colorado.edu/physics/phet/dev/html/molecule-polarity/1.0.0-dev.22/molecule-polarity_en.html

For the record, I still prefer the original arrows, especially the look of the "rotate" arrows, which look curvier with their original tail thickness.

[emily-phet]

@pixelzoom - thanks for trying out different arrow widths. I agree with you, the double width looked weird for the 'rotate' arrows, and not having all the arrows the same width also looked weird. Option 4 is definitely the best - the hint arrows are distinctly different from the pedagogically relevant arrows, which is the main goal I had. Let's go with option 4 (the one in the dev version you shared above).

[arouinfar]

@pixelzoom I had some interviews scheduled for Projectile Motion, and at @kathy-phet's request I did one Molecule Polarity interview on iPad. The student did not have any trouble using the sim (with the exception of not moving/rotating the atoms), and made a lot of nice observations/connections.

I do not have any more interviews scheduled for now, though I may do another round in the future. If the team would like me to do more interviews on iPad, I'd be happy to.

[pixelzoom]

The student did not have any trouble using the sim (with the exception of not moving/rotating the atoms), and made a lot of nice observations/connections.

@arouinfar So even with the new "cueing arrows" visible, the student did not move/rotate the atoms?

[arouinfar]

@pixelzoom I have not interviewed with the updated cueing arrows. I did one iPad interview with the original cueing arrows that appeared on hover only, and the student did not rotate/move the atoms, which is why @kathy-phet requested the cueing arrows on start up in #50 (comment).

[pixelzoom]

Thanks for clarifying. So the answer to:

(1) Has @arouinfar repeated the interviews mentioned in #50 (comment) to verify that the new behavior is effective?

... is "no".

[arouinfar]

Again, if @emily-phet and @kathy-phet would like more interview data, I can schedule more. However, I would really prefer to wait a little bit so I can coordinate with the second round of Projectile Motion, as our pool of students is pretty small this summer.

[pixelzoom]

@arouinfar said:

I would really prefer to wait a little bit so I can coordinate with the second round of Projectile Motion, as our pool of students is pretty small this summer.

In #30 (comment), @ariel-phet said:

... it would be good to get out by the end of the summer, ...

I don't know if there's any real deadline for this sim. But I do think that it's important that this particular feature be vetted via interviews before the sim start RC testing.

@emily-phet please weigh in on this and #50 (comment).

[emily-phet]

@pixelzoom - I believe this will require some effort, but I think we should have all hint arrows disappear with any direct user movement of any atom, and then reappear on reset.

This does make the interaction more consistent with other sim hint arrows.

It also addresses the issue where the current behavior essentially requires users to rotate the molecule in the second screen, when we know that's not required for effective use of the sim. (This is based on research I did with the java version - rotating was an uncommon interaction, but the students were still very productive with the sim anyway.)

[pixelzoom]

@emily-phet I made it easy to change the behavior of the arrows. So making all arrows disappear with any user direct movement of the atom will take me < 15 minutes. I will make it so :)

[pixelzoom]

Done.

@emily-phet please verify in this dev version:
http://www.colorado.edu/physics/phet/dev/html/molecule-polarity/1.0.0-dev.25/molecule-polarity_en.html

[emily-phet]

@pixelzoom looks good, except doesn't show the hint arrows again after reset all. But i'm guessing you're taking care of -and tracking - that in another github issue.

[pixelzoom]

@emily-phet Yes, resetting the arrows is being handled in #59.

Closing this issue.

[arouinfar]

I don't know if there's any real deadline for this sim. But I do think that it's important that this particular feature be vetted via interviews before the sim start RC testing.

Agreed that the cueing arrows should be vetted. Thanks for letting me know the timeline @pixelzoom. My best guess is that I'll be scheduling the next round of interviews for late next week.

I really like the behavior in dev.26, by the way. My gut feeling is that they will work as intended, but I'll report back once the interviews take place.

[pixelzoom]

Tracking interviews in #73.

[pixelzoom]

Reopening. @kathy-phet says that she intended to have the initial visibility of the cueing arrows be a replacement for showing them on mouse over. Having the arrows constantly appearing on mouse over is a bit distracting, especially since dipoles are also arrows. @emily-phet concurs. So I will remove the mouse over behavior, and publish in maintenance release 1.0.2.

[pixelzoom]

This change is live in 1.0.2 on the PhET website:
http://www.colorado.edu/physics/phet/dev/html/molecule-polarity/1.0.2/molecule-polarity_en.html

@kathy-phet please verify. If it looks OK, please close this issue.

[kathy-phet]

verified! thanks!