Navigating a hierarchical data set
Methods, systems, and computer-readable media for providing navigation in a hierarchical data set are presented. In some embodiments, a computing device may generate a user interface including a first node as a focused node at a fixed focal point along with a subset of a first plurality of related nodes having a relationship with the first node. In some instances discussed herein, user input may be received selecting a second node as the focused node, such as a scrolling action dragging the second node to the fixed focal point. The user interface may be updated to display a subset of a second plurality of related nodes having a relationship with the second node. In some arrangements, the hierarchical data set may correspond to an organizational chart, a workflow, a directory structure, a categorized list, a taxonomy, or any other type of hierarchical data.
1. A method comprising:
generating, by a touch-enabled mobile computing device, a user interface having a fixed focal point region and a content region comprising a plurality of grid points, the content region configured to display a first plurality of nodes representing a portion of a hierarchical data set,
wherein the first plurality of nodes comprises:
a first node representing a first element of the hierarchical data set,
one or more sibling nodes representing elements of the hierarchical data set having a sibling relationship to the first element,
one or more child nodes representing elements of the hierarchical data set having a child relationship to the first element,
a parent node representing an element of the hierarchical data set having a parent relationship to the first element, and
a grandparent node representing an element of the hierarchical data set having a grandparent relationship to the first element,
wherein the fixed focal point region is displaced from the center of the content region at a location accessible to a thumb of a user of the touch-enabled mobile computing device,
wherein the location of each node corresponds to a grid point of the plurality of grid points,
wherein any two horizontally adjacent nodes are separated by a first distance and any two vertically adjacent nodes are separated by a second distance,
and
wherein the fixed focal point region contains no more than a single complete node;
generating, by the touch-enabled mobile computing device, a first display of the user interface by:
updating the user interface to display the first node as a focused node at the fixed focal point region;
updating the user interface to display the one or more sibling nodes, wherein each sibling node is horizontally adjacent to the first node;
updating the user interface to display the one or more child nodes, wherein a child node is vertically adjacent to the first node, and each of the one or more child nodes is horizontally adjacent to at least one other child node;
updating the user interface to display the parent node, wherein the parent node is vertically adjacent to the first node and the grandparent node;
updating the user interface to display the grandparent node, wherein the grandparent node is vertically adjacent to the parent node; and
causing the first display of the user interface to be displayed, wherein the first display comprises: the first node as the focused node located at the fixed focal point region, the one or more sibling nodes, the one or more child nodes, the parent node, and the grandparent node;
receiving, by the touch-enabled mobile computing device, a first user input corresponding to a target child node of the one or more child nodes that is not vertically adjacent to the first node, the first user input
comprising a motion that is interpreted, by the touch-enabled mobile computing device, as a horizontal scrolling motion operative to drag the target child node by the first distance such that the target child node is vertically adjacent to the first node;
generating, by the touch-enabled mobile computing device and in response to the dragging of the target child node such that the target child node is vertically adjacent to the first node, a second display of the user interface by:
removing, from the first plurality of nodes, a child node of the one or more child nodes,
adding, to the first plurality of nodes, a new child node representing an element of the hierarchical data set having a child relationship to the first element, and
causing the second display of the user interface to be displayed, wherein the second display comprises: the first node as the focused node located at the fixed focal point region, the one or more sibling nodes, the one or more child nodes, the parent node, and the grandparent node;
receiving, by the touch-enabled mobile computing device, a second user input corresponding to the target child node, the second user input comprising
a motion that is interpreted, by the touch-enabled mobile computing device, as a vertical scrolling motion operative to drag the target child node by the second distance such that it overlaps the fixed focal point region;
determining, based on the target child node overlapping the fixed focal point region, that the target child node is selected as the focused node;
generating, by the touch-enabled mobile computing device and in response to determining that the target child node is selected as the focused node, a third display of the user interface by:
generating a second plurality of nodes comprising:
the target child node as a first node of the second plurality of nodes,
one or more child nodes representing elements of the hierarchical data set having a child relationship to the element of the hierarchical data set represented by the target child node,
the child nodes of the first plurality of nodes that are different from the target child node as sibling nodes of the second plurality of nodes,
the first node of the first plurality of nodes as a parent node of the second plurality of nodes, and
the parent node of the first plurality of nodes as a grandparent node of the second plurality of nodes;
and
causing the third display of the user interface to be displayed, wherein the third display comprises: the first node of the second plurality of nodes as the focused node located at the fixed focal point region, the sibling nodes of the second plurality of nodes, the one or more child nodes of the second plurality of nodes, the parent node of the second plurality of nodes, and the grandparent node of the second plurality of nodes.
2. The method of claim 1 ,
wherein the fixed focal point region is maintained at a constant position fixed relative to the content region of the user interface as the target child node is dragged such that it overlaps the fixed focal point region.
3. The method of claim 1 , further comprising:
receiving, by the touch-enabled mobile computing device, a third user input moving the first node of the second plurality of nodes vertically by the second distance away from the fixed focal point region; and
based on receiving the third user input, updating, by the touch-enabled mobile computing device, the user interface to add additional nodes representing elements of the hierarchical data set into the second plurality of nodes and to remove from display at least one node of the second plurality of nodes.
4. The method of claim 1 , further comprising:
receiving a third user input navigating to the parent node as the focused node, wherein the third user input comprises a user finger maintaining contact with the parent node while performing a dragging motion operative to drag the parent node vertically by the second distance to overlap with the fixed focal point region.
5. The method of claim 1 , further comprising:
determining, by the touch-enabled mobile computing device, that at least one node of the first plurality of nodes has one or more children; and
based on determining that the at least one node has the one or more children, updating, by the touch-enabled mobile computing device, the user interface to include at least one child indicator on the at least one node, wherein the at least one child indicator includes a visual display of the node with a link to an element of the hierarchical data set, and a visual display of a link to an unseen node in which the link extends to a left side boundary or a right side boundary of the user interface.
6. The method of claim 1 , wherein an appearance of a particular node included in the user interface is determined according to content of an element of the hierarchical data set represented by the particular node.
7. The method of claim 1 , wherein an appearance of a particular node included in the user interface is determined according to at least one of: data type, hierarchy level, or number of children.
8. The method of claim 1 , wherein the hierarchical data set corresponds to an organizational chart representing information regarding the structure of an organization and the relationships and relative ranks between positions within the organization.
9. The method of claim 1 , wherein the hierarchical data set corresponds to at least one of: a workflow or a directory structure.
10. The method of claim 1 , further comprising:
updating, by the touch-enabled mobile computing device, the user interface to include one or more functional nodes, wherein the one or more functional nodes represent one or more functions associated with the focused node.
11. The method of claim 1 , wherein the focused node corresponds to information comprising a name of a person, an email address of the person, and a telephone number of the person.
12. The method of claim 1 , further comprising:
receiving, by the touch-enabled mobile computing device, a third user input corresponding to a child node, the third user input comprising a tapping gesture; and
in response to the receiving of the third user input, displaying one or more files associated with the focused node.
13. The method of claim 1 , further comprising:
receiving, by the touch-enabled mobile computing device, a third user input corresponding to a child node, the third user input comprising a tapping gesture; and
in response to the receiving of the third user input, generating an email to an email address associated with the focused node.
14. The method of claim 1 , further comprising:
receiving, by the touch-enabled mobile computing device, a third user input corresponding to a child node, the third user input comprising a tapping gesture; and
in response to the receiving of the third user input, initiating a chat session with a user associated with the focused node.
15. The method of claim 1 , wherein the focused node corresponds to a person in a business unit and the parent node corresponds to a business unit to which the person belongs.
16. The method of claim 1 , wherein the touch-enabled mobile computing device is a smart phone.
17. A system comprising:
a processor; and
memory storing computer-readable instructions that, when executed by the processor, cause the system to:
generate a user interface having a fixed focal point region and a content region comprising a plurality of grid points, the content region configured to display a first plurality of nodes representing a portion of a hierarchical data set,
wherein the first plurality of nodes comprises:
a first node representing a first element of the hierarchical data set,
one or more sibling nodes representing elements of the hierarchical data set having a sibling relationship to the first element,
one or more child nodes representing elements of the hierarchical data set having a child relationship to the first element,
a parent node representing an element of the hierarchical data set having a parent relationship to the first element, and
a grandparent node representing an element of the hierarchical data set having a grandparent relationship to the first element,
wherein the fixed focal point region is displaced from the center of the content region at a location accessible to a thumb of a user of the system,
wherein the location of each node corresponds to a grid point of the plurality of grid points,
wherein any two horizontally adjacent nodes are separated by a first distance and any two vertically adjacent nodes are separated by a second distance,
and
wherein the fixed focal point region contains no more than a single complete node;
generate a first display of the user interface by causing the system to:
update the user interface to display the first node as a focused node at the fixed focal point region;
update the user interface to display the one or more sibling nodes, wherein each sibling node is horizontally adjacent to the first node;
update the user interface to display the one or more child nodes, wherein a child node is vertically adjacent to the first node, and each of the one or more child nodes is horizontally adjacent to at least one other child node;
update the user interface to display the parent node, wherein the parent node is vertically adjacent to the first node and the grandparent node;
update the user interface to display the grandparent node, wherein the grandparent node is vertically adjacent to the parent node; and
cause the first display of the user interface to be displayed, wherein the first display comprises: the first node as the focused node located at the fixed focal point region, the one or more sibling nodes, the one or more child nodes, the parent node, and the grandparent node;
receive a first user input
corresponding to a target child node of the one or more child nodes that is not vertically adjacent to the first node, the first user input
comprising a motion that is interpreted, by the system, as a horizontal scrolling motion operative to drag the target child node by the first distance such that the target child node is vertically adjacent to the first node;
generate, by the system and in response to the dragging of the target child node such that the target child node is vertically adjacent to the first node, a second display of the user interface by causing the system to:
remove, from the first plurality of nodes, a child node of the one or more child nodes,
add, to the first plurality of nodes, a new child node representing an element of the hierarchical data set having a child relationship to the first element, and
cause the second display of the user interface to be displayed, wherein the second display comprises: the first node as the focused node located at the fixed focal point region, the one or more sibling nodes, the one or more child nodes, the parent node, and the grandparent node;
receive, by the system, a second user input corresponding to the target child node, the second user input comprising
a motion that is interpreted, by the system, as a vertical scrolling motion operative to drag the target child node by the second distance such that it overlaps the fixed focal point region;
determine, based on the target child node partially overlapping the fixed focal point region, that the target child node is selected as the focused node;
generate, in response to determining that the target child node is selected as the focused node, a third display of the user interface by causing the system to:
generate a second plurality of nodes comprising:
the target child node as a first node of the second plurality of nodes,
one or more child nodes representing elements of the hierarchical data set having a child relationship to the element of the hierarchical data set represented by the target child node,
the child nodes of the first plurality of nodes that are different from the target child node as sibling nodes of the second plurality of nodes,
the first node of the first plurality of nodes as a parent node of the second plurality of nodes, and
the parent node of the first plurality of nodes as a grandparent node of the second plurality of nodes;
and
cause the third display of the user interface to be displayed, wherein the third display comprises: the first node of the second plurality of nodes as the focused node located at the fixed focal point region, the sibling nodes of the second plurality of nodes, the one or more child nodes of the second plurality of nodes, the parent node of the second plurality of nodes, and the grandparent node of the second plurality of node.
18. The system of claim 17 , wherein the focused node corresponds to contact information comprising a name of a person, an email address of the person, and a telephone number of the person.
19. One or more non-transitory computer-readable media having computer-executable instructions stored thereon that, when executed, cause a touch-enabled mobile computing device to:
generate a user interface having a fixed focal point region and a content region comprising a plurality of grid points, the content region configured to display a first plurality of nodes representing at least a portion of a hierarchical data set, wherein the fixed focal point region is fixed relative to the content region, and wherein the fixed focal point region contains no more than a single complete node;
wherein the first plurality of nodes comprises:
a first node representing a first element of the hierarchical data set,
one or more sibling nodes representing elements of the hierarchical data set having a sibling relationship to the first element,
one or more child nodes representing elements of the hierarchical data set having a child relationship to the first element,
a parent node representing an element of the hierarchical data set having a parent relationship to the first element, and
a grandparent node representing an element of the hierarchical data set having a grandparent relationship to the first element,
wherein the fixed focal point region is displaced from the center of the content region at a location accessible to a thumb of a user of the touch-enabled mobile computing device,
wherein the location of each node corresponds to a grid point of the plurality of grid points, and
wherein any two horizontally adjacent nodes are separated by a first distance and any two vertically adjacent nodes are separated by a second distance;
generate a first display of the user interface by causing the touch-enabled mobile computing device to:
update the user interface to display the first node as a focused node at the fixed focal point region;
update the user interface to display the one or more sibling nodes, wherein each sibling node is horizontally adjacent to the first node;
update the user interface to display the one or more child nodes, wherein a child node is vertically adjacent to the first node, and each of the one or more child nodes is horizontally adjacent to at least one other child node;
update the user interface to display the parent node, wherein the parent node is vertically adjacent to the first node and the grandparent node;
update the user interface to display the grandparent node, wherein the grandparent node is vertically adjacent to the parent node; and
cause the first display of the user interface to be displayed, wherein the first display comprises: the first node as the focused node located at the fixed focal point region, the one or more sibling nodes, the one or more child nodes, the parent node, and the grandparent node;
receive a first user input corresponding to a target child node of the one or more child nodes that is not vertically adjacent to the first node, the first user input
comprising a motion that is interpreted, by the touch-enabled mobile computing device, as a horizontal scrolling motion operative to drag the target child node by the first distance such that the target child node is vertically adjacent to the first node;
generate, in response to the dragging of the target child node such that the target child node is vertically adjacent to the first node, a second display of the user interface by causing the touch-enabled mobile computing device to:
remove, from the first plurality of nodes, a child node of the one or more child nodes,
add, to the first plurality of nodes, a new child node representing an element of the hierarchical data set having a child relationship to the first element, and
cause the second display of the user interface to be displayed, wherein the second display comprises: the first node as the focused node located at the fixed focal point region, the one or more sibling nodes, the one or more child nodes, the parent node, and the grandparent node;
receive a second user input corresponding to the target child node, the second user input comprising
a motion that is interpreted, by the touch-enabled mobile computing device, as a vertical scrolling motion operative to drag the target child node by the second distance such that it overlaps the fixed focal point region;
determine, based on the target child node partially overlapping the fixed focal point region, that the target child node is selected as the focused node;
generate, in response to determining that the target child node is selected as the focused node, a third display of the user interface by causing the touch-enabled mobile computing device to:
generate a second plurality of nodes comprising:
the target child node as a first node of the second plurality of nodes,
one or more child nodes representing elements of the hierarchical data set having a child relationship to the element of the hierarchical data set represented by the target child node,
the child nodes of the first plurality of nodes that are different from the target child node as sibling nodes of the second plurality of nodes,
the first node of the first plurality of nodes as a parent node of the second plurality of nodes, and
the parent node of the first plurality of nodes as a grandparent node of the second plurality of nodes;
and
cause the third display of the user interface to be displayed, wherein the third display comprises: the first node of the second plurality of nodes as the focused node located at the fixed focal point region, the sibling nodes of the second plurality of nodes, the one or more child nodes of the second plurality of nodes, the parent node of the second plurality of nodes, and the grandparent node of the second plurality of nodes.
20. The non-transitory computer readable media of claim 19 , wherein the touch-enabled mobile computing device is a smart phone.
21. The non-transitory computer readable media of claim 19 , further comprising additional computer-executable instructions stored thereon that, when executed, cause a touch-enabled mobile computing device to:
receive a third user input corresponding to a child node, the third user input comprising a tapping gesture; and
display, in response to the receiving of the third user input, one or more files associated with the focused node.