WO2016045546A1

WO2016045546A1 - Information display method and device

Info

Publication number: WO2016045546A1
Application number: PCT/CN2015/089954
Authority: WO
Inventors: 诸琳
Original assignee: 阿里巴巴集团控股有限公司; 诸琳
Priority date: 2014-09-28
Filing date: 2015-09-18
Publication date: 2016-03-31
Also published as: CN105528167A; CN105528167B

Abstract

An information display method and device, the method comprising: icons respectively corresponding to each type of preset information are displayed in a first area within a screen interface of a terminal (102); according to a currently triggered icon, an information box corresponding to the icon is generated in the first area (104); data of preset information corresponding to the currently triggered icon is displayed within the information box, and changes to the data within a preset time period are displayed in a second area within the screen interface (106). Via the present technical solution, switching and displaying may be performed on a plurality of types of information within a same screen interface, helping to improve the readability of interface content.

Description

Information display method and device

Technical field

The present application relates to the field of terminal technologies, and in particular, to an information display method and apparatus.

Background technique

Users often need to display multiple types of data in the screen interface of the terminal, which facilitates data analysis. However, if all the data is directly tiled on the screen interface, it is not conducive to determine the correlation between the data; at the same time, especially for the limited size of the screen interface of the mobile device, the tile display of all the data will The display font of the data is forced to shrink, which is obviously not conducive to the user's viewing and operation, and may even cause the user to interrupt the analysis of the user in the process of continuously scaling and controlling the display content, thereby seriously affecting the efficiency of data analysis.

Summary of the invention

In view of this, the present application provides a new technical solution for optimizing information display of multiple types of information in the same screen interface.

To achieve the above objective, the present application provides the following technical solutions:

According to a first aspect of the present application, an information display method is provided, including:

Displaying, in the first area of the screen interface of the terminal, an icon corresponding to each type of preset information;

Generating an information frame corresponding to the icon in the first area according to the currently triggered icon;

Displaying data of the preset information corresponding to the currently triggered icon in the information box, and displaying the change of the data in the preset time period in the second area in the screen interface.

According to a second aspect of the present application, an information display apparatus is provided, comprising:

An icon display unit that displays an icon corresponding to each type of preset information in a first area in the screen interface of the terminal;

The information frame generating unit generates an information frame corresponding to the icon in the first area according to the currently triggered icon;

a data display unit, displaying data of preset information corresponding to the currently triggered icon in the information box, and displaying a change of the data in a preset time period in the screen interface Within the two regions.

As can be seen from the above technical solutions, the present application enables the user to clearly view the association relationship between the currently highlighted information by switching the multiple types of information in a rotating manner, and does not depend on the screen size limitation. Affect the display effect of information, which helps to improve the efficiency of data analysis for users.

DRAWINGS

FIG. 1 shows a flowchart of an information display method according to an exemplary embodiment of the present application;

FIG. 2 illustrates a data interaction flowchart of updating display information according to an exemplary embodiment of the present application; FIG.

3-5 illustrate interface diagrams of contact information according to an exemplary embodiment of the present application;

FIG. 6 illustrates an interface diagram of real-time data according to an exemplary embodiment of the present application; FIG.

FIG. 7 is a schematic structural diagram of a terminal according to an exemplary embodiment of the present application;

FIG. 8 shows a block diagram of an information display device according to an exemplary embodiment of the present application.

detailed description

In order to further illustrate this application, the following examples are provided:

Please refer to FIG. 1. FIG. 1 illustrates an information display method applied to a terminal according to an exemplary embodiment of the present application. The method may include the following steps:

Step 102: Display, in a first area of the screen interface of the terminal, an icon corresponding to each type of preset information.

In this embodiment, the first area may be any area preset on the screen interface, such as the upper part of the screen interface; by dividing the first area and the second area described below, different information is displayed in the corresponding area. It helps to distinguish between different information and makes rational use of the screen interface of limited size. For example, in an exemplary embodiment, real-time data may be displayed in a first area and changes in real-time data may be displayed in a second area.

In this embodiment, replacing the specific type of data with icons helps to reduce the occupation of the screen interface and realize simultaneous display of more types of preset information.

Step 104: Generate an information frame corresponding to the icon in the first area according to the currently triggered icon;

In this embodiment, the currently triggered icon may be a default icon, that is, the icon is triggered by default when the user opens the current screen interface; or the user may manually trigger any icon according to his own needs, and the user's Triggering means that you are interested in the preset information corresponding to the icon, and you want to know the corresponding data.

The real-time data of the preset information corresponding to the icon has a special display area, and the preset information is displayed only in the special display area at a time by generating a dedicated information box for the currently triggered icon. Real-time data does not cause the display font to be reduced and inconvenient to view due to the large number of preset information types and the crowded display contents.

In this embodiment, the correspondence between the icon and the information box can be embodied by way of partial overlap, close proximity, and the like.

Step 106: Display data of preset information corresponding to the currently triggered icon in the information box, and display a change of the data in a preset time period in a second in the screen interface. within the area.

In this embodiment, by generating an information frame, the data of the preset information corresponding to the currently triggered icon can be effectively distinguished from the first area and other display contents in the terminal screen, and the user can conveniently implement the information in the information box. The attention and view of the data.

In this embodiment, the real-time data displayed in the second area is associated with the currently triggered icon, so that the change of the real-time data in the information frame and the second area in the first area can be established. Correspondence between the two, there is no problem that the data caused by tiling multiple types of information is confusing and difficult to establish association.

According to the foregoing embodiment, the present application generates a specific display area for the real-time data of the preset information corresponding to the icon, and also displays the display content and the screen in the information box. The other display content in the interface is differentiated for easy viewing by the user. Meanwhile, the present application displays the change of the real-time data in the information box in the second area, thereby establishing an association relationship between the currently triggered icon, the information frame, and the second area, without being due to the type of the preset data. More problems that lead to confusing information and difficult to view.

The technical solution of the present application is applicable to a situation in which multiple types of information and corresponding data need to be simultaneously displayed; as an exemplary embodiment, for example, related information and data of multiple types of contacts may be performed in a social application. Display, or display the amount of communication data of different groups of contacts in an instant messaging application.

Meanwhile, in the embodiment of the present application, when the icon in the screen interface is triggered, according to the preset information corresponding to the triggered icon, any data of the preset information may be displayed in the corresponding information frame. Wherein, "arbitrary data" may refer to data at any time, such as data at a certain historical time point; or, the terminal may interact with the server according to a preset period, and store the obtained data, so that when the corresponding icon is triggered Displaying the recently acquired and stored data in the information box; or displaying the real-time data of the preset information corresponding to the currently triggered icon in the corresponding information box, so as to satisfy the user's real-time and effective data. Sexual needs.

Therefore, when the data displayed in the information box is real-time data, it is actually required to obtain real-time data of the preset information corresponding to the currently triggered icon through data interaction between the terminal and the server after the corresponding icon is triggered. . Please refer to FIG. 2. FIG. 2 illustrates a data interaction process of updating display information according to an exemplary embodiment of the present application, including:

Step 202: The terminal opens a display interface based on the technical solution of the present application by detecting a user's click operation on the application icon on the screen interface, an interface switching operation inside the application, or a function call of the current application to the application.

Step 204: The terminal confirms that the icon that is triggered by default is the first icon in the display interface.

Step 206: In the display interface, the terminal generates a first information frame corresponding to the first icon.

In this embodiment, the technical solution based on the information display of the present application is described in detail by taking the above-mentioned “related information and data of multiple types of contacts in a social application” as an example. Please refer to FIG. 3 , for example, in the current social application, including three types of contacts: “family”, “friend” and “colleague”, and if the icon corresponding to “family” is the first icon triggered by default, then When the user enters the "online number" analysis interface in the social application, it will automatically appear as the interface shown in FIG.

In FIG. 3, the circular area with the largest area partially overlapping with the "family" icon is the first information frame, and the "friend" icon and the "colleague" icon occupy only a small display area, so that the triggered A message box and its display content are more prominent, which is convenient for users to view. Wherein, when the first information frame is circular, the terminal can also make the first information frame appear as a “bubble” form by setting the color gradation, brightness change, transparency control, etc., thereby improving the user experience in the display effect. . Certainly, the present application does not limit the specific shape of the first information frame, and any other shapes such as a rectangle or a triangle may be applied to the setting of the first information frame; at the same time, the color, brightness, transparency, etc. of the first information frame. The attributes are displayed, and this application does not limit them, and can be set according to actual needs.

Step 208: When the first icon corresponds to the preset first information, the terminal requests the server to update data corresponding to the first information.

In this embodiment, data update is performed only on the triggered icon, so that the amount of data interaction between the terminal and the server is minimized, thereby helping to reduce data traffic, and in particular, the waste of data traffic can be avoided in the mobile network state. Improve data update efficiency. Certainly, as another exemplary embodiment, it is obvious that an update request may be performed on data corresponding to all the icons, thereby helping to improve the feedback speed of the display interface when the user switches triggers between the multiple icons.

Step 210: The server returns update data to the terminal.

In this embodiment, when the terminal only requests the server for the update data corresponding to the first icon, the first icon is the “family” icon shown in FIG. 3, and the updated data returned by the server is the “family” group. The number of online people corresponding to the contacts within the data.

Step 212: Display the updated data returned by the server in the display interface.

In this embodiment, the display of the update data may be divided into two parts, and the update data corresponding to the “family” group shown in FIG. 3 is taken as an example, and may include:

The first aspect: update the number of online users in the first message box

FIG. 3 is a schematic diagram showing the update data corresponding to the “family” group, that is, in the circular area of the first information frame, the “family online number: 8 persons” is displayed. Meanwhile, the “friend” icon and the “colleague” icon may be displayed in the display interface, and as an exemplary embodiment, the number of “friends” group and the number of “colleagues” group may be associated with the corresponding icon. , for example, displayed next to the icon. As an exemplary embodiment, if only the update data of the first information, that is, the update data corresponding to the “family” group, is requested in step 208, the number of “friends” in FIG. 3 and the “colleague” group are The number of people may be historical data (ie, "friend 62 people" and "colleague 15 people" in FIG. 3 as historical data), and data update is performed when the user triggers the corresponding icon; as another exemplary embodiment, if the steps are If the update data of all the information is requested in 208, the number of "family" group, "friend" group and "colleague" group can be updated (that is, "family online number: 8 people" in Fig. 3 "62 friends" and "15 colleagues" are updated data).

Of course, in addition to displaying the data corresponding to each icon in the interface in FIG. 3, the number of "friend" group and "colleague" group may not be displayed, but only the "family" group is displayed. The number of people, so that when the "Friends" icon or the "Colleagues" icon is triggered, the number of people in the corresponding "Friends" group or "Colleagues" group is displayed in the corresponding information box.

The second aspect: update the "history at the same time engraved online number" in the display interface

The display interface shown in FIG. 3 can be divided into two parts, the upper part is the “first area” and the lower part is the “second area”, and the real-time online number corresponding to the “family” group is displayed in the first area. At the same time, it is also possible to display the "history and number of online people" corresponding to the "family" group in the second area. For example, in Figure 3, while the number of real-time online users corresponding to the “family” group is 8, the number of online people in the “family” group at the same time in the first five days is displayed in the second area, for example. The number of online people at the same time of "Yesterday" is 10 people, and the online person at the same time of "the day before yesterday" The number is 16 and so on.

Therefore, by comparing the data between the first information frame and the data in the second area, the user is helped to achieve more explicit data comparison and analysis.

Step 214: The terminal detects a trigger operation of the second icon by the user.

In this embodiment, it is assumed that in the display interface shown in FIG. 3, the “friend” icon is the second icon, and when the user detects that the user clicks on the “friend” icon, the user may be determined to “friend”. The icon performs a trigger action.

Step 216, generating a second information box corresponding to the second icon;

In this embodiment, as shown in FIG. 4, the circular area with the largest area overlapping with the "friend" icon is the first information frame, and the "family" icon and the "colleague" icon occupy only a small display area. , the triggered second information frame and its display content are more prominent, which is convenient for the user to view. At the same time, the first information frame shown in FIG. 3 is hidden, thereby avoiding "contention" of the display area with the second information frame.

Step 218, when the second icon corresponds to the preset second information, the terminal requests update data corresponding to the second information to the server;

Step 220: The server returns update data to the terminal.

Step 222: Display the updated data returned by the server in the display interface.

In this embodiment, as shown in FIG. 4, the terminal displays "the number of friends online: 62 people" in the update data in the second information box, and displays the "friends" group in the first five in the second area. The number of online people at the same time of the day, for example, the number of online users at the same time of "yesterday" is 53, and the number of online users at the same time of "the day before yesterday" is 84.

Similarly, when the user selects to click the "colleague" icon, the display interface switches to the situation shown in FIG. 5, that is, the terminal displays "the number of colleagues online: 15 people" in the update data in the third information box (assuming "colleagues" The icon is the third icon, and the third icon corresponds to the third information box), and the number of online people of the "colleagues" group at the same time in the first five days is displayed in the second area, such as "yesterday" at the same time. The number of online users is 14 and the number of online users at the same time of "the day before yesterday" is 17.

The technical solutions of the present application are described in detail with reference to the related information and data of multiple types of contacts in a social application. For example, those skilled in the art should understand that the present application is to be understood. The technical solution obviously can also be applied to other aspects. For example, FIG. 6 shows a schematic diagram of applying the technical solution of the present application to the “Taobao” mobile client, and the “payment amount”, “payment product quantity” and “payment” A variety of real-time data such as the number of buyers are displayed.

Specifically, for example, when the "payment amount" is triggered, a circular information box as shown in FIG. 6(a) is generated, and "payment amount 4, 567, 890" and "yesterday accumulation 11, 234, 567, 890" are displayed therein, that is, it can be displayed in the information box. The real-time data of the corresponding preset information (such as "payment amount" here) can also display corresponding historical accumulated data; wherein the information box is displayed in the first area of the screen interface (such as the interface shown in Figure 6 (a) The upper part can also display "payment product number 1,234,567", "payment buyer number 12,345,678" and corresponding icons in the first area. In addition, the change of the real-time data corresponding to the “payment amount” may also be displayed in the second area of the screen interface (different from the first area, such as the lower half of the interface shown in FIG. 6( a )), for example, the payment amount is The trend curve of “every day” can be changed at any time; at the same time, the trend curve of the payment amount at the time of the historical time, such as the trend curve of “yesterday”, can be used in the second area to facilitate comparative analysis of the data.

Similarly, when the "number of payment products" is triggered, a circular information box as shown in FIG. 6(b) is generated in the first area of the screen interface, and "the number of payment products 1,234,567" and "total yesterday 45,678,910" are displayed therein. That is, the real-time data of the corresponding preset information (such as "the number of payment products" here) can be displayed in the information box, and the corresponding historical accumulated data can also be displayed; wherein, in the first area, the "payment amount 4,567,890" can also be displayed. , "Pay the number of buyers 12,345,678" and the corresponding icon. In addition, the change of the real-time data corresponding to the “number of payment products” can be displayed in the second area of the screen interface, for example, the trend curve of the number of payment products in the “Today” at any time; and at the same time, in the second area. The trend curve of the number of payment products in the historical time at any time, such as the trend curve of "yesterday", to facilitate the comparative analysis of the data.

Similarly, when the "Payment Buyers" is triggered, Figure 6 is generated in the first area of the screen interface. (c) The circular information box shown, and displays "Payment Buyers 12,345,678" and "Yesterday Accumulation 345, 678,910", that is, the corresponding preset information can be displayed in the information box (such as "Payment Buyers" here. ") real-time data, can also display the corresponding historical accumulated data; wherein, the first area can also display "payment amount 4,567,890", "payment product number 1,234,567" and the corresponding icon. In addition, it is also possible to display the change of the real-time data corresponding to the “number of paying buyers” in the second area of the screen interface, for example, the trend curve of the number of paying buyers in the “today” at any time; and at the same time, In the second region, the trend curve of the number of paying buyers at any time in the historical time, such as the trend curve of “yesterday”, facilitates the comparative analysis of the data.

In addition, in order to effectively distinguish the currently triggered icon, the associated display attribute may be pre-configured for each icon, and the preset display attribute is applied by acquiring the preset display attribute associated with the currently triggered icon. Preset display elements in the on-screen interface. Specifically, the preset display element may be any object in the screen interface, such as a background color in the first area, and the like, and an information type name, a change trend curve, and the like in the second area, so that the screen interface presents different The overall display effect (such as what can be called "theme"). Take Figure 6 as an example: when the “payment amount” icon is triggered, the background color in the first area, the “payment amount” text in the second area, and the trend curve of “today” can be uniformly presented as “blue”. "Color"; when the "Payment Product Piece" icon is triggered, the background color in the first area, the "payment amount" text in the second area, and the "change trend curve" of "Today" may be uniformly presented as "red"; When the “Payment Buyers” icon is triggered, the background color in the first area, the “payment amount” text in the second area, and the trend curve of “Today” can be uniformly presented as “yellow”, so that Through the overall color change, the contrast effect when the triggered icon changes is enhanced, so that the user can obviously feel that the triggered icon and the information in the screen interface are changed based on their own operations, which helps to avoid misoperation. Occurs and ensures a better user experience.

Of course, the color change is only an exemplary embodiment of the present application, and those skilled in the art should understand that it is obvious that the overall visual change can be presented by other means or a combination of multiple ways, such as using color, brightness, and shape. (For example, changing the shape of the information box, for example, "payment amount" corresponds to a circular information box, "number of payment products" corresponds to a square information box, "paying buyers" Corresponding to at least one of attributes such as a triangle information box, etc.).

At the same time, in order to enhance the information contrast in the first area, the highlighted state of the icon is emphasized, and the information other than the currently triggered icon, the information frame, and the information displayed in the information frame may be weakly displayed in the first area. . For example, in Figure 6, the frame of the three images and the border of the icon being triggered are bolded and blackened, and the text in the message frame is also larger; the untriggered icon and corresponding text , the display is relatively weak, that is, the color is lighter, the line is narrower, and the font size is smaller. It should be understood that the "weakened display" proposed in the present application can be understood to include: an enhanced display of "currently triggered icons, information boxes, and information displayed in the information box", and/or for The weakening of the information is displayed.

FIG. 7 shows a schematic structural diagram of a terminal according to an exemplary embodiment of the present application. Referring to FIG. 7, at the hardware level, the terminal includes a processor, an internal bus, a network interface, a memory, and a non-volatile memory, and may of course include hardware required for other services. The processor reads the corresponding computer program from the non-volatile memory into the memory and then runs to form an information display device on a logical level. Of course, in addition to the software implementation, the present application does not exclude other implementation manners, such as a logic device or a combination of software and hardware, etc., that is, the execution body of the following processing flow is not limited to each logical unit, and may be Hardware or logic device.

Referring to FIG. 8, in the software implementation, the information display device may include an icon display unit, an information frame generating unit, and a data display unit. among them:

Optionally, it also includes:

The display unit is associated, and each icon is associated with the preset information corresponding to the icon.

Optionally, it also includes:

An attribute obtaining unit that acquires a preset display attribute associated with the currently triggered icon;

The attribute application unit applies the preset display attribute to a preset display element in the screen interface.

Optionally, the preset display attribute includes at least one of the following: color, brightness, and shape.

Optionally, it also includes:

The display unit is weakened and displayed in the first area except for the currently triggered icon, the information box, and information displayed in the information box.

Optionally, the data is real-time data of preset information corresponding to the currently triggered icon.

The application also proposes a mobile device, comprising:

Touch display

Processor;

a memory configured to store a statistical data display program, wherein the statistical data display program is displayed by the processor, displaying a statistical data interface on the touch display, the statistical data interface including a first region and a second a region, the first region including at least a first bubble icon and a second bubble icon;

The first bubble icon is displayed in a magnified manner after the first operation applied by the user, and the real-time information of the first category of data associated with the first bubble icon is displayed in the enlarged first bubble icon, And displaying, in the second area, a change of data of the first category associated with the first bubble icon within a predetermined time;

The second bubble icon is enlarged and displayed in response to the second operation applied by the user, and the enlarged first bubble icon is displayed in a reduced size, and displayed in the enlarged second bubble icon and the second bubble. The real-time information of the second category of data associated with the icon displays, in the second region, a change in data of the second category associated with the second bubble icon within a predetermined time.

Therefore, the present application enables a user to clearly view the relationship between the currently highlighted information by performing a toggle-like highlighting of various types of information, and is not due to The limitation of the screen size affects the display effect of the information, which helps to improve the efficiency of data analysis of the user.

In a typical configuration, a computing device includes one or more processors (CPUs), input/output interfaces, network interfaces, and memory.

The memory may include non-persistent memory, random access memory (RAM), and/or non-volatile memory in a computer readable medium, such as read only memory (ROM) or flash memory. Memory is an example of a computer readable medium.

Computer readable media includes both permanent and non-persistent, removable and non-removable media. Information storage can be implemented by any method or technology. The information can be computer readable instructions, data structures, modules of programs, or other data. Examples of computer storage media include, but are not limited to, phase change memory (PRAM), static random access memory (SRAM), dynamic random access memory (DRAM), other types of random access memory (RAM), read only memory. (ROM), electrically erasable programmable read only memory (EEPROM), flash memory or other memory technology, compact disk read only memory (CD-ROM), digital versatile disk (DVD) or other optical storage, Magnetic tape cartridges, magnetic tape storage or other magnetic storage devices or any other non-transportable media can be used to store information that can be accessed by a computing device. As defined herein, computer readable media does not include temporary storage of computer readable media, such as modulated data signals and carrier waves.

It is also to be understood that the terms "comprises" or "comprising" or "comprising" or any other variations are intended to encompass a non-exclusive inclusion, such that a process, method, article, Other elements not explicitly listed, or elements that are inherent to such a process, method, commodity, or equipment. An element defined by the phrase "comprising a ..." does not exclude the presence of additional equivalent elements in the process, method, item, or device including the element.

The above is only the preferred embodiment of the present application, and is not intended to limit the present application. Any modifications, equivalent substitutions, improvements, etc., which are made within the spirit and principles of the present application, should be included in the present application. Within the scope of protection.

Claims

An information display method, comprising:

Displaying, in the first area of the screen interface of the terminal, an icon corresponding to each type of preset information;

Generating an information frame corresponding to the icon in the first area according to the currently triggered icon;

Displaying data of the preset information corresponding to the currently triggered icon in the information box, and displaying the change of the data in the preset time period in the second area in the screen interface.
The method of claim 1 further comprising:

Each icon is associated with the preset information corresponding to the icon.
The method of claim 1 further comprising:

Obtaining a preset display attribute associated with the currently triggered icon;

The preset display attribute is applied to a preset display element in the screen interface.
The method according to claim 3, wherein the preset display attribute comprises at least one of the following: color, brightness, shape.
The method of claim 1 further comprising:

The information in the first area except the currently triggered icon, the information box, and the information displayed in the information box is weakened and displayed.
The method according to claim 1, wherein the data is real-time data of preset information corresponding to the currently triggered icon.
An information display device, comprising:

An icon display unit that displays an icon corresponding to each type of preset information in a first area in the screen interface of the terminal;

The information frame generating unit generates an information frame corresponding to the icon in the first area according to the currently triggered icon;

a data display unit, displaying data of preset information corresponding to the currently triggered icon in the information box, and displaying a change of the data in a preset time period in the screen interface Within the two regions.
The device according to claim 7, further comprising:

The display unit is associated, and each icon is associated with the preset information corresponding to the icon.
The device according to claim 7, further comprising:

An attribute obtaining unit that acquires a preset display attribute associated with the currently triggered icon;

The attribute application unit applies the preset display attribute to a preset display element in the screen interface.
The device according to claim 9, wherein the preset display attribute comprises at least one of the following: color, brightness, shape.
The device according to claim 7, further comprising:

The display unit is weakened and displayed in the first area except for the currently triggered icon, the information box, and information displayed in the information box.
The device according to claim 7, wherein the data is real-time data of preset information corresponding to the currently triggered icon.
A mobile device, characterized in that the mobile device comprises:

Touch display

Processor;

a memory configured to store a statistical data display program, wherein the statistical data display program is displayed by the processor, displaying a statistical data interface on the touch display, the statistical data interface including a first region and a second a region, the first region including at least a first bubble icon and a second bubble icon;

The first bubble icon is displayed in a magnified manner after the first operation applied by the user, and the real-time information of the first category of data associated with the first bubble icon is displayed in the enlarged first bubble icon, And displaying, in the second area, a change of data of the first category associated with the first bubble icon within a predetermined time;

The second bubble icon is enlarged and displayed in response to the second operation applied by the user, and the enlarged first bubble icon is displayed in a reduced size, and displayed in the enlarged second bubble icon and the second bubble. The real-time information of the second category of data associated with the icon displays, in the second region, a change in data of the second category associated with the second bubble icon within a predetermined time.