Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What makes an effective UI for displaying versioning of structured hierarchical data

Traditional version control system are displaying versioning information by grouping Projects->Folders->Files with Tree view on the left and details view on the right, then you will click on each item to look at revision history for that configuration history.

Assuming that I have all the historical versioning information available for a project from Object-oriented model perspective (e.g. classes -> methods -> parameters and etc), what do you think will be the most effective way to present such information in UI so that you can easily navigate and access the snapshot view of the project and also the historical versioning information? Put yourself in the position that you are using a tool like this everyday in your job like you are currently using SVN, SS, Perforce or any VCS system, what will contribute to the usability, productivity and effectiveness of the tool.

I personally find the classical way for display folders and files like above are very restrictive and less effective for displaying deep nested logical models. Assuming that this is a greenfield project and not restricted by specific technology, how do you think I should best approach this?

I am looking for idea and input here to add values to my research project. Feel free to make any suggestions that you think is valuable.


To give more info, an average configuration item, take a method will be nested in about 6 levels (project->assembly->module->namespace->type->method, and more levels to navigate to child items within it) and this is consistently the case, not like in folder-file structure where you occasionally in some project has deep nested structure. When you have that many levels, tree pane becomes unusable to navigate. IMHO, Tree pane also less effective in this scenario to present overall structure of the system.

like image 531
Fadrian Sudaman Avatar asked Jan 22 '23 08:01

Fadrian Sudaman


2 Answers

How about a variation on a stem and leaf plot?

http://en.wikipedia.org/wiki/Stemplot

This is a concept from statistics, but you could augment the traditional tree structure adding a list of versions to the right of each file in the tree. With proper alignment, I think this might be a visually expressive and usable solution. Something like this:

* Root Directory
    * Sub Directory A
        * File A.A     | 1 2 3
        * File A.B     | 1 2
    * File A           | 1 2 3 4 5 6 7 8 9
    * File B           | 1 2 3 4 5

The stem and leaf plot gives a visual indication of how many times a file has been revised along with quick access to viewing (editing, etc) and versions.

It is likely this would be just one view on the data. You would still be encumbered by the nested structure, but if you have to live with that, perhaps this would help.

like image 104
mcliedtk Avatar answered Jan 29 '23 13:01

mcliedtk


Rather than trying to select one presentation scheme for fitting n levels of informations in a GUI, why not let the user choose the right level of details he/she wants or needs?

Perspectives

Eclipse is one example (not the only one) allowing for the user to define perspectives.

Within the workbench the Perspective feature is used to control the visibility of items in the model and the user interface.
It controls what you see in the model (which project, folder or files) and what you see in the user interface (which actions or views).
These controls make it possible to navigate through and modify the workspace in a way which suits the user task.

Perspectives can easily be adapted for any kind of hierarchical information display.

Perspective

Information filtering per task

Another effective way to display complex informations is to propose an effective filtering mechanism, based on the current task.
Each time the user switch to a new task, the various information trees display just the relevant information.

See Mylyn for instance:

Mylyn makes tasks a first class part of the IDE, integrates rich and offline editing for ALM tools, and monitors your programming activity to create a "task context" that focuses your workspace and automatically links all relevant artifacts to the task-at-hand.
This puts the information you need at your fingertips and improves productivity by reducing information overload, facilitating multitasking and easing the sharing of expertise.

Again, that can be applied to any kind of informations.

http://www.tasktop.com/sites/default/files/images/part1-overview.jpg

like image 27
VonC Avatar answered Jan 29 '23 11:01

VonC