Hierarchical icons for graphical user interface

Methods, systems, and apparatus, including medium-encoded computer program products, for providing interrelated icons in user interfaces, e.g., for industrial printers, include a method including causing a printing device to print on a substrate in accordance with information provided through a graphical user interface; presenting selectable icons representing functions, associated with the printing device, being in each of two or more levels of a navigable hierarchy; enabling the user to navigate the hierarchy to provide the information; and improving efficiency of the printing device and reducing errors by including two graphical elements simultaneously in at least one of the selectable icons at one of the levels of the hierarchy; where one of the two graphical elements indicates a level of the hierarchy to which the function represented by the icon belongs; and the other one of the two graphical elements simultaneously indicates the function represented by the icon.

BACKGROUND

This specification relates to icons for user interfaces, such as those that can be used with industrial printers.

An icon in the context of computer user interfaces is a graphical representation of a program or function of a program, which is typically selectable (e.g., an icon can form part of a user interface button corresponding to a software tool). Traditionally, each icon is designed to represent its corresponding program or function with a single picture and no text. This can be helpful in making the icon readily understandable by people around the world who do not speak the same language, as the function that is performed by selection of the interface element with the given icon is readily apparent. Due to this improvement in the ease of operability of the user interface, icons have been used widely in many different types of user interfaces, including user interfaces for industrial printers.

SUMMARY

This specification describes technologies relating to interrelated icons for user interfaces, such as a user interface for industrial printers.

In general, one or more aspects of the subject matter described in this specification can be embodied in one or more methods that include causing a printing device to print on a substrate in accordance with information provided by a user through a graphical user interface of the printing device; in the graphical user interface, presenting selectable icons representing functions associated with the printing device, the functions being in each of two or more levels of a navigable hierarchy of the functions; enabling the user to navigate the hierarchy to provide the information; and improving the efficiency of the printing device and reducing error in the providing of the information by the user by including two graphical elements simultaneously in at least one of the selectable icons at one of the levels of the hierarchy; where one of the two graphical elements indicates for the user a level of the hierarchy to which the function represented by the icon belongs; and the other one of the two graphical elements simultaneously indicates for the user the function represented by the icon.

These are other embodiments can optically include one or more of the following features.

The level of the hierarchy can be a first level of the hierarchy, the improving can include including a color in the at least one of the selectable icons simultaneously with including the two graphical elements, and the color can indicate a second level of the hierarchy. The second level of the hierarchy can be a highest level of the hierarchy.

In general, one or more aspects of the subject matter described in this specification can also be embodied in one or more computer program products, encoded on a computer-readable medium, operable to cause data processing apparatus to perform operations that include presenting a first user interface element having a first icon including a graphical representation of a first functional menu in a user interface of a printing device, the first functional menu being at a first level of the user interface of the printing device; presenting, in response to a selection of the first user interface element, the first functional menu, the first functional menu including: a second user interface element having a second icon including both (a) the graphical representation of the first functional menu, and (b) a graphical representation of a second functional menu in the user interface of the printing device, the second functional menu being at a second level of the user interface of the printing device, and a third user interface element having a third icon including both (a) the graphical representation of the first functional menu, and (b) a graphical representation of a third functional menu in the user interface of the printing device, the third functional menu being at the second level of the user interface of the printing device; and presenting, in response to a selection of either the second user interface element or the third user interface element, either the second functional menu or the third functional menu, respectively.

These are other embodiments can optically include one or more of the following features.

The operations can further include presenting, in response to the selection of the second user interface element, the second functional menu, the second functional menu including: a fourth user interface element having a fourth icon including both (a) the graphical representation of the second functional menu, and (b) a graphical representation of a fourth functional menu in the user interface of the printing device, the fourth functional menu being at a third level of the user interface of the printing device, and a fifth user interface element having a fifth icon including both (a) the graphical representation of the second functional menu, and (b) a graphical representation of a fifth functional menu in the user interface of the printing device, the fifth functional menu being at the third level of the user interface of the printing device. Presenting the first user interface element can include presenting a top level functional menu including the first icon with the first user interface element and one or more additional icons with corresponding additional user interface elements, where each of the first icon and the one or more additional icons have different respective background colors; and where each of the second icon, the third icon, the fourth icon, and the fifth icon have the same background color as that of the first icon.

Presenting the first function menu can include presenting the graphical representation of the first functional menu such that it appears smaller than the graphical representation of the second functional menu.

Presenting the first function menu can include presenting the graphical representation of the first functional menu and the graphical representation of the second functional menu such that they are each differently aligned with respect to the second icon. The graphical representation of the first functional menu can be aligned lower with respect to the second icon than an alignment of the graphical representation of the second functional menu with respect to the second icon.

The data processing apparatus can be part of industrial printer systems employing different printer technologies, and the computer program product can be same graphical representations and icons in user interfaces with each of the industrial printer systems. The different printer technologies can include a laser marking technology and a thermal transfer printing technology.

In general, one or more aspects of the subject matter described in this specification can also be embodied in one or more systems that include an industrial printer system; and a user interface device for the industrial printer system; where the user interface device is designed to present sub-menu icons for user interface elements of a current sub-menu, in which, each of the sub-menu icons includes both a graphical representation of the current sub-menu and a graphical representation of an additional sub-menu reachable by selection of that sub-menu icon's interface element.

These are other embodiments can optically include one or more of the following features.

The user interface device can be further designed to: receive user input indicating a selection of one of the sub-menu icons; determine the additional sub-menu reachable by selection of the selected sub-menu icon; and responsive determining the additional sub-menu reachable by selection of the selected sub-menu icon, present additional sub-menu icons for user interface elements of that additional sub-menu, in which, each of the additional sub-menu icons includes both a graphical representation of the additional sub-menu and a graphical representation of a further sub-menu reachable by selection of that additional sub-menu icon's interface element.

The user interface device can be further designed to: present command icons for user interface elements of the current sub-menu, in which each of the command icons includes both the graphical representation of the current sub-menu and a graphical representation of a command executable by selection of that command icon's interface element; receive user input indicating a selection of one of the command icons; determine the command executable by selection of the selected command icon; and responsive to determining the command executable by selection of the selected command icon, transmit an indication of that command to the industrial printer system for execution. The command can include instructions that, when executed the industrial printer system, cause the industrial printer system to print on a substrate.

The user interface device can be designed to present a first subset of the sub-menu icons according a common color scheme, where the first subset of the sub-menu icons is determined based on a hierarchical relationship between the sub-menu icons of the first subset. The user interface device can be designed to present a second subset of the sub-menu icons according a second common color scheme, where the second subset of the sub-menu icons is determined based on a second hierarchical relationship between the sub-menu icons of the second subset. The first subset of sub-menu icons can be exclusive of the second subset of the sub-menu icons.

Other embodiments of the above aspects include corresponding systems, apparatus, and computer program products.

Particular embodiments of the subject matter described in this specification can be implemented to realize one or more of the following advantages. A user interface can be made easy to use and be understood by anybody in the world with a minimum of level of reading. Navigation through software interfaces can be simplified, where the icons themselves can be both the user interface elements and also graphically represent the path being taken by the user through the user interface. This can include using both icon pictures and colors to visually indicate the location in a user interface hierarchy, as well as the action(s) taken by the user to arrive there. The amount of text needed in a user interface can be reduced, which can reduce translation costs for the user interface when used in multiple different countries. Moreover, the icons can be drawn so as to be generally representative of functions that are applicable to multiple different types of industrial printers and thus can be reused across a wide range of printer products that employ very different printing technologies. This can facilitate the operator to pass from one printer to another without needed to be trained. Further, in some cases, user interfaces having these icons allows users to communicate more clearly and more efficiently with each other regarding the operation of a device. For example, a user operating a device may seek assistance from another user who is remote from the device (e.g., a colleague, a supervisor, or technical support representative). As the user interface of the device can be reused across a wide range of devices, the remote user can assist the user (e.g., by providing instructions or guidance), as long as he is familiar with at least one of the devices having that user interface. Further still, in some cases, user interfaces having these icons can also simplify the creation of instruction manuals and guides, as one or more steps in a procedure can be readily illustrated using the simplified user interfaces.

DETAILED DESCRIPTION

FIG. 1shows an example of an industrial printer system100. The industrial printer system100includes a printing device102, a power source104, a computer106, and a user interface108on a user interface device. Although the computer and user interface devices are shown as separate desktop computer, keyboard and monitor, it will be appreciated that the computer and one or more interface devices can have multiple different configurations, including potentially being fully integrated together in a single device, as in a tablet computer. Moreover, although wired connections are shown, wireless connections among the various system components are also possible in various implementations.

As a conveyor150moves in the direction of the arrow152, substrates154a-emove towards the printing device102. In various implementations, the substrates154a-ecan be sheets of papers, boxes, containers, or other objects in a manufacturing line, or the substrates154a-ecan be portions of a material web that is later applied to papers, boxes, containers, or other objects in a manufacturing line. As each substrate154a-epasses the printing device102, the printing device102prints information (e.g., text, drawings, patterns, or other markings) onto the substrates154a-e.

The industrial printer system100can print information onto the substrates154a-eusing a variety of different techniques. For example, in various implementations, the industrial printer system100can be a thermal transfer printer system, a laser printer system, an ink jet printer system, or a combination thereof. The industrial printer system100can include a printing head that applies markings to the substrates154a-ethrough thermal transfer (e.g., by melting a material onto the substrate), a laser that creates markings on the substrates154a-e(e.g., by passing a laser beam over the substrate to ablate a portion of the substrate or activate a material on or in the substrate to create a mark), or an ink jet printing array that applies droplets of ink onto the substrate.

The power source104provides electrical power for the industrial printer system100. Various types of power sources can be used. For example, the power sources104can be a remotely located source of power (e.g., an electric generator or a regional electrical grid) and/or receive power from a remotely located source of power. As another example, the power source104can include one or more devices that store electric energy (e.g., electrochemical cells or batteries) and release stored electric energy as needed. Although a single power source104is shown, in some cases, there may be multiple power sources104, and each can power one or more of the components of the industrial printer system100, either individually or in combination with other power sources104. Moreover, in some implementations, the power source104is integrated with a printer102, rather than being separate from it, as shown.

The computer106stores information related to the industrial printer system100, and controls the operation of the industrial printer system100. As an example, the computer106can transmit commands to each of the components of the industrial printer system100in order to instruct those components to perform various functions or tasks. As another example, the computer106can store information regarding the industrial printer system100, including sets of instructions (e.g., software applications), operating parameters (e.g., system settings and user preferences), or any other data related to operating the industrial printer system100.

The user interface108provides a mechanism by which one or more users can interact with the industrial printer system100. The user interface108can be provided, for example, through input/output devices such as a display screen (e.g., an LCD display), a touch-sensitive display screen, indicator lights, buttons, switches, dials, keypads, or combinations thereof. In some cases, the user interface108can be provided by or directly connected to the printer102, which in turn can be communicatively coupled with the computer106, one or more other computers on a network, or a combination thereof. The user interface108presents information regarding the operation of the industrial printer system100(e.g., information describing the operational status of the system, and information describing one or more commands that can be executed by the system). The user interface108also accepts commands from a user. For example, the user interface108can provide the user with one or more commands that can be executed by the user, and can receive input from the user specifying the selection of one or more of the presented commands. The user interface108interprets the input, then transmits an indication of the selection to the computer106for execution. Once the command is executed by the computer106, the computer106can, for example, cause the industrial printer system100to start printing, stop printing, or otherwise modifying the printing operation of the industrial printer system100.

The user interface108can present commands to a user in a variety of ways. For example, the user interface108can present each of the commands in the form of a list, a grid, or another ordered arrangement. Each command can be represented using user interface elements such as text (e.g., a textual label that describes the command), images (e.g., an icon that visually represents the command), or combinations thereof. As an example, in some cases, each of at least a subset of available commands (e.g., commands for navigation through a hierarchical menuing system of the user interface108) can be represented by a unique icon. Upon selection of a particular user interface element by the user, the user interface108determines which user interface element was selected, determines which command corresponds with the selected user interface element, and transmits an indication of that command to the computer106for execution.

In some cases, the user interface108can present information according to a hierarchical menu. For example, a menu of available commands can contain several different hierarchical levels, each containing one or more sub-menus and/or commands. Each of the sub-menus and commands can be organized according to one or more of these hierarchical levels, such that similar or otherwise related commands are grouped together. To access a particular command, the user navigates through the hierarchy of the menu (e.g., by selecting successive sub-menus at each of the hierarchical levels) until he arrives at the desired command. A hierarchical arrangement can be beneficial, for example, if there are several different commands that are available to a user, where some of the commands are more closely related to each other than others. By arranging the commands hierarchically, the commands are presented to the user in an intuitive and organized fashion. In some cases, only a subset of the available commands are presented to the user at any given time (e.g., only commands from a single sub-branch of the hierarchy) such that the number of options that are simultaneously presented to the user are reduced, thereby reducing clutter and increasing the readability of the user interface108.

In some cases, the user interface108can present each of the selections of a hierarchical menu that includes a system of interrelated icons. Each of the interrelated icons can include an indication of a particular selection within the hierarchical menu (e.g., a particular sub-menu or command), and an indication of the relationship between that selection and other selections within other levels of the hierarchical menu. This can be beneficial, for example, as it provides the user with a visual indication of the sub-menu or commands associated with the icon, as well as a visual indication of the relationship between that sub-menu or command with other selections across different hierarchy levels of the hierarchical menu. In some cases, these interrelated icons can be presented without accompany text (e.g., without textual labels or descriptions for each icon). This can be beneficial, for example, as it reduces the clutter and increases the readability of the user interface108, while reducing translation costs for the user interface108when used in multiple different countries.

Moreover, this arrangement can facilitate ease of use by the operator of printing systems when the same user interface108is used across multiple different types of industrial printing systems. Note that a manufacturing process may use multiple different printings systems100in the same manufacturing facility (e.g., an inkjet printing system to create labels for products, and a laser printing system to mark sell by dates on those products), and workers in that facility may need to operate each of the different printing systems. Thus, having a common user interface, which employs interrelated icons as described herein, for different printing system can reduce the amount of training time needed for workers.

FIG. 2Ashows a system of interrelated icons200, such as can be presented by the user interface108. At a first hierarchy level210, the system200includes several icons212a-c. Each of the icons212a-cincludes a graphical representation214a-c, respectively, that visually indicates a particular selection within a hierarchical menu (e.g., a particular sub-menu or command). Each of the icons212a-cis unique, such that the user can visually differentiate between each of the icons212a-c. In this example, the icons212aand212ceach represent a sub-menu on a second hierarchy level220, while the icon212brepresents a command. When the user selects the icon212b, the user interface108determines the command associated with the icon212b, and transmits an indication of the selected command to the computer106for execution.

When the user selects the icon212a, representing a sub-menu at the second hierarchy level220, the user is presented with several additional icons222a-c, each representing a different selection within that sub-menu. As above, each of the icons222a-cincludes a graphical representation224a-c, respectively, that visually indicates a particular selection within a hierarchical menu (e.g., a particular sub-menu or command). However, each of the icons222a-calso includes the graphical representation214a, e.g., a smaller version of the previously presented graphical representation214a, indicating that each of the available selections represented by the icons222a-care related to the selection represented by the icon212ain the first hierarchy level210. Thus, this allows the user to visually ascertain the relationship between the available selections in the second hierarchy level220with a particular one of the selections from the first hierarchy level210.

In this example, the icon222arepresents a sub-menu on a third hierarchy level230, while the icons222b-ceach represents a command. When the user selects either of the icons222b-c, the user interface108determines the command associated with the selected icon222b-c, and transmits an indication of the selected command to the computer106for execution.

When the user selects the icon222a, representing a sub-menu at the third hierarchy level230, the user is presented with several additional icons232a-c, each representing a different selection within that sub-menu. In a similar manner as above, each of the icons232a-cincludes a graphical representation234a-c, respectively, that visually indicates a particular selection within the hierarchical menu (e.g., a particular sub-menu or command). Each of the icons232a-calso includes the graphical representation224a, e.g., a smaller version of the previously presented graphical representation224a, indicating that each of the available selections represented by the icons232a-care related to the selection represented by the icon222ain the second hierarchy level220. Thus, this allows the user to visually ascertain the relationship between the available selections in the third hierarchy level230with a particular one of the selections from the second hierarchy level220. In a similar manner as above, when the user selects the icons232a-c, the user interface108determines the sub-menu or command associated with the selected icon232a-c, and either transmits an indication of the selected command to the computer106for execution, or presents further icons to the user for selection.

Similarly, when the user selects the icon212c, representing a different sub-menu at the second hierarchy level220, the user is presented with additional icons222d-e, each representing a different selection within that sub-menu. In a similar manner as above, each of the icons222d-eincludes a graphical representation224d-e, respectively, that visually indicates a particular selection within the hierarchical menu (e.g., a particular sub-menu or command). Each of the icons222d-ealso includes the graphical representation214c, e.g., a smaller version of the previously presented graphical representation214c, indicating that each of the available selections represented by the icons222d-eare related to the selection represented by the icon212cin the first hierarchy level210. Thus, this allows the user to visually ascertain the relationship between the available selections in the second hierarchy level220with a particular one of the selections from the first hierarchy level210.

To further indicate the relationship between each of the icons of the system200, one of more of the icons can be color-coded, such that certain interrelated icons are colored differently than other icons. In some cases, icons can be colored based on their relationship to the uppermost selection in the hierarchical menu. For example, icons212a,222a-c, and232a-ccan be colored a first color (e.g., red); icon212bcan be colored a second color (e.g., blue), and icons212c, and222d-ecan be colored a third color (e.g., green). Thus, by observing the graphical representations contained within the icons as well as the colors of the icons, a user can visually ascertain the relationship between the available selections in the current hierarchy level and those of the hierarchy level above, as well as the relationship between the available selections in the current hierarchy level and those of the uppermost hierarchy level. In some cases, groups of icons can be colored such that icons of one group are exclusive of icons from other groups, such that unique icons and/or colors are used for each group. In some cases, icons can be colored based on other relationships, for example their relationship to a selection other than the uppermost selection in the hierarchical menu (e.g., a selection within a sub-menu at a different higher hierarchical level).

Although three example hierarchy levels210,220, and230are shown inFIG. 2A, this is merely an illustrative example. In practice, the system200can include any number of different hierarchies (e.g., one, two, three, four, five, or more). Further, each of the example icons are shown having a maximum of two graphical representations (i.e., showing information regarding two hierarchy levels), this is also merely an illustrative example. In some cases, icons can include more than two graphical representations (i.e., showing information regarding more than two hierarchy levels). Moreover, in some implementations, each icon can include more than one color indicating more than one level of the hierarchy and/or more than one aspect of the user interface (UI).

FIG. 2Bshows an example of colors250used with the system of interrelated icons ofFIG. 2A. Each icon can be constructed from both the colors250and the graphical representations (e.g., graphical representations214a,214c,224a), where the colors indicate a family of menus and/or functions for one or more industrial printers. For example, a blue color252can be used to indicate interface elements for a job edition, a forest green color254can be used to indicate interface elements for a job in production (or head operations for some printer technologies), another green color256can be used to indicate interface elements for a production run, a light purple/pink color258can be used to indicate interface elements for actions management, a darker purple color260can be used to indicate interface elements for history information, a yellow color262can be used to indicate interface elements for settings of the industrial printer, and an orange color264can be used to indicate interface elements for services.

Other associations between colors and groups of menus and/or functions can also be used in various implementations. In addition, black and white can also be used (e.g., to indicate external services and UI home, respectively). Further, different shapes of the user interface elements (e.g., user selectable buttons on a touch screen display) can be used to indicate different features of the user interface. Moreover, the graphical representations discussed above in connection withFIG. 2Acan span different parts of the user interface.

For example, each user interface element270,272in the user interface can have its own icon (e.g., bitmap or PNG file) constructed from a set of source colors250and graphical representations that can be selected based on the location in the user interface that each respective user interface element270,272will be presented, and a common aspect of the different user interface elements270,272can be represented by the graphical representations, such as graphical representations214a,214c,224a. Thus, a first user interface element270can have color252(e.g., to indicate it is in a “job” portion of the user interface), a small version of the graphical representation214cto indicate a general category of the current user interface location and/or the place from which the user just came in the user interface, and also the graphical representation224ato indicate the general nature of the function of the first user interface element270. Likewise, a second user interface element272can have the same graphical representation224ato indicate the same general function for the second user interface element272, albeit with appropriate differences based on the current context with the user interface, as indicated by the small version of the graphical representation214ato indicate the general category of the current user interface location and/or the place from which the user just came in the user interface, and also the color264to indicate the different overall context (e.g., to indicate the user is in the “services” portion of the user interface).

In some cases, each of the icons of the system can be generated according to standardized conventions, thus providing a common look and feel among the various portions of the user interface, and thereby facilitating quick apprehension of the current UI context. For example,FIG. 3Ashows an example icon300representing a selection of a first hierarchy level of a hierarchical menu. The icon300includes a graphical representation302that visually indicates a particular selection within the hierarchical menu (e.g., a particular sub-menu or command). The graphical representation302can have a particular spatial alignment with respect to the icon300(e.g., centered within the icon300), and can be sized based on the size of the icon300(e.g., having 80% of the size of the icon300along a dimension).

As another example,FIG. 3Bshows an example icon350representing a selection of a second hierarchy level of a hierarchical menu, and where icon350is related to the icon300. The icon350includes a graphical representation352that visually indicates a particular selection within the hierarchical menu (e.g., a particular sub-menu or command). The icon350also includes the graphical representation302that visually indicates the selection in the hierarchy above. The graphical representation352can have a particular spatial alignment with respect to the icon350(e.g., aligned to the upper right of the icon350), and can be sized based on the size of the icon350(e.g., having 50% of the size of the icon350). In the icon350, the graphical representation302can have a different spatial alignment with respect to the icon350than with respect to icon300(e.g., aligned to the bottom left of the icon350). Likewise, in the icon350, the graphical representation302can have a different size with respect to the icon350than with respect to icon300(e.g., having 25% of the size of the icon350).

Although example alignments for graphical representations are described above, these are merely illustrative examples. In some cases, graphical representations can be aligned differently (e.g., having left, right, top, and/or bottom alignment), and can be spaced (e.g., “padded”) from the borders of an icon by a relative amount (e.g., having 5% padding, 10% padding, 15% padding, or any other relative amount of padding) or by an absolute amount (e.g., having 5 pixel padding, 10 pixel padding, 15 pixel padding, or any other absolute about of padding). Likewise, although example sizes for graphical representations are described above, these are also merely illustrative examples. In some cases, graphical representations can be sized differently, and can have either a size relative to the size of the icon (e.g., having a dimension 10%, 20% or 30% of a dimension of an icon, or any other relative size), or an absolute size (e.g., having a dimension of 10 pixels, 20 pixels, 30 pixels, or any other absolute size). Further, although example colors are described above, these are also merely illustrative examples. In some cases, icons can have colors include red, orange, yellow, green, blue, violet, black, brown, gray, any other color, or any combinations thereof. Further still, although example graphical representations are shown above, these are also merely illustrative examples. In some cases, graphical representations can include any other shape, drawing, image, pattern, or combinations thereof.

Another example implementation of a user interface and system of interrelated icons is shown inFIGS. 4A-E. Referring toFIG. 4A, the user interface includes a path bar402, a presentation region404, a taskbar406, and a status bar408.

The status bar408is positioned along the top of the user interface, and displays information regarding the status of the system, for example, the current system time and system date. The path bar402is positioned below the status bar408, and displays an indication of the current hierarchical location of the user interface. For example, referring toFIG. 4A, the path bar402indicates that the current hierarchical location is a sub-menu entitled “Tools.”

The presentation region404is positioned below the path bar402, and presents icons of the system. Each of the icons presented within the presentation region404represent sub-menus or commands that are located within the current hierarchical location of user interface. For example, referring toFIG. 4A, the presentation region404includes three icons410a-c, representing a sub-menus entitled “History,” “Settings,” and “Services,” respectively, within the “Tools” sub-menu. Each of the icons410a-cincludes a graphical representation412a-c, respectively, that illustrates its respective sub-menu. For example, the icon410aincludes a graphical representation412adepicting a clock, the icon410bincludes a graphical representation412bdepicting a set of gears, and the icon410cincludes a graphical representation412cdepicting a wrench.

The taskbar406is positioned along the bottom of the user interface, and displays icons representing additional commands, features, and functions that are available to the user. For example, referring toFIG. 4A, the taskbar406presents a “Back” command to the user that allows the user to navigate backwards (e.g., reverse a selection) within the user interface. In some cases, the taskbar406can represent commands, features, and functions differently in order to better differentiate between them. As an example, in some cases, commands such as navigation commands can be represented by a circular icon, while functions related to creating new data items, editing existing data items, and viewing existing data items (e.g., “new,” “edit,” and “view” functions) can be represented by square icons (e.g., with rounded corners). In practice, other distinguishing characteristics (e.g., colors, shapes, and sizes) also can be used, depending on the implementation.

When the user selects one of the icons410a-c, the user interface updates to reflect the selection. For example, referring toFIG. 4B, when the user selects the icon410b(representing the “Settings” sub-menu), the path bar402updates to reflect the selection (e.g., by replacing “Tools” with “Settings” and displaying the graphical representation412b, a set of gears). The representation region404also updates to reflect the available selections within the “Settings” sub-menu. For example, referring toFIG. 4B, the presentation region404updates to include three icons420a-c, representing a sub-menus entitled “Job,” “Printer,” and “Line,” respectively, within the “Settings” sub-menu. Each of the icons420a-cincludes a graphical representation422a-c, respectively, that illustrates its respective sub-menu. For example, the icon420aincludes a graphical representation422adepicting a sheet of paper, the icon420bincludes a graphical representation422bdepicting a printer, and the icon420cincludes a graphical representation422cdepicting a line of production. Each of the icons420a-calso includes the graphical representation412bthat illustrates its selection made in the hierarchy level above. For example, the icon420aincludes the graphical representation412bdepicting the set of gears, which reflects that the sub-menu presented by user interface is within the “Settings” sub-menu.

Similarly, when the user selects one of the icons420a-c, the user interface updates to reflect the selection. For example, referring toFIG. 4C, when the user selects the icon420a(representing the “Job” sub-menu), the path bar402updates to reflect the selection (e.g., by updating the hierarchical location of the user interface to include the “Jobs” sub-menu). The representation region404also updates to reflect the available selections within the “Jobs” sub-menu. For example, referring toFIG. 4C, the presentation region404updates to include three icons430a-d, representing a sub-menus entitled “Shift Code,” “Date/Time,” “Identifier,” and “Default,” respectively, within the “Jobs” sub-menu. In a similar manner as above, each of the icons430a-dincludes a graphical representation432a-d, respectively, that illustrates its respective sub-menu. For example, the icon430aincludes a graphical representation432adepicting a pair of people, the icon430bincludes a graphical representation432bdepicting a clock and calendar, the icon430cincludes a graphical representation432cdepicting a tag, and the icon430dincludes a graphical representation432ddepicting a circular set of arrows. Each of the icons430a-calso includes the graphical representation422bthat illustrates its selection made in the hierarchy level above. For example, the icon430aincludes the graphical representation422bdepicting the sheet of paper, which reflects that the sub-menu presented by user interface is within the “Jobs” sub-menu.

Similarly, when the user selects one of the icons430a-d, the user interface updates to reflect the selection. For example, referring toFIG. 4D, when the user selects the icon430b(representing the “Date/Time” sub-menu), the path bar402updates to reflect the selection (e.g., by updating the hierarchical location of the user interface to include the “Date/Time” sub-menu). The representation region404also updates to reflect the available selections within the “Jobs” sub-menu. For example, referring toFIG. 4D, the presentation region404updates to include three icons440a-c, representing commands entitled “Date Rollover,” “Custom Date/Time,” and “Calendar,” respectively, within the “Date/Time” sub-menu. In a similar manner as above, each of the icons440a-cincludes a graphical representation442a-d, respectively, that illustrates its respective sub-menu. Each of the icons440a-calso includes the graphical representation432bthat illustrates its selection made in the hierarchy level above. For example, the icon440aincludes the graphical representation432bdepicting the clock and calendar, which reflects that the sub-menu presented by user interface is within the “Date/Time” sub-menu.

When the user selects one of the icons440a-c, the user interface again updates to reflect the selection. For example, referring toFIG. 4E, when the user selects the icon440c(representing the “Calendar” command), the path bar402updates to reflect the selection (e.g., by updating the hierarchical location of the user interface to include the “Calendar” command). The representation region404also updates to reflect display the result of the executed command (e.g., input and/or output when a “Calendar” application module is executed). The taskbar406also updates to reflect commands that are available as a result of the execute command (e.g., commands that are available to the user within the “Calendar” application module”).

Thus, a user can observe the graphical representations contained within each of the icons presented in the user interface in order to discern between the currently available selections, and identify the hierarchy level immediate above the current hierarchy level.

As discussed above, each of the icons presented by the user interface can be color coded. For example, icon410acan be colored a first color (e.g., purple); icon410bcan be colored a second color (e.g., yellow); and icon410ccan be colored a third color (e.g., orange). As each of the icons are420a-c,430a-d, and440a-care related to and located hierarchically below the icon410a, each of these icons can be colored similarly as icon410a(e.g., yellow). Thus, a user can observe the color of the icons presented in the user interface in order to identify the icons' relationships to the uppermost selection in the hierarchical menu.

AlthoughFIGS. 4A-Eshow an example implementation of a user interface and the system of interrelated icons, in practice, other implementations are also possible. For example, in some implementations, the user interface does not include a text label for one or more of the icons (e.g., one or more sub-menus or commands can be represented only by an icon). As another example, in some implementations, one of more of the elements of the user interface (e.g., the path bar402, presentation region404, taskbar406, and/or status bar408) can have a different size, appearance, or arrangement, or can be excluded from the user interface. Likewise, although example icons, colors, sub-menus, and commands are described and illustrated above, these are also merely illustrative examples. In practice, other icons, colors, sub-menus, and/or commands are possible, depending on the implementation.

Further, although example implementations are described in the context of industrial printer systems, embodiments of the subject matter can be implemented in connection with other devices. For example, in some cases, a system of interrelated icons can be implemented for consumer printer systems (e.g., personal laser printers and inkjet printers), desktop computer systems, server computer systems, smartphones, watches, personal data assistants (PDAs), mobile electronic devices, calculators, televisions, appliances (e.g., refrigerators, microwaves, ovens, dishwashers, coffee makers, washing machines, dryers, and toasters), thermostats, vehicle control systems (e.g., in-dash entertainment and navigation units), electrical tools, industrial machines, or any other devices where a user might interact with the device through a user interface.

In some cases, a similar system of interrelated icons can be used across multiple different devices (e.g., multiple different industrial printer systems, consumer printer systems, computer systems, appliances, or other devices), such that a similar navigation system is presented to users across each of these devices, even if the devices do not share a common specification. As an example, in some cases, a similar or the same system of interrelated icons can be used across multiple different devices, where at least some of the devices are of a different make, model, or type, or have a different feature set than other devices. Despite these differences in the devices, the user can be presented with a similar or the same system of interrelated icons, such that he has a similar or same user experience across each of the devices.

In some cases, one of more icons can be displayed differently, depending on whether the sub-menu or command that it represents is available to the user for selection. For example, in some cases, icons representing inactive sub-menus or commands can be colored differently (e.g., gray) compared to those that are representing active sub-menus or commands (e.g., colored). Further, in some cases, one or more icons can be presented differently when the icon is selected, in order to provide visual feedback to the user that the desired icon has been selected. In some cases, the icon can be moved by a particular number of pixels (e.g., one, two, three, or more pixels) in one or more directions (e.g., up or down, and/or left or right), colored differently (e.g., having a particular background color) or presented having other visual features (e.g., having a particular border) when selected.

Embodiments of the subject matter and the functional operations described in this specification can be implemented in digital electronic circuitry, or in computer software, firmware, or hardware, including the structures disclosed in this specification and their structural equivalents, or in combinations of one or more of them. Embodiments of the subject matter described in this specification can be implemented using one or more modules of computer program instructions encoded on a computer-readable medium for execution by, or to control the operation of, data processing apparatus. The computer-readable medium can be a manufactured product, such as hard drive in a computer system or an optical disc sold through retail channels, or an embedded system. The computer-readable medium can be acquired separately and later encoded with the one or more modules of computer program instructions, such as by delivery of the one or more modules of computer program instructions over a wired or wireless network. The computer-readable medium can be a machine-readable storage device, a machine-readable storage substrate, a memory device, or a combination of one or more of them.

The computing system can include clients and servers. A client and server are generally remote from each other and typically interact through a communication network. The relationship of client and server arises by virtue of computer programs running on the respective computers and having a client-server relationship to each other. Embodiments of the subject matter described in this specification can be implemented in a computing system that includes a back-end component, e.g., as a data server, or that includes a middleware component, e.g., an application server, or that includes a front-end component, e.g., a client computer having a graphical user interface or a Web browser through which a user can interact with an implementation of the subject matter described is this specification, or any combination of one or more such back-end, middleware, or front-end components. The components of the system can be interconnected by any form or medium of digital data communication, e.g., a communication network. Examples of communication networks include a local area network (“LAN”) and a wide area network (“WAN”), an inter-network (e.g., the Internet), and peer-to-peer networks (e.g., ad hoc peer-to-peer networks).