Visual Navigation Breadcrumbs Retaining Hierarchical Attributes
Find Innovative SolutionsGenerate Solutions
Solution Overview
Problem
Existing breadcrumb systems in user interfaces fail to retain attribute and context information when users drill down through hierarchical levels, leading to loss of data dimensions such as color and size context, and locational context, making it difficult for users to navigate back and understand the relationships between parent and child nodes.
Innovation Solution
The system generates enhanced visual breadcrumbs that include attribute/data/context information by retaining the color, size, and location attributes of previous hierarchical nodes, using colored breadcrumb text nodes and tooltips to convey additional information, ensuring that users can easily navigate back and maintain context.
Engineering Contradictions & Design Principles
Engineering Contradiction Analysis
1Loss of information
If traditional breadcrumb navigation is used, then users can navigate back through hierarchical levels, but attribute and context information (color, size, location) is lost during navigation
Solution Approach 1:
The patent embeds multiple levels of hierarchical information within nested breadcrumb elements, where each breadcrumb contains not only navigation links but also embedded attribute data (color, size, location) from parent and child nodes. This nesting structure allows users to access attribute information at any breadcrumb level without losing context, resolving the information loss problem while maintaining a manageable breadcrumb structure.
Solution Approach 2:
The patent adds a visual dimension to traditional text-based breadcrumbs by incorporating color, size, and location attributes as visual properties. This transforms the breadcrumb from a one-dimensional text link into a multi-dimensional visual element that preserves attribute context, allowing users to navigate while maintaining awareness of data dimensions without significantly increasing structural complexity.
2Loss of information
If users drill down through hierarchical levels to access detailed information, then they can view specific node attributes, but they lose the context of parent and sibling nodes
Solution Approach 1:
The patent preserves and displays parent node attributes and sibling node information in the breadcrumb trail before the user even navigates away from the current node. By pre-loading and displaying this contextual information in the breadcrumb structure, users maintain awareness of their location within the hierarchy and can easily navigate back without having to remember or re-discover parent and sibling relationships.
Solution Approach 2:
The breadcrumb navigation provides continuous visual feedback about the user's position in the hierarchy by displaying attributes of parent nodes and relationships to sibling nodes. This feedback mechanism ensures users always understand their context within the hierarchical structure, making navigation operations easier and more intuitive while preventing information loss about parent and sibling relationships.
3Loss of information
If visual attributes (color, size) are retained in breadcrumbs, then users can maintain data context, but the breadcrumb display becomes more complex
Solution Approach 1:
The patent applies color attributes from the hierarchical data to breadcrumb elements, allowing users to visually distinguish different data categories and maintain context about the type of information being displayed. This use of color encoding preserves data dimension context in an intuitive visual manner without requiring complex additional display elements, as the color itself carries meaningful information about the data being represented.
Solution Approach 2:
The patent modifies the visual parameters of breadcrumb elements (color, size, position) to reflect the underlying data attributes. By changing these visual parameters dynamically based on the hierarchical data being displayed, the system preserves data context in a visually intuitive way while maintaining a relatively simple breadcrumb structure that users can easily interpret without overwhelming complexity.
Data Source
AI summary
A system that provides visual components generates a first display of selectable and hierarchical visual components, where each visual component has at least one associated attribute. The system receives a selection of one of the visual components and displays a second display of visual components at a next hierarchical level of the selected visual component. The system then generates and displays breadcrumbs that include a navigation path from the first display to the second display, and include the associated attribute for the selected visual component.