Saturday, May 9, 2015

layout - How to organize multiple information popup areas over a table?


How might you best organize multiple popups over a table when both the table content and the popup content are equally important.


Scenario:


Tabulated data, for which the user may be interested in examining or watching more detailed information for a given row in the table. That information may (for example) be viewed in a popup window (modeless) and may show a list of attributes, live feed information, or other content of interest to the selected row.


The main table itself also needs to be watchable as the content changes and this is what drives the user to bring up a popup in the first place - ie to do a more detailed watch on attributes of the selected item.


Things to bear in mind:





  • no more of the main table should be hidden than necessary because that contains live/dynamic information that the user may be watching too.




  • The user may want to examine or watch any number of these items in the table (the rows of interest may be adjacent or disconnected)




  • The user shouldn't have to spend time organizing the popups/areas themselves.





  • You need to be able to relate which popup/area corresponds to which row in the table




  • Conversely, You need to be able to see which row already has a popup open




  • The extra information can't just be inserted into the table as that would push too many table items off screen.




What strategy might be best to organize the multiple popup information in such a way as to optimize the ability to view each popup without too much movement, reordering, or hiding of the main table?



I'm absolutely for avoiding physical popup windows if at all possible.


The scenario could be likened to a Google Map for example, where it's possible to view multiple InfoWindow popups for different locations on the map that may be close together or further apart. It's a fine balance between being able to see all the popups but still as much of the map as possible.


Examples that don't work well:


Cascading popups: Typical cascading option requires too much user interaction (repositioning and reordering) and doesn't visually relate to the 'owning' row in the table.


enter image description here


Tiled popups: Typical tiled popups cover a lot of the main table and don't visually relate to the 'owning' row in the table.


enter image description here


Offset popups: Better at indicating the 'owning' row, but after a few popups you quickly need to overlap the windows - especially if the selected rows are adjacent.


enter image description here




No comments:

Post a Comment

technique - How credible is wikipedia?

I understand that this question relates more to wikipedia than it does writing but... If I was going to use wikipedia for a source for a res...