Usability

2001-07-13
2002-07-17
  • Victor Volle

    Victor Volle - 2001-07-13

    Hi!

    - Zoom should enlarge fonts as well as the graph
    - Node text should not overlap if possible
      (probably difficult?)
    - Colors etc. should be completely configurable
    - edges could be painted as simple links

    Bye
    Victor

     
    • Alexander Shapiro

      - Zoom should enlarge fonts as well as the graph

      Interesting.  Thinking about it I believe it's a bad idea.  The whole point is to eliminate overlap by zooming, which would not happen if font sizes increased.  Changing font sizes can be done independently of zooming.

      - Node text should not overlap if possible
      (probably difficult?)

      Yeah, it is difficult.  Currently the attraction/repulsion model sees nodes as points.  Avoiding overlapping would require seeing them as horisontal bars.  If you want me to elaborate, please post in the Development forum.

      - Colors etc. should be completely configurable
      Completely agree.

      - edges could be painted as simple links
      What are simple links?  Bidirectional edges (lines, not arrows) should be implemented, if that's what you mean.

      --Alex

       
      • Victor Volle

        Victor Volle - 2001-07-14

        - zoom ....
        If I zoom "out" (mored nodes on the screen) they all overlap. Therefore I think
        it would be better if the font size decreases automatically. (You could make it
        configurable)

        - edges could be painted as simple links
        >What are simple links? Bidirectional edges (lines, not arrows) should be implemented, if      that's what you mean.
        Yes.

         
        • Alexander Shapiro

          Another good idea to avoid overlap on zooming out is to truncate the node name so that only the first few letters show.

          That's the way it's done on the windows taskbar, if you open a bunch of windows.

          Inxight's startree also takes this approach on non-central nodes.

          --Alex

           
    • Nobody/Anonymous

      Yeah, truncating titles would probably help me out with
      http://www.memes.net

      I could do this in php code during the export, but then the truncated titles would be fixed rather than dynamic.

       
      • Victor Volle

        Victor Volle - 2001-07-15

        It's quite simple to cut the name:

                 if ( _displayName == null )
                 {
                    int stringWidth = fontMetrics.stringWidth( _name );
                    if ( stringWidth < maxWidth )
                    {
                       _displayName = _name;
                    }
                    else
                    {
                       int addLength = fontMetrics.stringWidth("...");
                       char[] string = _name.toCharArray();
                       int length = _name.length()-2;
                       do {
                          stringWidth = addLength + fontMetrics.charsWidth( string, 0, length );
                          length--;
                       } while ( stringWidth > maxWidth );
                       _displayName = (new String(string, 0, length)) + "...";
                    }
                 }

         
    • Howard Lewis Ship

      I think selecting a node should nudge it to the center of the view automatically.  Simply marking it yellow isn't enough I think, moving it to the center will highlight that it "has focus".

      I haven't looked at the code, but obviously you're doing some fun stuff with elastics to orient the nodes and edges.

      Keeping nodes from overlapping is hugely important.

      I think that the numbers should be tweaked so that nodes near the center are spaced further apart and nodes that are more "hops" from the "focus" are closer packed.  This would give the display a bit of a "lens" effect, much like Inxight's Star Tree.

      I also like the idea of making centered nodes larger (and increasing font size) and making distant nodes smaller (decreasing font size) and possibly using some alpha effects to make them dimmer/ghostlike.  Does that make sense?

      In addition, several tools will use a tool tip to display very long node titles.  So you can have an absolute maximum node size and truncate the title to fit inside, with a tooltip for teh full length.

      I did a little R&D with The Brain and like a lot of what it could do.  Useful features:

      - Nifty animation when a node is selected makes it "bounce out and back in" as it takes its centered position.
      - Handles large numbers of linked nodes by presenting them in a scolling region
      - Ability to "pin" useful nodes; like a miniature "favorites" list
      - Built in (if somewhat idiosyncratic) controls for zooming

      The question is: how many good ideas can you integrate without bringing in The Brains patent lawyers?

       
      • Alexander Shapiro

        > I think selecting a node should nudge it to the
        > center of the view automatically. Simply
        > marking it yellow isn't enough I think, moving
        > it to the center will highlight that it "has
        > focus"

        See http://sourceforge.net/forum/forum.php?thread_id=630385&forum_id=95694

        > I haven't looked at the code, but obviously
        > you're doing some fun stuff with elastics to
        > orient the nodes and edges.

        > Keeping nodes from overlapping is hugely
        > important.

        Agreed, but this is not that easy to do.  Eventually, overlapping will be completely avoided, but for now, the ends of nodes with long labels sometimes overlap each other.

        > I think that the numbers should be tweaked so
        > that nodes near the center are spaced further
        > apart and nodes that are more "hops" from
        > the "focus" are closer packed. This would give
        > the display a bit of a "lens" effect, much like
        > Inxight's Star Tree.

        A hyperbolic effect was implemented in V1.05 http://prdownloads.sourceforge.net/touchgraph/TGGL_105.zip , (With a scrollbar that let you change it's magnitude, which I though was even cooler then InXight), but I though that the results were too confusing.  I actually like the "node-independent" feel that having a flat graph gives over a "node-centered" view produced by inxight + thebrain.

        > I also like the idea of making centered nodes
        > larger (and increasing font size) and making
        > distant nodes smaller (decreasing font size)
        > and possibly using some alpha effects to make
        > them dimmer/ghostlike. Does that make sense?

        Nice, making distant nodes dimmer is something that I had not considered.  This is all well and good, but really when you talk about dim nodes you are getting into the realm of cool visuals, rather then displaying only the essential + useful data. 

        > In addition, several tools will use a tool tip
        > to display very long node titles. So you can
        > have an absolute maximum node size and truncate
        > the title to fit inside, with a tooltip for teh
        > full length.

        This is another very good idea that I have not had a chance to implement.  My model for this type of thing is the way applications are displayed on the windows toolbar.

        > I did a little R&D with The Brain and like a
        > lot of what it could do. Useful features:

        > - Nifty animation when a node is selected makes
        > it "bounce out and back in" as it takes its
        > centered position.

        Yeah, yeah, and ThinkMap makes the nodes wave around slightly when the mouse passes over them.  I am sure that I would be comming close to copyright infringement if I were to duplicate these features.  For now I think that having node borders change color is good enough to indicate that the graph is alive.

        > - Handles large numbers of linked nodes by
        > presenting them in a scolling region

        This is actually an important point, and something that I think is a bad idea.  Why have a graph-based tool if you are just going to display linear lists of things.  The whole point of a graph is that you never have to have large lists.  Any list of more then say 10 items can be subdivided, I mean, if I give you 10 items, I am sure that you would be able to divede them into two groups by some feature, right?  So... a scrolling list like that is good for "after the fact" visualizations, like WebBrain's of dmoz, but that is not really the market that I am after (not that I can't change my mind).  What I am interested in, is applying TG for actively creating/modify taxonomies, and in this case the user will always be encouraged to split a group if there are too many items to take in at once.

        > - Ability to "pin" useful nodes; like a
        > miniature "favorites" list

        This is a very good idea.  A recent-changes list is good too.  A feature that TG will eventually have, is allowing the user to literally pin a node to the screen, so that it does not move, and so that it stays around even when one browses to another location.  Possibly a trail of nodes from the pinned one, to the current area of interest can also be displayed.

        > - Built in (if somewhat idiosyncratic) controls
        > for zooming

        TheBrain has this?  And how is TG lacking in this respect?

        > The question is: how many good ideas can you
        > integrate without bringing in The Brains patent
        > lawyers?

        Well, I think that there are very few ideas that TheBrain has for which some other product does not have prior art.  A clever idea which I think that they could defend (And which I have no intent of imposing upon), is that there is a delay in loading web pages when clicking around on their graph.  This means that if one wants to get to a location which one knows about, one does not have to waste time loading unnecessary pages.  Other then that, most of their techniques have already been employed by either graph editors, or mind-managers.  I am tredding very carefully though.

        Thanks for your ideas,
        --Alex

         
    • Howard Lewis Ship

      BTW ... forgot to say how fun and impressive this is.  I hope to use it in some tool some day.

      Another thought is that distant nodes are omitted but not the edges leading towards them; this (like the red numbers) would indicate more connections without cluttering the display.

       
    • Howard Lewis Ship

      Brain zooming:  If memory serves, you can grab the plex (the spinning image) and drag it to zoom view.  This expands the size of nodes and fonts but doesn't greatly affect how much of the graph you can see.

      TheBrain is more about navigating within a hiearchy, with cross links, than about presenting a pure graph.

      However, for me (and many others) this is more interesting than the pure display of a graph.  We are looking for a way to present a clear navigation around a graph that is often largely tree structured.  Several folks have described applications similar to discussion forums where there is a relatively fixed hiearchy of messages and responses, along with cross links.

      The question is:  can this single framework serve both camps?  I noticed that an upcoming feature is to quantify edges to indicate what form of node relationship they form (parent/child, etc.).  I find it intuitive that parents should be visible above children.

      In terms of visually managing complexity.  I think there should be clear guidelines for removing information from nodes as they get further from the selected node.

      For instance, the node can be shrunk, then reduced to a label (removing decoration and mouseover hints), reduced to a point, then omitted entirely.

      So my central node is highlighted, large size, and has full edges to related nodes.

      Level 2 nodes are not highlighted, and have full edges to the central node and to related nodes.

      Level 3 nodes are shrunk to, say, half size.  Perhaps the colors are adjusted to "dim" them.

      By level 4, the nodes are just a small label, but with thin edges to other nodes.

      At leavel 5, the nodes are just a point, with edges to other nodes.  And that's it.

      Again, this is very good at seeing the general, not specific, structure ... and therefore good for navigation, but not necessarily for visualizaing the entire graph.

      And again, perhaps there should be a kind of pluggability, so that we can choose a "visualization strategy" that favors one or the other view.

       
      • Alexander Shapiro

        Howard Lewis Ship wrote:

        TheBrain is more about navigating within a hiearchy, with cross links, than about presenting a pure graph.

        However, for me (and many others) this is more interesting than the pure display of a graph. We are looking for a way to present a clear navigation around a graph that is often largely tree structured. Several folks have described applications similar to discussion forums where there is a relatively fixed hiearchy of messages and responses, along with cross links.

        Hi Howard,

        I agree that hierarchical browsing is very important, and that TG as it stands is not very good at displaying hierarchies.  I believe that the approach to take is to have a split screen navigation, with a more typical tree on one side, and a TG display on the other.  Selecting nodes on the typical tree will filter which nodes are displayed in the graph.

        There is one other application (also opensource) out there that combines the features of TheBrain and InXight to produce a graph very close to your description.  Take a look at: http://bailando.sims.berkeley.edu/infovis.html You must see the video, it's really cool.  This tool alows for displaying a tree with some associative edges.  As far as I can tell though, the non-tree edges are not taken into account when performing the layout.

        Thanks for your input regarding size reductions for distant nodes, I'll take that into accound as more TG-based applications are developed.

        --Alex

         
    • WalterGR

      WalterGR - 2002-07-16

      > A hyperbolic effect was implemented in
      > V1.05
      > http://prdownloads.sourceforge.net/touchgraph/TGGL_105.zip
      > (With a scrollbar that let you change it's
      > magnitude, which I though was even cooler
      > then InXight), but I though that the results
      > were too confusing.

      For a project I'm starting, I'd like to try hyperbolic visualization, at the very least to see how it helps or hurts navigation.  How difficult would it be for me to take the hyperbolic effect in 1.05 and add it to a current release?  I'd love to at least have the _option_ of using that view.

      Thanks,

      Walter

       
      • Alexander Shapiro

        It is easy to do, though you would have to do some work if you wanted to allow the user to select curvy edges by clicking on them.  You either get curvy edges, or selectable straight edges, but not both.

        I think that all that is required is to convert the scrollbars to JScrollbars. 

        --Alex

         

Get latest updates about Open Source Projects, Conferences and News.

Sign up for the SourceForge newsletter:





No, thanks