Patent Grant
10788975
The disclosed implementations relate generally to improved systems and methods for graphical user interfaces.
Graphical user interfaces are widely used. A number of techniques are used to navigate through collections of images or other records. Some techniques involve stepping through a collection one image at a time, or selecting a record from a dropdown menu, or selecting a record from a thumbnail. These techniques are limited in the total collection size that can be conveniently navigated. Some other folder-based techniques do not provide perspective of an overall collection from within a sub-folder, and can be cumbersome to navigate. Further techniques require a large amount of screen area. Accordingly, there remains a need for improved graphical user interfaces for navigating through collections of items.
In summary, the detailed description is directed to various innovative technologies for graphical user interfaces (GUI) suitable for navigating through a collection of objects. Examples of disclosed technologies use a combination of a wheel user interface (UI) element and a bar UI element to receive continuous variable input from a user for sequential traversal of an object collection, to indicate a current position within one of multiple sections of the object collection, and to receive discrete user input to jump to a selection section of the object collection.
One aspect of the present disclosure provides a computing system comprising a touch-sensitive surface, one or more processors, and a memory. The memory stores instructions for executing a method comprising accessing an image collection comprising a plurality of images indexed as an ordered data structure that specifies a bi-directional order by which images in the plurality of images are to be accessed. The ordered data structure comprises a plurality of contiguous subsets of images. Each respective contiguous subset of images in the plurality of contiguous subsets of images represents a different label in a plurality of labels. A first image from the image collection is include in a module on the touch-sensitive surface based upon the bi-directional order. A navigation wheel is included in the module. A bar UI element is included in the module. The bar UI element includes a plurality of indicia indicative of respective labels in the plurality of labels. Spacing between the indicia indicates a number of images in the plurality of images in each subset. The bar UI element presents a current location indicator that indicates a location of the first image within the ordered data structure. A directional user input for the navigation wheel in a first direction is received, and, responsive to this, the first image is replaced with a second image from among the plurality of images based upon a first direction in the bi-directional order. The bar UI element is also updated to indicate a location of the second image. A second user input is received to toggle the bar UI element between (i) a first mode in which the respective label for each subset in the plurality of subsets is included alongside the indicia in the plurality of indicia corresponding to the respective subset thereby including the plurality of labels in the module, and (ii) a second mode in which the label of the current subset of the image collection is included and no other label in the plurality of labels is included.
According to another aspect of the present disclosure, a UI is disclosed for displaying images of an image collection, and includes interrelated navigation wheel and bar UI elements. Segments of the bar represent respective sections of the image collection. The bar provides the location of a currently displayed image within its section. Scrolling of the navigation wheel in the forward or backward direction replaces the currently displayed image with another image, and changes the displayed location on the bar.
According to another aspect of the present disclosure, methods for operating a UI are disclosed. A first method provides for moving through image content on a UI. A first user input is received for a navigation wheel UI element, which causes a currently displayed image from the content to be replaced by another image from the content. A bar UI element is displayed, with a plurality of indicia indicative of categories of the image content. The spacing between successive indicia indicate an amount of content in each category. The bar UI element also indicates a location of the currently displayed image within its category. The bar UI element and the navigation wheel UI element are interrelated such that scrolling the navigation wheel UI element changes the location indication in the bar UI element.
In a second method, one or more variable items of a catalog are rendered on a display. A wheel UI element is rendered on the display, and the catalog is traversed responsive to user inputs for a wheel UI element. A bar UI element is rendered on the display, the bar having divisions representing respective sections of the catalog. On or alongside the bar, positions of the rendered variable item(s) within their catalog section(s) are indicated.
A third method is disclosed, for navigating through a UI, which includes displaying a bar UI element in a position indicating mode and receiving a user input to transform the bar to a navigation mode. In position indicating mode, the bar includes multiple indicia indicative of image categories, wherein spacing between indicia indicates an amount of content in each category. The bar UI element also indicates a location of a currently displayed image within its category. In navigation mode, each of the indicia includes or is accompanied by a heading representing the associated category. The headings are selectable to navigate to the respective categories.
A fourth method is disclosed, including rendering, on a display, a succession of pictures of a catalog, and traversing the catalog responsive to user inputs for a wheel UI element. This method further includes rendering, on the display, a bar UI element in a position indicating mode, having indicia demarcating sections of the catalog, wherein spacing between indicia is dependent on sizes of the sections; indicating, on the bar UI element, representative positions of the rendered pictures within a section of the catalog; and transforming the bar UI element, responsive to a user input for the bar UI element, into a navigation mode wherein evenly spaced selectable labels are displayed in association with respective indicia. Selection of a label transforms the bar UI element into position indicating mode, and renders a picture from a catalog section associated with the selected label.
In a third aspect, computer-readable media storing instructions for implementing a GUI architecture are disclosed. The GUI architecture includes an image manager, a navigation module, a bar UI element, a bar manager module, a wheel UI element, a wheel manager module, an image display buffer for an image tableau, a bar display buffer for the bar UI element, and a wheel display buffer for the wheel UI element. The image manager is coupled between an image library organized in multiple sections, and the image display buffer. The navigation module includes a current position storage location associated with the image library, and is coupled between an event handler and the image manager. The image manager is operable to populate the image buffer with an image at the current position in the image library, which causes the image to be rendered within the image tableau on a display. Events routed to the navigation module are operable to update the current position. The bar UI element is rendered from the bar display buffer with demarcations representing the plurality of library sections. The bar UI element has a position-indicating mode in which the current position is displayed within a current section, and a navigation-input mode in which labels of the sections are displayed. The bar module is coupled between the event handler and the bar display buffer; events routed to the bar module when the bar UI element is in position-indicating mode are operable to transform the bar UI element to the navigation-input mode. Events routed to the bar module when the bar UI element is in navigation-input mode correspond to selection of a section and are operable to transform the bar UI element to the position-indicating mode and to set the current position variable to within the selected section.
In a fourth aspect, a method is disclosed for rendering section markers for a bar UI element. The length of the bar P in pixels is obtained. The sections are indexed by variable i, and the amount A(i) of content is determined for each section. The pixel length B(i) of each section is determined, proportional to A(i). The pixel coordinate of the first section marker C(1) is set to the start pixel P0 of the bar. The pixel coordinate of successive markers are calculated as C(i+1)=C(i)+B(i). The section markers are rendered at the calculated positions C(i). An optional end marker is rendered at coordinate P0+P−1. Variations are disclosed.
In a fifth aspect, a method is disclosed for launching a GUI according to disclosed technologies. Beginning on a launching webpage rendered within a browser, an input is received for a catalog selection. A corresponding request is sent to a catalog API server. Upon receipt of the request, the catalog API server returns the GUI webpage, which can include active scripts for user interaction, to the requester. The catalog API server also transmits the catalog structure, which can be in JSON format, to the requester. Upon receipt of these items, the requesting browser executes instructions on a processor to build and launch the GUI. The catalog API server also transmits the catalog items themselves, which can be images. Depending on catalog size and available bandwidth, download of catalog items can take a long time. Thus, the catalog download can extend over periods before, during, and/or after the GUI launch.
Another aspect of the present disclosure provides a user interface for viewing images of an image collection on an electronic device with a touch-sensitive surface. The image collection comprises a plurality of images indexed as an ordered list that specifies a bi-directional linear order by which images in the plurality of images are to be displayed. The ordered list comprises a plurality of contiguous subsets of images. Each respective contiguous subset of images in the plurality of contiguous subsets of images represents a different category in a plurality of categories. Each category in the plurality of categories is associated with a corresponding label in a plurality of labels. The user interface comprises a bar User Interface (UI) element rendered on the touch-sensitive surface. The bar UI element is divided into segments representing respective categories of the plurality of categories. The bar UI element includes a current location indicator that indicates a current location within the ordered list. The user interface further comprises a navigation wheel UI element rendered on the touch-sensitive surface such that (i) scrolling of the navigation wheel UI element in a first direction changes a currently displayed image of the image collection in accordance with a first direction in the bi-directional linear order and concurrently changes the current location indicator on the bar UI element so as to integrate movement of the navigation wheel UI element and the bar UI element and (ii) scrolling of the navigation wheel UI element in second direction opposite the first direction changes a currently displayed image of the image collection in accordance with a second direction in the bi-directional linear order and concurrently changes the current location indicator on the bar UI element so as to integrate movement of the navigation wheel UI element and the bar UI element. The bar UI element is configured to switch between (i) a display mode where the label for each category in the plurality of categories is displayed thereby displaying the plurality of labels and where selection of a displayed label in the plurality of labels causes the current location indicator to jump to a position in the bi-directional linear order that represents the corresponding category of the plurality of categories and to display an image in the plurality of images that is in the corresponding category, and (ii) a standard mode where the label of the current category of the image collection is displayed and no other label in the plurality of labels is displayed.
Another aspect of the present disclosure provides a method performed at an electronic device with a touch-sensitive surface executing one or more applications. The method comprises rendering a navigation wheel within a first application in the one or more applications. The first application electronically accesses an image collection comprising a plurality of images indexed as an ordered list that specifies a bi-directional linear order by which images in the plurality of images are to be displayed. The ordered list comprises a plurality of contiguous subsets of images. Each respective contiguous subset of images in the plurality of contiguous subsets of images represents a different category in a plurality of categories. Each category in the plurality of categories is associated with a corresponding label in a plurality of labels. The first application displays a currently displayed image from the image collection on the touch-sensitive surface in accordance with the bi-directional linear order. In the method, a bar UI element is rendered within the first application. The bar UI element includes a plurality of indicia indicative of respective categories in the plurality of categories. Spacing between the indicia indicates a number of images in the plurality of images in each category. The bar UI element displays a current location indicator that indicates a location of the currently displayed image within the ordered list. In the method, a directional user input for the navigation wheel in a first direction is received. Responsive to the directional user input in the first direction, the currently displayed image is replaced with a replacement image from among the plurality of images in accordance with a first direction in the bi-directional linear order. Further, the bar UI element is updated to indicate a location of the replacement image. In the method, a second user input is received to toggle the bar UI element between (i) a navigation mode where the respective label for each category in the plurality of categories is displayed alongside the indicia in the plurality of indicia corresponding to the respective category thereby displaying the plurality of labels, and (ii) a standard mode where the label of the current category of the image collection is displayed and no other label in the plurality of labels is displayed.
Another aspect of the present disclosure provides a method comprising: rendering, on a display, a wheel User Interface (UI) element and a bar UI element. In the method there is successively rendered, on the display, respective pictures of a plurality of pictures, where the plurality of pictures are indexed as an ordered list that specifies a bi-directional linear order by which pictures in the plurality of pictures are to be displayed, and wherein the ordered list comprises a plurality of contiguous subsets of pictures, wherein each respective contiguous subset of pictures in the plurality of contiguous subsets of pictures represents a different category in a plurality of categories, and each category in the plurality of categories is associated with a corresponding label in a plurality of labels. In the method, navigation proceeds through the plurality of pictures, responsive to user inputs for the wheel UI element, in accordance with the bi-directional linear order. Further, in the method, there is rendered, on the bar UI element, a plurality of indicia demarcating categories of the plurality of pictures. Further, in the method, there is indicated, on the bar UI element, representative positions of the rendered pictures within the ordered list. The bar UI element has a position indicating mode in which spacing between the indicia is dependent on a number of pictures of the corresponding category. In the method, a user input is received for the bar UI element in position indicating mode. Responsive to the user input, the bar UI element is transformed into a navigation mode where the plurality of selectable labels is displayed. Each selectable label in the plurality of selectable labels is in association with a corresponding indicium in the plurality of indicia. In the method a selection of a label is received. Responsive to the selection of the label, the bar UI element is transformed into position indicating mode, and a picture is rendered from the category associated with the selected label.
The innovations can be implemented as part of one or more methods, as part of one or more computing systems adapted to perform an innovative method, or as part of non-transitory computer-readable media storing computer-executable instructions for causing a computing system to perform the innovative method(s). The various innovations can be used in combination or separately. The foregoing and other objects, features, and advantages of the invention will become more apparent from the following detailed description, which proceeds with reference to the accompanying figures.
The implementations disclosed herein are illustrated by way of example, and not by way of limitation, in the figures of the accompanying drawings. Like reference numerals refer to corresponding parts throughout the drawings.
Examples of the disclosed technologies provide for efficient traversal of collections of images or other records. The disclosed technologies are suitable for deployment on small touchscreen devices such as mobile phones, but are not limited to such devices. The disclosed technologies can be deployed on laptops, desktop computers, kiosks, and special purpose computer-implemented displays such as cameras or medical image viewing systems. The disclosed technologies can be employed for viewing collections of objects such as images in a wide range of settings, including library catalogs, personnel directories, educational materials, automobiles, books, clothing, general merchandise, music, videos, specialized or professional products, or search results. The terms “catalog” and “collection” are used interchangeably within this disclosure to represent any such object collection.
One aspect of the present disclosure provides a computing system comprising a touch-sensitive surface, a processor, and memory. The memory stores instructions for executing a method in which a plurality of images is accessed. The images are indexed in a data structure specifying a bi-directional order by which the images are to be accessed. A first image from the images is included in a module on the surface based upon the order. A navigation wheel and a bar UI element are included in the module. The bar UI element presents a current location indicator indicating a location of the first image within the structure. A directional input for the navigation wheel in a first direction is received, and, in response, the first image is replaced with a second image in the module from among the plurality of images based upon the order and the bar UI element is updated to indicate the second image location.
In examples, two user interface (UI) elements are operated cooperatively. A first UI element, such as a wheel, provides simple, precise, and variable continuous traversal. Depending on variables such as length, speed, and/or position, a single swipe can traverse from one to ten, twenty, fifty, a hundred or more images of a catalog, in either direction.
In examples, a catalog can be organized in sections, which can be e.g. categories of clothing, or genres of movies, neighborhoods of houses, model years of cars, or any other categorization. A second UI element, such as a bar, represents an instant catalog, and can visually indicate the various sections of the catalog along its length, and simultaneously the current viewing position (e.g. index number of an image) within a section of the catalog. Visual indication can be provided by rendering pixels on a display with distinguishing features relative to surrounding pixels, to form indicia.
In examples, the second UI element can be reconfigured to a navigation mode, in which all the catalog sections are labeled for easy selection, enabling jump navigation as a complement to the sequential traversal offered by a wheel. As used in this disclosure, navigation and traversal are both used to refer to moving through a catalog or other ordered collection, which can be guided according to inputs for one or more UI elements.
Features of an example user interface according to the disclosed technologies are described with reference to
The traversed portion of the bar (e.g. above current position 160 in
A bar correlates to and provides a visual representation of a landscape of the entire catalog at once. A user can select anywhere along the bar so as to traverse the catalog skipping all images between a current point and a selected point or a selected section on the bar.
As used in this disclosure, a bar UI element is any element having a single directional extent along which information can be presented. That is, the position of a feature, label, or marker can be used to convey information. Bars can have extent in a second direction different from the directional extent, and can include labels or markers offset from the bar in the second direction, however the position of a label, marker, or feature in the second direction does not convey information. While some bars generally have the appearance of a straight line of narrow or wide width, other bars can be curvilinear, segmented, or another shape.
Thus, the navigational wheel 170 is a bidirectional control. The navigation wheel allows sequential traversing through a catalog of images without skipping images. The distance the user scrolls or moves the wheel left to right or right to left is directly related to a number of products displayed over that distance. For example, if a user moves the wheel by continuously swiping a finger the full width of the screen from right to left, then a total of ten products can be displayed, one at a time in sequential order. The speed of the scroll is directly related to the speed at which one product is replaced by the next product. As a result, both the length of a scroll and speed of a scroll can be used to determine how many products to display and a timing associated with how long (e.g., a duration) each of the products is displayed. The navigational wheel can provide a precise single-action user input with wide dynamic range—in this example, over one to ten images, in either direction.
In some examples, a scroll input over multiple images results in each of the multiple images being displayed, while in other examples one or more intermediate images could be skipped. A predetermined configuration parameter can be used to specify a minimum duration for which any image should be displayed, for example 0.1 second, 0.2 second, 0.5 second, 1.0 second, or any duration in the range 10 milliseconds-10 seconds. Another configuration parameter can be used to specify a maximum delay before the final image for the scroll input is displayed, for example 0.5 second, 1 second, 2 second, 5 second, 10 second, or any delay in the range 0.1 second to 100 second. Thus, as an illustration, a scroll over nine images can display the third image for 0.5 second, the sixth image for 0.5 second, and then display the destination (ninth) image at 1.0 second after the scroll is completed, in order to meet the configured display parameters. In another example, a scroll input may begin slowly, in which case the first few images are all displayed; when the scroll accelerates subsequently, one or more images can be skipped. By way of illustration, a scroll over nine images could display the first, second, third, fifth, and ninth images, while omitting display of the fourth, sixth, seventh, and eighth images. A scroll input can also start off quickly and end slowly, or follow some other temporal profile. A single scroll input can also combine forward and backward movements.
Turning to the bar UI element,
Operation of the navigation wheel 170 is described further with reference to
As used in this disclosure, the term “indicia” can be singular or plural; an indicia is any visually discernible marker or feature that conveys information. A marker can be a filled or unfilled circle, polygon, or other shape; or a group of pixels represented in one or more colors different from colors of neighboring pixels; or a text label or image. A feature can be an attribute of one or more other objects rendered in a UI. For example, in a segmented bar in which two abutting segments are rendered in different colors, the junction between the two segments is a feature that can convey information and can be an indicia. Likewise, a visually discernible gap between two segments can be an indicia, even if the gap pixels are the same color as a background color.
At process block 220, a directional user input is received for the navigation wheel UI element. Based on the directional user input, the currently displayed image is replaced with a replacement image at process block 225. The currently displayed image and the replacement image can belong to the same or different categories of images. The bar UI element is also updated at process block 225 to indicate the location of the replacement image. At process block 230, a second user input is received for the bar UI element. The second user input causes the bar UI element to be transformed to a navigation mode. In the navigation mode, a heading or label is displayed alongside each category-indicating indicia. The headings or labels are selectable to cause the displayed image and its corresponding position indicator to jump to the category associated with the selected label.
At process block 610, a bar UI element is displayed, in a position-indicating mode. At process block 615, indicia of image categories are displayed on the bar UI element; segments of the bar between successive pairs of indicia represent respective categories. The indicia are spaced apart according to the amount of content in the categories. By way of illustration, a segment between third and fourth indicia can represent the third category, and the size of this segment can be based on the amount of content in the third category.
In some examples, the segment lengths (equivalent to indicia separation) can be linearly proportional to the amount of content, so that if two categories have content in the ratio 4:1, then the segment lengths are also in the proportion 4:1. In other examples, where variations in category sizes are very large, other monotonic functions can be used, such as square-root, or logarithm. For the square-root case, two segments having content in the ratio 4:1 could have segment lengths in the ratio 2:1. In the logarithmic case, a category having N images could have a segment length proportional to log(N), with any logarithmic base, or proportional to log(N+c) or c+log(N), where c is a constant, which can be a positive number, such as 1, and Nis a positive integer. Floor and ceiling functions can also be used, so that a segment length is never less than a minimum floor value, or never exceeds a maximum ceiling value. Blended functions can also be used. For example, segment lengths can be proportional or approximately proportional to N for values of N below a first threshold, transition to being proportional or approximately proportional to square-root of N over an intermediate range of N, and transition to being proportional or approximately proportional to log(N) above a second threshold.
In some examples, the indicia are markers, while in other examples, the indicia are features associated with the segments, and process blocks 610 and 615 are performed concurrently. At process block 620, the position of a currently displayed image within its category is indicated on the display. In examples, the position is indicated by an indicia on or alongside the bar UI element.
At process block 625, an input for the bar UI element is received, which can be a tap or a pointing device event within a region of an active display area that is associated with the bar UI element responsive to the bar input, at process block 625, the bar is transformed from position indicating mode to navigation mode. In the navigation mode, selectable headings are displayed for each category in visual association with respective bar segments or indicia. In some examples, the selectable headings are evenly spaced. As part of the transformation, the indicia for one or more categories can slide along the bar UI element.
At process block 630, a heading selection is received on the navigation mode bar UI element, leading to a fork. On the right fork, the bar is transformed back to position indicating mode at process block 645. On the left fork, the category associated with the selected heading is determined, and an image from the selected category is displayed. In examples, the displayed image is the first image in the selected category, or a median image, or the last image, or a randomly chosen image, or some other image. In other examples, the displayed image reverts to the last image that had previously been displayed from the selected category, if the selected category has been previously viewed.
In examples, the GUI architecture includes an image manager 720, a navigation module 730, a wheel module 740, and a bar module 750. The GUI architecture is operable in an environment that includes device 770, which can have one or more processors, one or more displays 772, one or more display buffers 760, display drive circuitry, a power supply, and other features of a computer system described herein. The environment can also include software or data components such as image library 722, an operating system, a browser, an event handler, one or more display drivers, and a rendering engine. In some embodiments, one or more of the described environmental components can be incorporated into the GUI architecture, while in other embodiments, a system can include some or all of the objects depicted in
Although
At a high level, navigation module 730, image manager 720, and bar module 750 cooperate to present images from image library 722 on the display 772, and to navigate through the image library 722 based on inputs received from event handler 710 for a wheel UI element 748 and a bar UI element 758. A wheel module 740 drives rendering of the wheel UI element 748 and can provide motion or other features associated with the wheel UI element 748.
Navigation module 730 is connected between event handler 710 and image manager 720, and includes a computer-readable storage location 732 for a current position that represents a location of a currently displayed image within the image library 722. By way of illustration, if the images 724a-n are in sequential order and the currently displayed image is 724a, then current position store 732 can contain the index value of image 724a, which can be “1” (or “0,” if 0-based indexing is used). Similarly, current position store 732 can store “3” if the currently displayed image is 724c.
Navigation module 730 is operable to receive e.g. a wheel event from event handler 710, and update the current position 732 accordingly. For example, a left-swipe of the wheel can lead to decrementing the current position 732 by one or more units, while a right-swipe of the wheel can lead to incrementing the current position 732 by one or more units. The action on the bar UI element 757 is indicated by the arrow to tag 701, which connects to the event handler 710. The value in the current position store 732 is provided to image manager 720 and is used to access the appropriate image 724 from library 722. Although shown as a unidirectional arrow, in some examples, image manager 720 can fetch the current position from current position store 732. The current position is also provided to bar module 750. In position-indicating mode, the current position is used to show the position of the currently displayed image within the image library 722, or within a particular section of the image library 722. Thus, a wheel event can cause both the indicated position and the displayed image to be updated in tandem.
The event input received by navigation module 730 can also be provided, with optional processing, to wheel module 740 to provide visual feedback of the received input. For example, a left-swipe of the wheel can lead to indicia on the wheel appearing to move to the left, while a right-swipe can lead to indicia motion to the right. Wheel module can write the indicia into wheel buffer 746, either directly or through intermediary software components.
Image manager 720 is coupled between image library 722 and image buffer 726, and is operable to access a current image from image library 722 and write the current image into image buffer 726, either directly or through intermediary software components. In examples, the current image can be resized to fit the size of image tableau 728 on device 770. In examples, the image manager 720 can access a low-resolution version of the current image from image library 722 if a high-resolution is not available, or not yet available. The image manager 720 can provide a graphical or textual indication of waiting or loading if the current image is in process of download.
Bar module 750 is coupled to receive inputs from the event handler 710 or from the navigation module 730, and to provide outputs to the navigation module 730 and the bar buffer 756. When the bar UI element is in position-indicating mode 757, an event generated by a tap on the bar UI element 757 can be received from event handler 710 and can lead to re-drawing of the bar UI element in navigation mode 758. The tap on the bar UI element 757 is indicated by the arrow to tag 702, which connects to the event handler 710. When the bar UI element is in navigation mode 758, an event generated by a tap on the bar UI element (or, more precisely, on one of the section labels 759a-e) can lead to re-drawing of the bar UI element in position-indicating mode 757. The tap on the bar UI element 758 is indicated by the arrow to tag 703, which connects to the event handler 710. Selection of a section label 759 indicates selection of the corresponding section of the image library 722; this information is routed from the bar module 750 to the navigation module 730 so that current position store 732 and the currently displayed image can be updated.
Bar module 750 is also operable to receive current position information from navigation module 730, and update the current position indication on position-indicating bar 757. As shown in
Within bar module 750, display of the position-mode bar 757 is handled by a position block 752, while display of the navigation-mode bar 758 is handled by navigation block 754.
Connections between image buffer 726 and image tableau 728, between bar buffer 756 and bar UI element 757/758, and between wheel buffer 746 and wheel UI element 748 are not shown in
The GUI architecture can be implemented within a browser, or as a stand-alone application. The GUI architecture can support additional functions and can incorporate additional components to provide these functions. Such functions can include coaching mode, additional UI elements such as: text indicators associated with a displayed image, buttons for exiting the GUI or launching other functions, links associated with specific displayed objects, buttons for bookmarking an item, or buttons for collecting one or more groups of items.
As used in this disclosure, the terms “GUI” (graphical user interface) and “UI” are used interchangeably. Examples of disclosed technologies can incorporate graphical UI elements. Use of the term GUI does not imply exclusion other forms of sensory interaction, such as spoken, auditory, touch, or haptic.
The method of
Wheel Input Event.
At process block 810, an input event for a navigation wheel is received, as a result of which a current position is updated at process block 815. At process block 820, a check is made whether updating the position has changed a catalog section within which the current position is located. If yes, then the Y branch is followed, and at process block 845 the position mode bar manager updates the current section as needed. In some examples, entering a new section, in either the forward or backward direction, can cause a label of the newly entered section to be displayed, either temporarily or persistently. From process block 845, the method proceeds to process block 850. If at 820 the section is unchanged, then the N branch leads directly to process block 850.
At process block 850, the current position is updated within a segment of the bar UI element representing its section, and control proceeds to process block 825 where the new image at the updated current position is rendered on the display. One of ordinary skill will appreciate that process blocks 820, 845, 850, and 825 can be rearranged in several ways, while retaining the same or equivalent functionality. For example, process block 820 can be performed between process blocks 810 and 815, in which case the image is updated before the position indicator is updated. Particularly, update of the displayed image and update of the position indicator can be performed substantially simultaneously, which means that the updates appear, to a user, to be associated with each other and to the wheel input. In examples, the time interval between the beginning (or, completion) of the image update and the beginning (or, completion) of the position update can be less than or equal to 50 ms, 100 ms, 200 ms, 500 ms, or 1 second.
Following process block 825 in the example shown, the method follows tag “W” to loop back to the top and wait for another wheel input. In
Meanwhile, in the middle lane, the position-mode bar manager module can wait after process block 850 until a bar input is received at process block 855, or until further inputs are received from another lane (such another wheel input).
Input to Position-Indicating Mode Bar Element.
At process block 855, an input is received from the event manager, indicating an input (such as a tap or mouse event) on the position-mode bar UI element. As a result of this event, the bar UI element is transformed from position-indicating mode to navigation mode at process block 860. Following transformation, the method follows tag “N” to continue in the navigation-mode bar module lane. At process block 870, the bar is displayed with spaced indicia, and section labels are displayed at process block 875. While drawn separately, process blocks 860, 870, and 875 can be combined, rearranged, or redistributed. In some examples, indicia designating the sections slide, move with animation, or are otherwise modified during the transformation 860 or 870, while in other examples, the indicia are unchanged between position-indicating mode and navigation mode. In examples, the section labels rendered at process block 875 are evenly spaced. Following completion of process blocks 860, 870, 875, the method waits to receive e.g. a label selection input at process block 880, as indicated by the dotted line arrow leading to 880.
Input to Navigation Mode Bar Element.
A label selection is received at process block 880. In examples, each section label is treated as an independent UI element having an associated screen area, and can receive associated events directly. In other examples, an area covering the entire navigation mode bar UI element, including all section labels, is handled as a single UI element, and event coordinates are processed within the GUI architecture to determine which label was selected. Regardless of the underlying UI element structure, at process block 880, a selection identified with a particular section label is received. At process block 885, a current position is set within the selected section, and at process block 890, the bar UI element is transformed back into position-indicating mode. This transformation can include removal of some or all of the section labels, retention of the selected section label either temporarily or persistently, and sliding of section markers. The method follows tag “P” to continue in the position-mode bar module lane.
At process block 840, the bar is displayed with indicia spaced according to sizes of respective sections. In examples, some functions of process blocks 885, 890, and/or 840 can be combined or rearranged. Following 840, the method proceeds to process blocks 815 onward, where the current position, current section, indicated position, and displayed image are updated as previously described.
The currently displayed image and the current position can be controlled by both the navigation wheel UI element (for smooth sequential scrolling) and the bar UI element (for jumps to a selected section when the bar UI element is in navigation mode). Thus the wheel and bar UI elements provide integrated control of navigation, supporting precise variable sequential motion as well as discontinuous jumps through sections of an object collection.
Initialization.
Another aspect of
Example Pixel Calculation for Section Markers.
At process block 910, a pixel length P of the bar UI element is obtained. The sections are indexed by variable i, and at process block 920 an amount A(i) of content is determined for each section. In examples, A(i) can be a number of images, of catalog items, or of records. In other examples, A(i) can be indicative of a total size of the objects in the ith section, which can be measured in bytes, or pages, or in another unit.
At process block 930, pixel lengths B(i) for the sections are determined. As shown, B(i) can be proportional to A(i), and B(i)=(P×A(i))/ΣkA(k), adjusted by rounding or truncation to an integer value, and where k is a dummy variable running over all the sections. In other examples, the dynamic range of the A(i) can be large, and the segment lengths for the various sections can be set proportional to a monotonic function F of A(i), such as square-root, or some other power p, 0<p<1, or logarithm, or some other blend or variation of functions. In such examples, B(i)=(P×F(A(i)))/ΣkF(A(k)).
At process block 940, the pixel position of the indicia is calculated. The first indicia is set to the pixel coordinate P0 of the beginning of the bar UI element, thus C(1)=P0. Successive indicia are positioned at pixel coordinates C(i+1)=C(i)+B(i). At process block 950, the section markers or other indicia are rendered at these pixel coordinates C(i). Although flowchart 900 shows process blocks 940 and 950 as distinct, the calculation and rendering can be performed together; for example, the coordinate of the ith section marker can be calculated and the ith section marker rendered, before computing the coordinate of the i+1th marker.
Finally, an end marker can be rendered at optional process block 960.
In some examples, the indicia are features such as boundaries between adjacent segments rendered in different styles, such as for bar 1220 described below. For such examples, process blocks 950 and 960 can be replaced as follows. In place of process block 950, each ith segment can be rendered from C(i) to C(i+1). In place of process block 960, the last segment can be rendered from the last C(i) value to the end of the bar UI element at P0+P.
A similar method is applicable for bar UI elements that are curvilinear, or not orthogonally aligned to the pixel grid. In such examples, a coordinate can be defined along the directional extent of the bar UI element, with P0 being the starting value of this coordinate at the beginning of the bar UI element, and P0+P the ending value of this coordinate. Then, the above procedure yields C(i) that are coordinate values along the bar, rather than pixel coordinates, and the C(i) values can be transformed to pixel coordinates according to the geometry of the bar UI element.
Example Launching of a GUI Architecture.
The method commences at process block 1010, with a launching webpage loaded onto a client browser. A launching webpage could be a home page, product page, or catalog page for a manufacturer, retailer, brand-owner, sales channel affiliate, or purveyor, owner, or publisher of a catalog or collection of images or other items. A launching webpage could be another webpage on which a catalog link is listed as an item or within an advertisement.
At process block 1020, a selection of a catalog is received at the device browser. The selection can be for an entire catalog, a partial catalog structure (such as “Women's clothing”), and can reflect other filtering (all “red” clothes) or a database query (all clothes branded “Banana Republic”™ and available in size 12). At process block 1030, the selected catalog is requested from a server.
At process block 1035, a catalog API server (which can be a primary server, a mirror, an edge server, or CDN) receives the catalog request from the requesting client. At process block 1040, a GUI webpage according to the disclosed technologies is transmitted to the requesting device. The GUI webpage can include both graphic elements of the GUI, and active script for executing functions as disclosed herein. In examples, process block 1045 can be omitted if client device has the GUI already cached. The transmitted GUI is received by the requesting client at process block 1050
At process block 1055, a catalog structure is transmitted to the requesting client, and received at process block 1060. The catalog structure can incorporate a data structure including one or more of: sections into which the catalog is organized, identifiers or attributes of items of the catalog (such as serial number, product code, product description, availability, sizes, or colors), links to catalog images, and/or off-catalog links (such a dedicated page for an item). In examples, the catalog structure can be a JSON structure, but other structures can be used.
After process block 1060, the requesting device possesses the GUI webpage, any required scripts, and the catalog structure, allowing the GUI to be built and launched at process block 1070. In examples, building and launching the GUI can include rendering of the bar UI element and/or the navigation wheel UI element described herein.
At process block 1075, catalog items are transmitted to the requesting client. In examples, process block 1075 can follow directly from process block 1055, or can proceed by request from the device browser, or by a combination. For example, a catalog API server can proceed to transmit low-resolution or thumbnail images of catalog items to the client device without receiving an explicit request, but can wait to receive explicit client requests before transmitting high-resolution images. In this way, bandwidth can be conserved and utilized dynamically according to a user's navigation pattern. For example, if a user jumps to section #4 and starts navigating forward, the GUI can request high-resolution images for section #4, and these can be delivered promptly without making the user wait until all content for sections #1-3 have been downloaded. In examples, high-resolution images can be requested and downloaded both forward and backward from the current position to provide responsiveness regardless of which direction a user operates the navigation wheel. In some examples, high-resolution images that have been cached need not be downloaded again; in other examples, the catalog and/or individual sections or items can be updated during a GUI session. In examples, process block 1075 can occupy an extended time interval, optionally including portions before the GUI is launched, portions during the launch of the GUI, and portions after the GUI has been launched.
The description above is based on a request at process block 1030. In other examples, process blocks 1010-1035 can be omitted, and the catalog GUI can be pushed to clients such as kiosks or catalog subscribers.
Although process blocks 1030-1035, 1035-1040, and 1045-1050 are shown directly connected, each of these connections can follow paths of varying complexity, with intermediate processing of the request at different protocol layers. Intermediate processing can include determining which server should respond to the request, applying any filtering or query in the request, determining caching status of the client device, determining which catalog version should be sent to the client, routing the request from an advertiser network to the catalog host, or merging advertisement content with the requested catalog.
Additional Exemplary Features.
The wheel UI element.
The wheel UI element 170 of
However, many other variations of wheel UI elements are within scope of the disclosed technologies.
The above examples depict wheels seen edge-on (that is, so the face of the wheel is not visible), but this is not a requirement.
While some examples of the disclosed technologies operate with swipe or dragging input gestures on a wheel UI element, this is not a requirement of the disclosed technologies. In examples, wheel UI elements can be operated by taps, by events from a pointing device such as a trackball or mouse, by other gestures, or by audible inputs. Wheels can also be sensitive to the position of an input, for example an input near the end of a wheel can result in a larger traversal than an input near the center of the wheel. In examples, a wheel UI element can be user-configurable, including visual and operational features of the wheel, such as style, directional sense, input modes, appearance, or audio, visual, haptic, or other special effects.
The bar UI Element.
The bar UI element 110 of
However, many other variations of bar UI elements are within scope of the disclosed technologies. For example, the color change of a bar during traversal can be limited to portions of a catalog that have been viewed. Viewing part of section #1, followed by a jump to section #4 and viewing the entirety of section #4 could result in a change of color of the viewed portion of section #1 and all of section #4, with unviewed portions of sections #1-3 retaining an unmodified base color.
The sectional divisions of a bar into segments can be represented in a multitude of ways. In
As discussed herein, a bar UI element need not be in the form of a straight line.
In examples, a bar UI element can be user-configurable, including visual and operational features of the bar, such as style, directional sense, input mode, appearance, or audio, visual, haptic, or other special effects.
The Bar in Position Indicating Mode.
In position indicating mode, the current position can be indicated in numerous ways.
The Bar in Navigation Mode.
In navigation mode, the section labels can be indicated in numerous ways. The left side of
Both
Transformation of the Bar Between Modes.
As described herein and shown on the right-hand side of
Other aspects of the bar transformation include a change in appearance of the bar itself, the appearance/disappearance of labels and lead lines, and the disappearance of an extra section marker 1318f in position indicating mode—because there is no corresponding label at the end of the catalog, there is no need for a section marker at the end of the catalog in navigation mode. All of these transformation aspects can be done suddenly, or smoothly with fade-in/fade-out, translation, distortion, animation, or other special effects. In some examples, labels can fade-in at their designated position, while in other examples, labels can fade-in alongside their corresponding moving section markers during a transformation. In further examples, section labels can be slid in from one or more edges of the display. Removal of labels offers a similar variety of choices. In some examples, transformations of GUI elements can be implemented using CSS (cascading style sheets) functionality. Extensions or variants of CSS such as Less, Sass, and Stylus can also be used.
A Generalized Computer Environment.
With reference to
A computing system 1410 can have additional features, such as one or more of storage 1440, input devices 1450, output devices 1460, or communication ports 1470. An interconnection mechanism (not shown) such as a bus, controller, or network interconnects the components of the computing environment 1410. Typically, operating system software (not shown) provides an operating environment for other software executing in the computing environment 1410, and coordinates activities of the components of the computing environment 1410.
The tangible storage 1440 can be removable or non-removable, and includes magnetic disks, magnetic tapes or cassettes, CD-ROMs, DVDs, or any other medium which can be used to store information in a non-transitory way and which can be accessed within the computing environment 1410. The storage 1440 stores instructions of the software 1480 (including instructions and/or data) implementing one or more innovations described herein.
The input device(s) 1450 can be a mechanical, touch-sensing, or proximity-sensing input device such as a keyboard, mouse, pen, touchscreen, or trackball, a voice input device, a scanning device, or another device that provides input to the computing environment 1410. The output device(s) 1460 can be a display, printer, speaker, optical disk writer, or another device that provides output from the computing environment 1410.
The communication port(s) 1470 enable communication over a communication medium to another computing entity. The communication medium conveys information such as computer-executable instructions, audio or video input or output, or other data in a modulated data signal. A modulated data signal is a signal that has one or more of its characteristics set or changed in such a manner as to encode information in the signal. By way of example, and not limitation, communication media can use an electrical, optical, RF, acoustic, or other carrier.
In some examples, computer system 1400 can also include a computing cloud 1490 in which instructions implementing all or a portion of the disclosed technology are executed. Any combination of memory 1424, storage 1440, and computing cloud 1490 can be used to store software instructions and data of the disclosed technologies.
The present innovations can be described in the general context of computer-executable instructions, such as those included in program modules, being executed in a computing system on a target real or virtual processor. Generally, program modules or components include routines, programs, libraries, objects, classes, components, data structures, etc. that perform particular tasks or implement particular abstract data types. The functionality of the program modules can be combined or split between program modules as desired in various embodiments. Computer-executable instructions for program modules can be executed within a local or distributed computing system.
The terms “system,” “environment,” and “device” are used interchangeably herein. Unless the context clearly indicates otherwise, neither term implies any limitation on a type of computing system, computing environment, or computing device. In general, a computing system, computing environment, or computing device can be local or distributed, and can include any combination of special-purpose hardware and/or general-purpose hardware and/or virtualized hardware, together with software implementing the functionality described herein. Virtual processors, virtual hardware, and virtualized devices are ultimately embodied in one or another form of physical computer hardware.
Referring to
In some implementations, the communication network 1614 interconnects one or more computing devices 1410 with the application server system 1618. In some implementations, the communication network 1614 optionally includes the Internet, one or more local area networks (LANs), one or more wide area networks (WANs), other types of networks, or a combination of such networks.
In some implementations, the application server system 1618 includes an application server module 1620, a user profile database 1622, and an image collection 1624 comprising a plurality of images 1626. In some embodiments, the application server module 1618, through the application module 1640, provides users with an image catalog comprising images 1626 from the image collection 1624.
In some embodiments, application server module 1620 maintains a profile in the user profile database 1622 of each user that access the image collection 1624 through a computing device 1410. In some embodiments, there are hundreds, thousands, tens of thousands or more users of the application module 1604 on corresponding computing devices 1410 and the application server module 1620 stores a profile for each such user in user profile database 1622. In some embodiments, the user profile database 1622 does not store an actual identity of such users, but rather a simple login and password. In some embodiments, the profiles in the user profile database 1622 are limited to the logins and passwords of users. In some embodiments, the profiles in user profile database 1622 comprises user logins, passwords, and information regarding purchases users have made and/or have selected for purchase. In some embodiments, the user profile in the user profile database 1622 includes a limited amount of information whereas a user profile 1602 on a computing device 1410 associated with the user contains more information. For example, in some embodiments, the user profile in user profile database 1622 includes user login and password whereas the user profile 1602 on the computing device 1410 for the same user includes credit card information associated with the user. It will be appreciated that any possible variation of this is possible, with the profile for the user in user profile database 1622 including all or any subset of the data associated with the user and the user profile 1602 for the user on the corresponding computing device 1410 including all or any subset of the data associated with the user. In some embodiments, there is no user profile 1602 stored on computing device 1410 and the only profile for the user is stored on application server 1618 in user profile database 1622.
In typical embodiments, the input 1710 is a touch-sensitive display, such as a touch-sensitive surface. In some embodiments, the user interface 1706 includes one or more soft keyboard embodiments. The soft keyboard embodiments may include standard (QWERTY) and/or non-standard configurations of symbols on the displayed icons.
Device 1410 optionally includes, in addition to accelerometer(s) 1717, a magnetometer (not shown) and a GPS 1719 (or GLONASS or other global navigation system) receiver for obtaining information concerning the coordinates and orientation (e.g., portrait or landscape) of device 1424.
It should be appreciated that device 1424 is only one example of a multifunction device that may be used, and that device 1424 optionally has more or fewer components than shown, optionally combines two or more components, or optionally has a different configuration or arrangement of the components. The various components shown in
Memory 1424/1440 optionally includes high-speed random access memory and optionally also includes non-volatile memory, such as one or more magnetic disk storage devices, flash memory devices, or other non-volatile solid-state memory devices. Access to memory 1424/1440 by other components of device 1410, such as CPU(s) 1422 is, optionally, controlled by memory controller 1768.
Peripherals interface 1770 can be used to couple input and output peripherals of the device to CPU(s) 1422 and memory 1424/1440. The one or more processors 1422 run or execute various software programs and/or sets of instructions stored in memory 1424/1440 to perform various functions for device 1410 and to process data.
In some embodiments, peripherals interface 1770, CPU(s) 1424/1440, and memory controller 1768 are, optionally, implemented on a single chip. In some other embodiments, they are, optionally, implemented on separate chips.
In some embodiments, RF (radio frequency) circuitry of the network interface 1470 receives and sends RF signals, also called electromagnetic signals. RF circuitry 1470 converts electrical signals to/from electromagnetic signals and communicates with communications networks and other communications devices via the electromagnetic signals. RF circuitry 1470 optionally includes well-known circuitry for performing these functions, including but not limited to an antenna system, an RF transceiver, one or more amplifiers, a tuner, one or more oscillators, a digital signal processor, a CODEC chipset, a subscriber identity module (SIM) card, memory, and so forth. RF circuitry 1470 optionally communicates with networks 1614. In some embodiments, circuitry 1470 does not include RF circuitry and, in fact, is connected to network 1614 through one or more hard wires (e.g., an optical cable, a coaxial cable, or the like).
Examples of networks 1614 include, but are not limited to, the World Wide Web (WWW), an intranet and/or a wireless network, such as a cellular telephone network, a wireless local area network (LAN) and/or a metropolitan area network (MAN), and other devices by wireless communication. The wireless communication optionally uses any of a plurality of communications standards, protocols and technologies, including but not limited to Global System for Mobile Communications (GSM), Enhanced Data GSM Environment (EDGE), high-speed downlink packet access (HSDPA), high-speed uplink packet access (HSUPA), Evolution, Data-Only (EV-DO), HSPA, HSPA+, Dual-Cell HSPA (DC-HSPDA), long term evolution (LTE), near field communication (NFC), wideband code division multiple access (W-CDMA), code division multiple access (CDMA), time division multiple access (TDMA), Bluetooth, Wireless Fidelity (Wi-Fi) (e.g., IEEE 802.11a, IEEE 802.11ac, IEEE 802.11ax, IEEE 802.11b, IEEE 802.11g and/or IEEE 802.11n), voice over Internet Protocol (VoIP), Wi-MAX, a protocol for e-mail (e.g., Internet message access protocol (IMAP) and/or post office protocol (POP)), instant messaging (e.g., extensible messaging and presence protocol (XMPP), Session Initiation Protocol for Instant Messaging and Presence Leveraging Extensions (SIMPLE), Instant Messaging and Presence Service (IMPS)), and/or Short Message Service (SMS), or any other suitable communication protocol, including communication protocols not yet developed as of the filing date of this document. In some embodiments, the network 1614 is a wired network. In some embodiments, the network 1614 is a wireless network. In some embodiments, the network 1614 is a combination of a wireless and a wired network.
In some embodiments, audio circuitry 1772, speaker 1760, and microphone 1762 provide an audio interface between a subject (user of application module 1604) and device 1410. The audio circuitry 1772 receives audio data from peripherals interface 1770, converts the audio data to one or more electrical signals, and transmits the one or more electrical signals to speaker 1760. Speaker 1760 converts the one or more electrical signals to human-audible sound waves. Audio circuitry 1772 also receives electrical signals converted by microphone 1762 from sound waves. Audio circuitry 1772 converts the electrical signal to audio data and transmits the audio data to peripherals interface 1770 for processing. Audio data is, optionally, retrieved from and/or transmitted to memory 1424/1440 and/or RF circuitry 1470 by peripherals interface 1770.
In some embodiments, power system 1718 optionally includes a power management system, one or more power sources (e.g., battery, alternating current (AC)), a recharging system, a power failure detection circuit, a power converter or inverter, a power status indicator (e.g., a light-emitting diode (LED)) and any other components associated with the generation, management and distribution of power in portable devices.
In some embodiments, the device 1410 optionally also includes one or more optical sensors 1773. Optical sensor(s) 1773 optionally include charge-coupled device (CCD) or complementary metal-oxide semiconductor (CMOS) phototransistors. Optical sensor(s) 1773 receive light from the environment, projected through one or more lens, and converts the light to data representing an image. Optical sensor(s) 1773 optionally capture still images and/or video. In some embodiments, an optical sensor is located on the back of device 1410, opposite display system 1708 on the front of the device, so that the touch screen is enabled for use as a viewfinder for still and/or video image acquisition.
As illustrated in
Further still, in some embodiments, the device 1410 comprises a user profile 1602. Exemplary user profiles 1602 comprise a description of one or more articles 1770, and for each such respective article 1770, the quantity 1772 of the respective article 1770 the user wishes to purchase, the size of the article the user wishes to purchase, the prices 1776 of the respective article 1770, any applicable discounts 1778 to the prices, and a shipping destination 1780 for the respective article. In some embodiments the user profile 1602 further comprises rewards information 1782 associated with the user, prior user purchase information 1784, and/or one or more messages 1786 for the user.
In some implementations, one or more of the above identified elements are stored in one or more of the previously mentioned memory devices, and correspond to a set of instructions for performing a function described above. The above identified modules or programs (e.g., sets of instructions) need not be implemented as separate software programs, procedures or modules, and thus various subsets of these modules may be combined or otherwise re-arranged in various implementations. In some implementations, the memory 1424/1440 optionally stores a subset of the modules and data structures identified above. Furthermore, the memory 1424/1440 may store additional modules and data structures not described above.
In some implementations, one or more of the above identified elements are stored in one or more of the previously mentioned memory devices, and correspond to a set of instructions for performing a function described above. The above identified modules or programs (e.g., sets of instructions) need not be implemented as separate software programs, procedures or modules, and thus various subsets of these modules may be combined or otherwise re-arranged in various implementations. In some implementations, the memory 1810 optionally stores a subset of the modules and data structures identified above. Furthermore, the memory 1810 may store additional modules and data structures not described above.
Although
An Example Cloud Computing Environment.
The computing cloud 1590 can be operatively connected to various types of computing devices (e.g., client computing devices), such as computing devices 1512, 1514, and 1516, and can provide a range of computing services thereto. One or more of computing devices 1512, 1514, and 1516 can be computers (e.g., server, virtual machine, embedded systems, desktop, or laptop computers), mobile devices (e.g., tablet computers, smartphones, or wearable appliances), or other types of computing devices. Connections between computing cloud 1590 and computing devices 1512, 1514, and 1516 can be over wired, wireless, or optical links, or any combination thereof, and can be short-lived or long-lasting. These connections can be stationary or can move over time, being implemented over varying paths and having varying attachment points at each end. Computing devices 1512, 1514, and 1516 can also be connected to each other.
Computing devices 1512, 1514, and 1516 can utilize the computing cloud 1590 to obtain computing services and perform computing operations (e.g., data processing, data storage, and the like). Particularly, software 1580 for performing the described innovative technologies can be resident or executed in the computing cloud 1590, in computing devices 1512, 1514, and 1516, or in a distributed combination of cloud and computing devices.
General Considerations.
As used in this disclosure, the singular forms “a,” “an,” and “the” include the plural forms unless the context clearly dictates otherwise. Additionally, the terms “includes” and “incorporates” mean “comprises.” Further, the term “coupled” encompasses mechanical, electrical, magnetic, optical, as well as other practical ways of coupling or linking items together, and does not exclude the presence of intermediate elements between the coupled items. Furthermore, as used herein, the term “and/or” means any one item or combination of items in the phrase.
The systems, methods, and apparatus described herein should not be construed as being limiting in any way. Instead, this disclosure is directed toward all novel and non-obvious features and aspects of the various disclosed embodiments, alone and in various combinations and subcombinations with one another. The disclosed systems, methods, and apparatus are not limited to any specific aspect or feature or combinations thereof, nor do the disclosed things and methods require that any one or more specific advantages be present or problems be solved. Furthermore, any features or aspects of the disclosed embodiments can be used in various combinations and subcombinations with one another.
Although the operations of some of the disclosed methods are described in a particular, sequential order for convenient presentation, it should be understood that this manner of description encompasses rearrangement, unless a particular ordering is required by specific language set forth below. For example, operations described sequentially can in some cases be rearranged or performed concurrently. Moreover, for the sake of simplicity, the attached figures may not show the various ways in which the disclosed things and methods can be used in conjunction with other things and methods. Additionally, the description sometimes uses terms like “apply,” “determine,” “evaluate,” and “use” to indicate computer operations in a computer system. These terms denote actual operations that are performed by a computer. The actual operations that correspond to these terms will vary depending on the particular implementation and are readily discernible by one of ordinary skill in the art.
Theories of operation, scientific principles, or other theoretical descriptions presented herein in reference to the apparatus or methods of this disclosure have been provided for the purposes of better understanding and are not intended to be limiting in scope. The apparatus and methods in the appended claims are not limited to those apparatus and methods that function in the manner described by such theories of operation.
Any of the disclosed methods can be implemented as computer-executable instructions or a computer program product stored on one or more computer-readable storage media, such as tangible, non-transitory computer-readable storage media, and executed on a computing device (e.g., any available computing device, including tablets, smartphones, or other mobile devices that include computing hardware). Tangible computer-readable storage media are any available tangible media that can be accessed within a computing environment (e.g., one or more optical media discs such as DVD or CD, volatile memory components (such as DRAM or SRAM), or nonvolatile memory components (such as flash memory or hard drives)). By way of example, and with reference to
Any of the computer-executable instructions for implementing the disclosed techniques as well as any data created and used during implementation of the disclosed embodiments can be stored on one or more computer-readable storage media. The computer-executable instructions can be part of, for example, a dedicated software application or a software application that is accessed or downloaded via a web browser or other software application (such as a remote computing application). Such software can be executed, for example, on a single local computer (e.g., any suitable commercially available computer) or in a network environment (e.g., via the Internet, a wide-area network, a local-area network, a client-server network, a cloud computing network, or other such network) using one or more network computers.
For clarity, only certain selected aspects of the software-based implementations are described. Other details that are well known in the art are omitted. For example, it should be understood that the disclosed technology is not limited to any specific computer language or program. For instance, the disclosed technology can be implemented by software written in ABAP, Adobe Flash, C, C++, C #, Curl, Dart, Fortran, Java, JavaScript, Julia, Lisp, Matlab, Octave, Perl, Python, R, Ruby, SAS, SPSS, SQL, WebAssembly, any derivatives thereof, or any other suitable programming language, or, in some examples, markup languages such as HTML or XML, using CSS, JSON, or any combination of suitable languages, libraries, and packages. Likewise, the disclosed technology is not limited to any particular computer or type of hardware. Certain details of suitable computers and hardware are well known and need not be set forth in detail in this disclosure.
Furthermore, any of the software-based embodiments (comprising, for example, computer-executable instructions for causing a computer to perform any of the disclosed methods) can be uploaded, downloaded, or remotely accessed through a suitable communication means. Such suitable communication means include, for example, the Internet, the World Wide Web, an intranet, software applications, cable (including fiber optic cable), magnetic communications, electromagnetic communications (including RF, microwave, infrared, and optical communications), electronic communications, or other such communication means.
The disclosed methods, apparatus, and systems should not be construed as limiting in any way. Instead, the present disclosure is directed toward all novel and nonobvious features and aspects of the various disclosed embodiments, alone and in various combinations and subcombinations with one another. The disclosed methods, apparatus, and systems are not limited to any specific aspect or feature or combination thereof, nor do the disclosed embodiments require that any one or more specific advantages be present or problems be solved. The technologies from any example can be combined with the technologies described in any one or more of the other examples.
In view of the many possible embodiments to which the principles of the disclosed invention may be applied, it should be recognized that the illustrated embodiments are only preferred examples of the invention and should not be taken as limiting the scope of the invention. Rather, the scope of the invention is defined by the following claims. We therefore claim as our invention all that comes within the scope and spirit of these claims.
This application claims priority to U.S. Provisional Application Nos. 62/373,785, entitled USER INTERFACE WITH INTEGRATED USER INTERFACE ELEMENTS, filed Aug. 11, 2016, and 62/543,546, entitled USER INTERFACE WITH INTEGRATED USER INTERFACE ELEMENTS, filed Aug. 10, 2017, each of which is hereby incorporated by reference herein in its entirety.
| Number | Name | Date | Kind |
|---|---|---|---|
| 9411422 | McClendon | Aug 2016 | B1 |
| 20070112850 | Flynn | May 2007 | A1 |
| 20070143705 | Peters | Jun 2007 | A1 |
| 20070236475 | Wherry | Oct 2007 | A1 |
| 20120191577 | Gonsalves | Jul 2012 | A1 |
| 20120297302 | Barraclough | Nov 2012 | A1 |
| 20120311438 | Cranfill | Dec 2012 | A1 |
| 20130185642 | Gammons | Jul 2013 | A1 |
| 20130260869 | Basallo | Oct 2013 | A1 |
| 20130332856 | Sanders | Dec 2013 | A1 |
| 20150026575 | Martin | Jan 2015 | A1 |
| 20150212664 | Freer | Jul 2015 | A1 |
| Entry |
|---|
| JSON From Wikipedia, retrieved from https://en.wikipedia.org/wiki/JSON, archived Jul. 22, 2016, 13 pages. |
| Number | Date | Country | |
|---|---|---|---|
| 20180046365 A1 | Feb 2018 | US |
| Number | Date | Country | |
|---|---|---|---|
| 62543546 | Aug 2017 | US | |
| 62373785 | Aug 2016 | US |
