Skip to content

[Suggestion]: UX Improvements #33

Description

@Xatenev

What happened?

The java playground would benefit greatly from some fairly simple UX improvements. The typical approach to using the playground for me looks like the following:

  1. Navigate to the website.

image

  1. Clear example code, either by pressing the button or ctrl+a and remove.
  2. Press enter 10 times to make some space to work in.
  3. Click into the first row to get started.
  4. Now I can start working with the following layout.

image

I assume that others also use a similar approach.

It would be very beneficial if either the starting layout would be adjusted so the user can get started more quickly without all the extra steps or alternatively the possibility to set some kind of user configuration in the session/cookie/etc.

Thanks!

OS

Linux

What browsers are you seeing the problem on?

Chrome

Contact Details (optional)

No response

Additional information

Leave blank

Activity

  1. danthe1st commented on Sep 25, 2024

    @danthe1st

    What exactly would you like to store in the browser (localStorage might be an option as well)?

    For making space, I would suggest "just" setting a minimum height for the playground text area unconditionally.

  2. delabassee commented on Oct 17, 2024

    @delabassee
    Member

    @Xatenev would a keyboard shortcut to clear the editor help?

  3. Xatenev commented on Dec 26, 2024

    @Xatenev
    Author

    @danthe1st @delabassee Sorry for the late response.

    My idea would be the following fairly small changes:

    1. Add a minimum height for the playground text area unconditionally as proposed by @danthe1st.
    2. Set browser auto-focus into the editor on page-load so you can start working right away.
    3. Add a keyboard shortcut to clear the editor as proposed by @delabassee. (Might be irrelevant, if we have browser auto-focus into the editor, Ctrl+A Ctrl+X etc. works fine then.)
    4. Add a keyboard shortcut to run the code. (What about Ctrl + Enter like on play.rust-lang?)
    5. Make sure to not loose editor focus when running code (Can also be seen in the play.rust-lang link below) so you don't need to switch between keyboard and mouse all the time.
    6. Add a small help text that describes the useable hotkeys, for example in the "About" button on the top right of the editor.

    A good example of a similar website can be seen here:

    https://play.rust-lang.org/

    We have auto-focus in the first row automatically and can get started right away. Ctrl + Enter runs the code. Works great for me.

    I think with these changes we could already have a way more ergonomic UX that doesn't require switching between mouse/keyboard multiple times just to quickly test some code out.

    If you agree with me and this is something I can contribute myself, I would gladly submit a PR for the changes above if you can point me to the right place.

    Happy holidays.

  4. danthe1st commented on Dec 27, 2024

    @danthe1st

    If you agree with me and this is something I can contribute myself, I would gladly submit a PR for the changes above if you can point me to the right place.

    IIRC the playground itself is not Open Source.

  5. delabassee commented on Sep 11, 2025

    @delabassee
    Member

    It's also a trade-off as we want to make the Playground accessible .

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions