Comments (4)
Ariel, I have played with demos your provided and I am confused. To my mind, it is fancy looking but messy for user to work with. Too many options in arranging content and panels is not alway good for UX. It goes agains my UX philosophy to implement them. Here are the issues as I perceive them
- Lots of noice on screen. One should reduce number of elements on screen and show them progressively as user does actions. It is bad UX to show everything available.
- User will need to spend too much energy (and mouse movements) on organizing layouts, showing/hiding, collapsing/expanding, etc. As a user I want to concentrate on my work, not on arranging UI elements
- Limited usefulness. Currently you can nest w2layouts to create a more complicated layouts, https://w2ui.com/web/demos/#/layout/7, but in my experience, I have never used it in a real project.
Additionally, those libraries seem to be pretty standalone and you can use them in your project along side w2ui, should you need them.
from w2ui.
Hi @vitmalina. I understand your point, and there may be many who agree with you from a strictly UI theory point of view. However, if you look at science-oriented IDEs, they all work like this. Scientific programmers are no longer writing programs. We do everything with data and visualization. Consequently, IDEs have turned into dashboards with this kind of drag-and-drop capability. A science-oriented IDE will have source panes, a command line, a terminal, a file explorer, a help panel, a plot panel, a history panel, etc., etc. And the user wants to arrange these to their liking.
Consider the images below of some common IDEs.
I want to build a pure javascript IDE like that. I understand that may be different from your use case. But it is why I want a UI with this sort of flexibility.
Matlab
Scilab
RStudio
Spyder
Octave
Jupyterlab
from w2ui.
Wow. Who are you? Thank you for quite informative response. I see you do have experience with so many tools. I like it. I agree there is a need for complicated UIs, though, I think they could be somewhat easier for the user, still being complex. Nearly everything in the screenshots you provided could be build with w2layout, with perhaps some minor additions.
Currently, I am working on a project with UI that is quite completed too and I am using w2ui. We are a very early stage start up and still have lots of things to do, but it is already a working product and we started advocating it to college professors this fall. You are welcome to check it out, https://usolver.com/dev/login.html, I believe you should be able to create an account and play with it. I hope it could give you some ideas how to implement your UI. Yes, w2layout did not do everything I need there, but the main working area is part of layout. Menu is outside and side toolbar too, I think.
from w2ui.
I'm just a data scientists who let's himself get distracted by thinking about how tools could be better.
That's a very cool project! One thing that could definitely be better in Office (and google docs) is integrating data with text and presentation.
I'm trying to come up with a minimal set of UI functions that I believe would make an easy to use data science IDE with the capabilities of language-specific ones like spyder, matlab, and studio. The goal being to put a full-featured IDE platform in the hands of the open-source community.
This is approximately what I can think of now:
Definitions:
Panel: a placeholder for other UI elements. Probably having a header bar. Optional menu.
Tab: a UI element with a title and body. We all know what a tab is.
Tab Group or Stack: A set of tab elements that are essentially stacked on top of each other and brought to the top of the stack by clicking on the tab title.
Docking: Element can pop out of the main part of the UI to be a model or independent window. It can then re-dock either into it's original location or somewhere else it is dragged and dropped to.
Dynamic, Responsive Drag and Drop: I don't if there is an industry term for this function/behavior. It's where you drag around a panel or tab and are shown options for where it can be added to a tab stack or placed in a way land that make sense in terms of filling the available space. For example, dragged so that it becomes a full-height panel on the left or full width panel on the bottom, etc.
Essential functions and operations
- Add or remove panels
- Minimize and maximize panels
- Undock and re-dock panels
- Add or remove tabs in panels
- Undock and re-dock tabs. When undocked probably automatically create an appropriate undocked panel for it to be in. For example, undocking a code tab would end up in an undocked editor panel.
- Panels can be repositioned in the layout.
- Tabs can be repositioned within panels. Moved between panels as appropriate.
Element types
Could be tabs or panels whatever makes the most sense.
- Multi-tab editor
- File manager
- Help Files
- Plots
- Terminal
- System shell
- Environment (variable viewer)
- Grid viewer for tabular data
- Notebook renderer
- HTML renderer
- PDF renderer
- History viewer
- Package manager
from w2ui.
Related Issues (20)
- How to use w2ui-2.0 in react? HOT 2
- Grid toolbar refresh with multiSearch enabled shows overlapping controls HOT 1
- Clicking in a grid without records generates script error HOT 2
- How can I prevent the loading message tip from appearing when grid.reload is called?
- Update sidebar.topHTML after initialization HOT 4
- Double-clicking on w2tab makes it invisible
- Deselecting a row with a mouse click stopped working. HOT 3
- W2db.php (server/php) doesn't work on PHP8 HOT 1
- w2grid markSearch() not properly escaping values when highlighting search results HOT 4
- Grid context menu does not close, appears multiple times on right clicks
- Grid advanced search script error when searching with empty input
- Weird ENTER key behavior in Inline Edit with selectType = Cell HOT 2
- w2grid.onSelect event not working corectly
- Как в форме в полях вывести Label большой длины, что бы не срезалось наименование поля HOT 2
- w2ui-lock
- w2grid: when property reorderColumns is true, sorting columns doesn't work as expected
- Form in a popup HOT 3
- w2ui grid - password renderer error if password undefined HOT 2
- square button shape HOT 1
- Popup window from another popup window with forms HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from w2ui.