brownplt / code.pyret.org

Website for serving Pyret to folks.
Other
24 stars 45 forks source link

better labels #350

Closed shriram closed 7 months ago

shriram commented 4 years ago

The Rename menu option looks like

image

Both buttons look wrong, at least if I understand the semantics correctly: "Close" should be "Cancel" and "Submit" (which has a needless BSDM ring to it) should be "Rename" (one could image more precisely alternatives like "Proceed" or "Commit" or something, but I imagine that for kids, "Rename" is the easiest to understand).

shriram commented 4 years ago

(Close should be Cancel because Close doesn't make clear whether the renaming happened anyway or not.)

schanzer commented 3 years ago

While we're at it... image

"Close" should be renamed "Cancel"

Once you share a file for the first time, the "Update" button is a little confusing ("what am I updating...?"). And of course, it's extra confusing that clicking either button has the same effect! Why even make two buttons?

asolove commented 3 years ago

Would folks be interested in a PR to update the modal buttons more broadly? Right now they're always static for every modal, so I'd start by letting cpo/modal-prompt/Prompt accept new options for the button text.

I might also suggest restyling the left button to not be red, as it's generally the safer/do-nothing option, rather than something dangerous enough it should be styled red. (That said, I know users and documentation may have come to rely on details of this UI, so if touching it is dangerous, wanted to check first.)

jpolitz commented 3 years ago

I think this modal (and others) could use a designer's eye, especially a newcomer/outsider, this sounds great. Seeing a PR with a redesign would be great.

Generally for improvements like this if you target horizon with your PRs (it's the default), we can easily merge it and test it at https://pyret-horizon.herokuapp.com/ which autodeploys from that branch. That way we can evaluate before releasing to all users/deciding if we can just go for it or if we need to track down docs to change for larger edits.

asolove commented 3 years ago

I don't want to be presumptuous, but if I'm thinking about this anyways, is there any interest in a broader UI refresh? I took some notes on bits of the UI that seemed unfamiliar and had an idea to update the menus, dialogs and top buttons at the same time. But this was just relative to my own understanding and I know a lot more research would be needed to understand the issues that real users face and try to solve them as part of that effort.

jpolitz commented 3 years ago

That document and your thoughts are not presumptuous, they are spectacular! Thank you so much for writing all of this down, what a gift! I put some comments in the doc.

I think that:

  1. To the extent the refreshes you suggest can be done with CSS and relatively local code changes, go for it. The things you've already presented look like clear improvements, and if they are simple-ish changes it's easy to review and push out. Our QA is more or less us + students banging on horizon, so larger code structure changes are a little more involved.
  2. To the extent you find yourself frustrated with JQuery code and design decisions that were made by a less wise version of myself from ~6-8 years ago, we should talk about a larger project we have going that rewrites the front-end of /editor in React to support other UX design experiments. I don't quite have this all written down to simply link you to. But, it's all living on the anchor branch of https://github.com/brownplt/pyret-lang/, and I'd be happy to have a longer conversation about it.
asolove commented 3 years ago

Great!

  1. I think it's possible to do CSS-centric work for most of this at least to get to a usable prototype, though maybe not for all the changes needed to merge. Do you have a defined set of browsers you need to support? That will let me understand how many of the newer CSS bits it's ok to depend on.
  2. Ah, interesting! I'll poke through the React version and then reach out to learn more once I'm oriented.
asolove commented 3 years ago

This can, I think, be closed or at least get the :fixed-in-horizon: label.

schanzer commented 9 months ago

@shriram Close if you're happy?

shriram commented 8 months ago

The new UI is a lot nicer:

image

But I'm still not so happy with "Submit"? My initial proposal had been to call it "Rename", to make clear what pressing that button does. I missed a rationale for not renaming that.

I also feel like the very light grey of Cancel makes it looks like it's not enabled. Is the grey instead of red for cancel a consistent style?

schanzer commented 8 months ago

Fully agree -- let's call it Rename, since that's what it actually does. The Save dialog should be consistent with this as well. Agreed that Cancel doesn't need to be quite so ghosty.

Tagging @asolove just to keep him in the loop about these discussions.