= Factoid mockup =

Here an initial mockup of Factoid UI is described.  Please note that this is an initial mockup, so it has some details elided.  The focus is on the high-level concepts of the UI.  Details, such as particular commands put in menus, can be easily specified later.

== Editor component ==

The editor component exists in the Factoid system to allow an author to modify the metadata associated with one of his papers.  The editor is shown below.

[[attachment:default.png|{{attachment:default.png|The editor|width=640}}]]

The editor is a part of the Factoid system, and the editor can also be embedded as a part of an external website as a part of its paper submission process.

[[attachment:embedded.png|{{attachment:embedded.png|The editor embedded in an external website}}]]

== Representation of metadata ==

The editor makes use of [[http://cytoscapeweb.cytotoscape.org|Cytoscape Web]] for the visualisation of nodes and edges.  Entities are represented by nodes and relationships are represented by edges connected to relationship nodes.  This affords the system the ability to represent more complex relationships, such as n-ary directional relationships.

[[attachment:rel.png|{{attachment:rel.png|Relationships with Cytoscape Web}}]]

== The information panel ==

The information panel contains information that supplements the Cytoscape Web visualisation.

[[attachment:panel.png|{{attachment:panel.png|The information panel}}]]

Initially, the panel contains information about the paper associated with the metadata.  The information about the paper is shown also when there is no selection made in the Cytoscape Web visualisation.

When an element in the Cytoscape Web visualisation is selected, information about that element is shown in the information panel.

[[attachment:panel_node.png|{{attachment:panel_node.png|The information panel with a node selected|width=640}}]]