Graphical display for sorting and filtering a list in a space-constrained view

• US 8,788,972 B2
• Filed: 01/26/2011
• Issued: 07/22/2014
• Est. Priority Date: 01/26/2011
• Status: Active Grant

• Current Assignee: Cisco Technology, Inc. (Cisco Systems, Inc.)
• Original Assignee: Cisco Technology, Inc. (Cisco Systems, Inc.)
• Inventors: Garrison, Daniel, Sarbin, Brian
• Primary Examiner(s): BAUTISTA, XIOMARA L
• Application Number:
  US13/014,592
• Publication Number:
  US 20120192112A1
• Time in Patent Office: 1,273 Days
• Field of Search: 715/764, 715/765, 715/810, 715/835, 715/846, 715/864, 715/866, 345/169
• US Class Current: 715/835
• CPC Class Codes: G06F 16/248 Presentation of query results
• CPC Class Codes: G06F 3/0482 Interaction with lists of selectable items, e.g. menus
• CPC Class Codes: G06F 3/04842 Selection of displayed objects or displayed text elements G06F3/0482 takes precedence
• CPC Class Codes: G06F 3/04847 Interaction techniques to control parameter settings, e.g. interaction with sliders or dials

Abstract

Techniques for sorting and filtering a list in a space-constrained viewing area are described. A filter widget and a list of items are displayed in a view of an electronic display screen. In response to user input selecting the filter widget, and without changing to a different view, a filter category overlay is displayed in the view to provide various selectable filter categories. In response to selection of a filter category, a visual depiction of the selected filter category is displayed in the view. The list of items is filtered according to the selected filter category and displayed in the view without changing to any other view. Subsequently added visual depictions are linearly stacked in the view. Further, a filter modification overlay, which provides selectable filtering attributes, is displayed upon selection of a visual depiction.

Claims

1. A method, comprising:

displaying, on a display page of an electronic display screen, a list of items and a filter widget;

receiving a first user input that indicates selection of the filter widget;

in response to the first user input, displaying, in the display page, a filter category overlay that overlays over the list of items and that depicts two or more filter categories of two or more filters;

receiving a second user input that indicates selection of a first filter category from the two or more filter categories;

in response to the second user input;

creating a first filter having one or more criteria;

filtering the list of items according to the first filter to create a filtered list of items by excluding, from the display page, those items from the list of items that do not meet the one or more criteria;

displaying, in the display page, only the filtered list of items;

creating and displaying, in the display page, a first visual depiction of the first filter;

ending displaying of the filtered category overlay while maintaining displaying the filter widget and the first visual depiction of the first filter;

in response to receiving a third user input that indicates selection of one or more second filter categories from the two or more filter categories;

creating one or more second filters;

filtering the filtered list of items using the one or more second filters;

creating and displaying, in the display page, one or more second visual depictions of the one or more second filters adjacent to the first visual depiction.

2. The method of claim 1, further comprising:

receiving a fourth user input that indicates selection of the first visual depiction of the first filter;

in response to the fourth user input, displaying, in the display page, a filter modification overlay that depicts one or more attributes of the first filter;

receiving a fifth user input that indicates selection of a first attribute associated with the one or more subcategory filters;

in response to the fifth user input;

updating the filtered list of items to reflect applying the first filter and the first attribute to create a second filtered list of items;

displaying, in the display page, the second filtered list of items.

3. The method of claim 1, further comprising:

displaying, in the display page, the one or more second visual depictions of the one or more second filters and the first visual depiction in an ordered linear stack.

4. The method of claim 1, further comprising:

receiving a fourth user input that indicates removal of at least one filter;

in response to the fourth user input, removing, from the display page, the visual depiction associated with the at least one filter selected for removal;

updating the display page to reflect a list of items ordered without application of the at least one filter selected for removal.

5. The method of claim 1, comprising displaying the filter widget and one or more visual depictions of filters in the display page without overlapping the list of items.

6. The method of claim 1, comprising displaying the filter category overlay and filter modification overlay semi transparently and without entirely obscuring the list of items.

7. The method of claim 1, wherein the list of items and the filter widget are displayed in a handheld mobile device.

8. The method of claim 1, wherein the list of items and the filter widget are displayed using a mobile application of a handheld mobile device.

9. A non-transitory computer-readable storage medium storing one or more sequences of instructions which, when executed by one or more processors, cause the one or more processors to perform:

displaying, on a display page of an electronic display screen, a list of items and a filter widget;

receiving a first user input that indicates selection of the filter widget;

in response to the first user input, displaying, in the display page, a filter category overlay that overlays over the list of items and that depicts two or more filter categories of two or more filters;

receiving a second user input that indicates selection of a first filter category from the two or more filter categories;

in response to the second user input;

creating a first filter having one or more criteria;

filtering the list of items according to the first filter to create a filtered list of items by excluding, from the display page, those items from the list of items that do not meet the one or more criteria;

displaying, in the display page, only the filtered list of items;

creating and displaying, in the display page, a first visual depiction of the first filter;

ending displaying of the filtered category overlay while maintaining displaying the filter widget and the first visual depiction of the first filter;

in response to receiving a third user input that indicates selection of one or more second filter categories from the two or more filter categories;

creating one or more second filters;

filtering the filtered list of items using the one or more second filters;

creating and displaying, in the display page, one or more second visual depictions of the one or more second filters adjacent to the first visual depiction.

10. The non-transitory computer-readable storage medium as recited in claim 9, further comprising instructions for performing the steps of:

receiving a fourth user input that indicates selection of the first visual depiction of the first filter;

in response to the fourth user input, displaying, in the display page, a filter modification overlay that depicts one or more attributes of the first filter;

receiving a fifth user input that indicates selection of a first attribute associated with the one or more subcategory filters;

in response to the fifth user input;

updating the filtered list of items to reflect applying the first filter and the first attribute to create a second filtered list of items;

displaying, in the display page, the second filtered list of items.

11. The non-transitory computer-readable storage medium as recited in claim 9, further comprising instructions for performing the steps of:

displaying, in the display page, the one or more second visual depictions of the one or more second filters and the first visual depiction in an ordered linear stack.

12. The non-transitory computer-readable storage medium as recited in claim 9, further comprising instructions for performing the steps of:

receiving a fourth user input that indicates removal of at least one filter;

in response to the fourth user input, removing, from the display page, the visual depiction associated with the at least one filter selected for removal;

updating the display page to reflect a list of items ordered without application of the at least one filter selected for removal.

13. The non-transitory computer-readable storage medium as recited in claim 9, further comprising instructions for performing:

displaying the filter widget and one or more visual depictions of filters in the display page without overlapping the list of items.

14. The non-transitory computer-readable storage medium as recited in claim 9, further comprising instructions for performing:

displaying the filter category overlay and filter modification overlay semi transparently and without entirely obscuring the list of items.

15. The non-transitory computer-readable storage medium as recited in claim 9, further comprising instructions for performing:

displaying in a handheld mobile device.

16. The non-transitory computer-readable storage medium as recited in claim 9, further comprising instructions for performing:

displaying using a mobile application of a handheld mobile device.