search

BabylonJS / Babylon.js

Babylon.js is a powerful, beautiful, simple, and open game and rendering engine packed into a friendly JavaScript framework.
http://www.babylonjs.com
Apache License 2.0
23.34k stars 3.44k forks source link

Rework splitters for node editors and Playground #15837

Closed deltakosh closed 1 day ago

AAADora commented 1 day ago

To rework the splitters for node editors and Playground, the following steps and considerations can be taken:

  1. Analyze the Current Splitter Behavior Functionality: Understand how the existing splitters work in terms of dividing the workspace or UI elements. For example, in a node editor, splitters might be used to separate the node graph area from the property panel. In a Playground, they could divide different code execution areas or display sections. User Interaction: Observe how users interact with the splitters currently. Are they easy to drag and resize? Do they provide a smooth experience when adjusting the layout? Note any issues such as jerky movements, unexpected resizing behavior, or difficulty in precisely positioning the split.
  2. Define the Desired Improvements Responsiveness: Ensure that the splitters are responsive to different screen sizes and resolutions. They should adapt well to both large desktop monitors and smaller mobile or tablet devices. For example, on a mobile device, the splitters might need to be adjusted to a vertical orientation if the layout changes to a portrait mode. Smoothness: The dragging and resizing of splitters should be as smooth as possible. This can be achieved by optimizing the underlying code that handles the movement and resize events. Consider using techniques like debouncing or throttling to prevent excessive event firing when the user is dragging the splitter quickly. Precision: Provide better precision when positioning the split. Users should be able to accurately set the size of each section divided by the splitter. This might involve adding visual cues such as snap - to - grid functionality or showing exact measurements as the splitter is moved.
  3. Design Changes Visual Appearance: Update the visual design of the splitters to make them more intuitive and aesthetically pleasing. They could have a distinct border color or style to clearly indicate their presence and function. For example, a thin blue line with a small handle in the middle for dragging coul
deltakosh commented 1 day ago

Thanks ChatGPT! You rock

sebavan commented 1 day ago

Ahah that was a good one :-)