TreeMap diagram for news feed visualisation
I would like to design a GUI for a multi-touch device to navigate through a feed of articles. The articles are tagged and organized in a few hierarchies (e.g. topic hierarchy, GEO hierarchy if the articles come from different locations, etc.)
The purpose of the GUI is to navigate quickly through the tags and hierarchies and find interesting articles.
I would like to build a tree map, so that each tile
represents either a hierarchy or a tag. The tile
displays its hierarchy/tag name and a "pile" of articles. The "pile" actually displays only the preview of the top article.
User can zoom the entire tree map
to see more elements of the hierarchy and enlarge the previews of the articles. User can also select a tile
(or article)开发者_运维技巧 and zoom it separately.
Does it make sense ?
It makes sense for me. Some questions come to my mind which should be considered early with design:
Alignment
Are your tiles hierarchical? (i.e. the tile "programming" has sub-tiles "java", "c++", "python", ...) In this case it makes perfectly sense to use a tree map. But you have to keep in mind how you will arrange tiles and also previews. It is quite hard to find enough space if you want to label your different tiles. Unfortunately text is in most cases much wider than high. And therefore you soon come to something which looks more like a flat tree than actually a map.
Hierarchy
If you have previews on different levels of your hierarchy make a clear distinction on which level they are place. Either by color-coding them or by different sizes.
Readability
If you have a deep hierarchy you may not see much detail in the separate panels any more. Therefore consider a very basic "preview" and add detail when you zoom in. Or add new levels only when zoom factor is good enough to display them in a readable manner.
Heap effect
If you have much panels on the same level it may easily become crowded. Use the tree-map configuration to scale you parent-tile according to the number of child-items.
Although this is not an answer to your question it may help you in your design decision. I would be happy to hear of your further steps.
精彩评论