search

haskell / play-haskell

Haskell Playground
125 stars 8 forks source link

Improve user interface design #3

Open tomsmeding opened 1 year ago

tomsmeding commented 1 year ago

This is a discussion issue for suggestions on how to improve the web user interface of the playground.

If your idea has already been mentioned earlier in the thread, please upvote the post suggesting that improvement, instead of posting your own reply saying "me too".

I'd like the interface to remain as simple as possible, but suggestions are always welcome. :)

TheBFL commented 1 year ago

Perhaps the user interface for the save/share feature could be improved. Rather than using the browser default popup, there could be an html dialog element that shows the link for revisiting that program, along with some text like "Saved. You can share or revisit your program using this link".

tomsmeding commented 1 year ago

If you mean using a

element: that's still a modal, right? So the only difference with the current UI would be that we have the option to put formatting inside the dialog.

Which is perhaps a good thing, because then we can decently put the link in there as well, in addition to putting it in the URL bar.

Was that what you intended, @TheBFL?

TheBFL commented 1 year ago

Yes that's exactly what I was thinking. It'd be basically the same as it is now, except the pop-up would look a bit nicer and there could be a link in the pop-up (perhaps even with a "copy link" button).

tomsmeding commented 1 year ago

I'd be open to discuss a mockup / prototype implementation for that :)

TheBFL commented 1 year ago

@tomsmeding I've got a rough prototype of what I'm thinking of in this repository https://github.com/TheBFL/play-haskell/ The layout and colors will need to be changed, but the rough idea is there. Presently looks like this: image

tomsmeding commented 1 year ago

Sorry for the super delayed response; I like it! I had feared that <dialog> would have too little support in browsers, but not so, it seems. I made some modifications, and it's live!

Thanks :)

sliminality commented 10 months ago

Hi, I'm interested in prototyping some changes to the UI. Out of curiosity, was the current codebase organization (a single TS file, no dependencies other than tsc) chosen out of a principled desire to keep the build process simple? I'm curious whether you'd be open to rewriting the UI in a framework (e.g. the Rust playground uses React). I understand the risk of frontend complexity bloat so I want to be cognizant of that too.

tomsmeding commented 10 months ago

Hi, thanks for reaching out!

Yep, I'd rather keep the number of dependencies very low (tsc is good because it's not something that gets sent to clients). I feel like this kind of application is not complex enough to warrant a framework like React. But if there is some existing implementation of a user interface element that really improves the experience, then of course it makes sense to use that. I'm just mostly ignorant of the world of modern web development, so I cobbled something together with what I knew (and a little help from hasufell). :)

It currently being a single file is of course immaterial, feel free to reorganise.

I'm fairly busy these months, but I'll have regular time for eyeballing some mockups/prototypes/whatever or giving opinions on code decisions, so don't hesitate to post -- the less we have to backtrack. :)