CN116400922A

CN116400922A - Interface guide schematic diagram generation method, device, computer equipment and storage medium

Info

Publication number: CN116400922A
Application number: CN202310401819.8A
Authority: CN
Inventors: 张和正; 郑敏嘉; 黄景峰; 卢银福; 杨春贵; 黄敏; 陈酿; 李骏; 郑行良; 吴秀妹; 周平
Original assignee: Industrial Bank Co Ltd; CIB Fintech Services Shanghai Co Ltd
Current assignee: Industrial Bank Co Ltd; CIB Fintech Services Shanghai Co Ltd
Priority date: 2023-04-14
Filing date: 2023-04-14
Publication date: 2023-07-07

Abstract

The application relates to an interface guide schematic diagram generating method, an interface guide schematic diagram generating device, computer equipment and a storage medium. The method comprises the following steps: acquiring personalized guide data corresponding to a currently bound user; packaging the personalized guide data to obtain packaged guide data, and sending the packaged guide data to an H5 application end through a plug-in module, so that the H5 application end renders page elements in an H5 page according to the packaged guide data to obtain an H5 guide page; rendering is carried out on interface elements in a native interface of the client according to the personalized guiding data, so that a native guiding interface is obtained; acquiring the H5 guide page sent by the H5 application end through the plug-in module; and generating an interface guide schematic diagram according to the native guide interface and the H5 guide page. By adopting the method, the path guidance of the user can be realized.

Description

Interface guide schematic diagram generation method, device, computer equipment and storage medium

Technical Field

The present invention relates to the field of mobile application technologies, and in particular, to an interface guidance schematic generating method, an apparatus, a computer device, and a storage medium.

Background

With the development of mobile application technology, various mobile APP's appear, and when a new function appears in the mobile APP or there is an important event to remind, the user needs to be guided to perform related operations, so that the user triggers a specific target function or enters a specific page according to guidance.

Mobile APP systems are commonly developed by tens of development teams together to complete the development of functions, so there are numerous business function modules in APP. It is difficult for the user to find the full functionality of the APP by simple page browsing. At this time, a guide function with a high degree of customization needs to be set to guide the user to understand. However, since APP is completed by different development teams, there are problems of inconsistent data structures and difficult data integration among the development teams, so that development of the guiding function with higher customization degree cannot be realized.

Disclosure of Invention

In view of the foregoing, it is desirable to provide an interface guidance schematic generating method, apparatus, computer device, and storage medium that can be used by a guidance user.

In a first aspect, the present application provides an interface guidance schematic generating method, which is applied to a client.

The method comprises the following steps:

acquiring personalized guide data corresponding to a currently bound user;

packaging the personalized guide data to obtain packaged guide data, and sending the packaged guide data to an H5 application end through a plug-in module, so that the H5 application end renders page elements in an H5 page according to the packaged guide data to obtain an H5 guide page;

rendering is carried out on interface elements in a native interface of the client according to the personalized guiding data, so that a native guiding interface is obtained;

acquiring the H5 guide page sent by the H5 application end through the plug-in module;

and generating an interface guide schematic diagram according to the native guide interface and the H5 guide page.

In one embodiment, the method further comprises:

determining whether the user completes a booting operation;

generating native change data in response to an operation triggered on an interface element in the native guide interface;

if the user completes the guiding operation, re-rendering the corresponding interface element in the original guiding interface according to the original change data to obtain a re-rendered original guiding interface;

And updating the interface guide schematic diagram according to the re-rendered native guide interface.

In one embodiment, the method further comprises:

the method comprises the steps that a re-rendered H5 guide page sent by an H5 application terminal is obtained through the plug-in module; the re-rendered H5 guide page is obtained by re-rendering corresponding page elements in the H5 guide page after the H5 application end completes the guide operation by the user;

and updating the interface guide schematic diagram according to the re-rendered H5 guide page.

In one embodiment, the method further comprises:

acquiring guide update data, wherein the guide update data is generated according to service requirements;

classifying the guide update data to obtain original update data and H5 update data;

updating and rendering the interface elements in the original guiding interface according to the original updating data to obtain an updated and rendered original guiding interface;

the H5 updating data is sent to the H5 application end through the plug-in module, so that the H5 application end carries out updating rendering on page elements in the H5 guide page according to the H5 updating data to obtain an updated and rendered H5 guide page;

Acquiring an updated rendered H5 guide page sent by the H5 application terminal;

and determining an updated and rendered interface guide schematic diagram according to the updated and rendered native guide interface and the updated and rendered H5 guide page.

In one embodiment, the obtaining the personalized guiding data corresponding to the configured user includes:

sending a data request to a server according to user information corresponding to a currently bound user, so that the server queries from an Hbase database according to the user information carried in the data request to obtain the personalized guide data;

and receiving the personalized guide data sent by the server.

In a second aspect, the present application further provides an interface guiding schematic generating method, which is applied to an H5 application end, where the method includes:

receiving encapsulation guide data sent by a plug-in module; the encapsulation guiding data are encapsulated by the client according to the personalized guiding data;

rendering page elements in the H5 page according to the encapsulation guide data to obtain an H5 guide page;

and sending the H5 guide page to a plug-in module, so that the client receives the H5 guide page through the plug-in module, and generating an interface guide schematic diagram according to the H5 guide page and a native guide interface.

In one embodiment, determining whether the user has completed the boot operation;

generating H5 change data in response to an operation triggered on a page element in the H5 guide page;

when the user finishes the guiding operation, re-rendering the corresponding page elements in the H5 guiding page according to the H5 changing data to obtain a re-rendered H5 guiding page;

and sending the re-rendered H5 guide page to the plug-in module, so that the client side obtains the re-rendered H5 guide page through the plug-in module, and updating the interface guide schematic diagram according to the re-rendered H5 guide page.

In a third aspect, the present application further provides an interface guidance schematic generating device, which is applied to a client.

The device comprises:

the data acquisition module is used for acquiring personalized guide data corresponding to a user;

the sending module is used for packaging the personalized guide data to obtain packaged guide data, and sending the packaged guide data to an H5 application end through the plug-in module, so that the H5 application end renders page elements in an H5 page according to the packaged guide data to obtain an H5 guide page;

The interface rendering module is used for rendering on interface elements in a native interface of the client according to the personalized guide data to obtain a native guide interface;

the page acquisition module is used for acquiring the H5 guide page sent by the H5 application end through the plug-in module;

and the schematic diagram generating module is used for generating an interface guide schematic diagram according to the native guide interface and the H5 guide page.

In a fourth aspect, the present application also provides a computer device. The computer device comprises a memory and a processor, wherein the memory stores a computer program, and the processor executes the computer program to implement the steps of the interface guidance schematic generation method of the first aspect embodiment or implement the steps of the interface guidance schematic generation method of the second aspect embodiment.

In a fifth aspect, the present application also provides a computer-readable storage medium. The computer readable storage medium has stored thereon a computer program which, when executed by a processor, implements the steps of the interface guidance scheme generation method of the embodiment of the first aspect described above, or implements the steps of the interface guidance scheme generation method of the embodiment of the second aspect described above.

In a sixth aspect, the present application also provides a computer program product. The computer program product comprises a computer program which, when executed by a processor, implements the steps of the interface guidance schematic generation method of the embodiment of the first aspect described above, or implements the steps of the interface guidance schematic generation method of the embodiment of the second aspect described above.

According to the interface guiding schematic diagram generating method, the device, the computer equipment and the storage medium, communication connection with each H5 application end is achieved through the plug-in module, when guiding is conducted, the client end sends packaging guiding data to the corresponding H5 application end through the plug-in module, so that the H5 application end renders page elements in the H5 page according to the packaging guiding data to obtain the H5 guiding page, then the corresponding H5 guiding page is obtained through the plug-in module, then the interface guiding schematic diagram is generated according to the H5 guiding page and a native guiding interface generated by the client end, and route guiding is conducted based on the interface guiding schematic diagram, therefore route guiding of a user is achieved, conversion of a data structure between the client end and the H5 application end is not needed, difficulty in achieving user guiding development is simplified, and threshold of user guiding operation is lowered.

Drawings

FIG. 1 is an application environment diagram of an interface boot schematic generation method in one embodiment;

FIG. 2 is a first flow chart of an interface guide diagram generating method according to an embodiment;

FIG. 3 is a second flow diagram of an interface guide diagram generation method in one embodiment;

FIG. 4 is a third flow diagram of an interface guide diagram generation method in one embodiment;

FIG. 5 is a fourth flow diagram of a method for generating an interface boot schematic in one embodiment;

FIG. 6 is a fifth flow diagram of a method for generating an interface boot schematic in one embodiment;

FIG. 7 is a first block diagram of an interface guidance schematic generation device in one embodiment;

FIG. 8 is a second block diagram of an interface guidance schematic generation apparatus in one embodiment;

fig. 9 is an internal structural diagram of a computer device in one embodiment.

Detailed Description

In order to make the objects, technical solutions and advantages of the present application more apparent, the present application will be further described in detail with reference to the accompanying drawings and examples. It should be understood that the specific embodiments described herein are for purposes of illustration only and are not intended to limit the present application.

The method for generating the interface guide schematic diagram provided in the embodiment of the present application may be applied to an application environment as shown in fig. 1, where the method for generating the interface guide schematic diagram may be executed by the client 102 or the H5 application 106. The client 102 communicates with the server 104 through a network, and the client 102 and the H5 application communicate through a plug-in module. The Hbase database may store data that the server 104 needs to process. The Hbase database can be integrated on the server 104 or can be placed on the cloud or other network server. The client 102 obtains the personalized guide data corresponding to the currently bound user, encapsulates the personalized data to obtain encapsulated guide data, and sends the encapsulated guide data to the H5 application end through the plug-in module, so that the H5 application end renders page elements in the H5 page according to the encapsulated guide data to obtain the H5 guide page. The client 102 renders the interface elements in the native interface of the client according to the personalized guidance data to obtain the native guidance interface. The client acquires an H5 guide page sent by the H5 application end through the plug-in module, and generates an interface guide schematic diagram according to the native guide interface and the H5 guide page. The client 102 may be, but not limited to, various personal computers, notebook computers, smart phones, tablet computers, internet of things devices, and portable wearable devices, where the internet of things devices may be smart speakers, smart televisions, smart air conditioners, smart vehicle devices, and the like. The portable wearable device may be a smart watch, smart bracelet, headset, or the like. The server 104 may be implemented as a stand-alone server or as a server cluster of multiple servers. The H5 application may be, but is not limited to, various personal computers, notebook computers, and the like.

In one embodiment, as shown in fig. 2, an interface guiding schematic generating method is provided, and the method is applied to the client 102 in fig. 1 for illustration, and includes the following steps:

step 202, obtaining personalized guide data corresponding to the currently bound user.

The currently bound user may refer to a user that performs information binding with the current client. If the user can log in and bind by using the account corresponding to the client, the user information of the user can be used for binding. And binding the mobile phone number of the user and the identity card number of the user.

The personalized guidance data may refer to guidance data corresponding to the currently bound user. The personalized guidance data may be stored in a non-relational database Hbase of the server. The personalized guidance data may be stored pre-configured by an administrator. The Hbase database can implement hundreds of millions of user data stores, and can support high concurrency requests and lateral expansion. The administrator may store the personalized guidance data in the Hbase database with the user information as a data index field. The personalized guidance data can be related data such as special important event reminders of the user, red packets received by the user and the like.

For example, the client may obtain, from the Hbase database of the server, the personalized guidance data corresponding to the currently bound user.

And 204, packaging the personalized guide data to obtain packaged guide data, and sending the packaged guide data to an H5 application end through a plug-in module, so that the H5 application end renders page elements in an H5 page according to the packaged guide data to obtain the H5 guide page.

Wherein, the encapsulation can refer to hiding the attribute and the implementation detail of the object, only disclosing the interface externally, controlling the read and modified access level of the attribute in the program; the abstracted data and actions or functions are combined to form an organic whole, that is, the data and source codes of the operation data are organically combined to form a class, wherein the data and the functions are members of the class.

The encapsulation guide data may refer to encapsulation of the personalized guide data, and the obtained data only discloses the interface to the outside.

Plug-in modules may refer to modules that connect a client and an H5 application. The plug-in module may be a JS plug-in module. The plug-in module Feng Zhuanglu queries and modifies the current personalized guide data; a mechanism is also provided for the H5 application and the client application to access each other. The H5 application end can acquire the encapsulation guide data from the memory of the client end by calling the interface of the plug-in module.

The H5 application end may refer to the front end in the hybrid APP model. The H5 application end is used for providing an HTML5 page and is responsible for maintaining the HTML5 page (H5 page). A hybrid APP model may include a client (base portion), and several H5 applications. Both the H5 page and the native interface provided by the APP client are displayed on the client. The client cannot directly sense the operation of the user on the H5 page. Corresponding information can be obtained only through interaction with the H5 application end.

The page elements may refer to a series of elements in the H5 page that meet the user interaction requirements, which are contained in a software or system interface that can meet the interaction requirements. An H5 page includes at least one page element, a page element and a path node bound.

Path nodes may refer to nodes that can provide native interface functionality that access other H5 pages or that are native to the client. All path nodes are tree structures. A plurality of sub-nodes can be configured for one path node, and the path nodes are mutually nested. Through the nested relation among path nodes, the connection among different H5 pages and the connection between the H5 pages and the native interfaces can be realized.

Rendering may refer to the process of editing page elements to obtain a desired effect. For example, rendering may be adding a reddish dot at the page element.

Illustratively, the client 102 encapsulates the personalized guiding data to obtain corresponding encapsulated guiding data, and sends the encapsulated guiding data to the H5 application end through the plug-in module, and after the H5 application end receives the encapsulated guiding data, the H5 application end renders the page element in the H5 page according to the encapsulated guiding data to obtain the H5 guiding page.

For example, the H5 application may add a red dot to a corresponding page element in the H5 page according to the package guide data, so as to implement rendering of the page element, and obtain the H5 guide page.

And 206, rendering on interface elements in a native interface of the client according to the personalized guide data to obtain a native guide interface.

The native interface may refer to an interface that the client is self-contained. Such as the top page in a hybrid APP, etc.

Interface elements may refer to a series of elements contained in a software or system interface in a native interface that can meet the interaction requirements of a user. Such as securities, stocks, etc. in the home page.

The native interface may have a plurality of interface elements therein, each of which may be bound to a path node.

The client renders corresponding interface elements in the native interface of the client according to the personalized guide data, and a native guide interface is obtained. For example, red dots can be added on the interface element according to the personalized guidance data so as to realize the rendering of the interface element and obtain a native guidance interface.

Step 208, obtaining an H5 guide page sent by the H5 application end through the plug-in module.

Illustratively, when the H5 application renders the page element, and the H5 boot page is obtained, the application sends the H5 boot page to the client through the plug-in module. And the client acquires the H5 guide page through the plug-in module.

Step 210, generating an interface guide schematic diagram according to the native guide interface and the H5 guide page.

The interface guiding schematic may refer to an interface schematic for guiding a user to perform an operation. The interface guide schematic may be synthesized by a native guide interface and a plurality of H5 guide pages.

For example, the native guide interface and the H5 guide page may be generated into an interface guide schematic according to a nested relationship between path nodes.

According to the technical scheme, communication connection with each H5 application end is achieved through the plug-in module, when the user is guided, the client sends package guide data to the corresponding H5 application end through the plug-in module, so that the H5 application end renders page elements in the H5 page according to the package guide data to obtain the H5 guide page, then the corresponding H5 guide page is obtained through the plug-in module, an interface guide schematic diagram is generated according to the H5 guide page and a native guide interface generated by the client, and route guidance is conducted based on the interface guide schematic diagram, route guidance of the user is achieved, conversion of data structures between the client and the H5 application end is not needed, difficulty in achieving user guide development is simplified, and a threshold of user guide operation is reduced.

Referring to fig. 3, in some embodiments, the interface guidance schematic generating method further includes the following steps:

step 302, it is determined whether the user has completed the booting operation.

The guiding operation may refer to an operation performed by the user at a corresponding position according to the guidance of the interface guiding schematic. As may be an operation that directs a user to click on a page element.

For example, whether the user has completed the booting operation may be determined by determining whether the client displays the page corresponding to the lowest rendered page element or interface element. Other information can also be used to determine whether the user has completed the booting operation. For example, when a function requiring reminding is displayed only on a native interface, it may be determined whether the user has completed the booting operation by determining whether the user has clicked on the rendered interface element. For example, when the function to be reminded involves the nested H5 pages, it may be determined whether the user completes the booting operation by determining whether the reminder information sent by the H5 application end corresponding to the H5 page from the deepest nested H5 page is received.

Step 304, in response to an operation triggered on an interface element in the native guide interface, native change data is generated.

Wherein the native change data may refer to data generated by operations triggered by a user on interface elements rendered in the native guide interface. The native change data may be, for example, that the user has triggered an interface element.

Illustratively, the client obtains user operations on the native guide interface and generates native change data in response to user operations triggered on interface elements in the native guide interface.

And 306, if the user completes the guiding operation, re-rendering the corresponding interface elements in the original guiding interface according to the original change data to obtain the re-rendered original guiding interface.

Illustratively, when the user completes the booting operation, the corresponding interface element needs to be re-rendered to indicate that the user has completed the corresponding booting. For example, red dots of the interface element can be eliminated according to the native change data, so that the re-rendering of the interface element is realized, and the re-rendered native guide interface is obtained.

Step 308, updating the interface guide schematic according to the re-rendered native guide interface.

For example, the re-rendered native guide interface may be replaced with the original native guide interface to update the interface guide schematic.

According to the technical scheme, whether the user finishes the guiding operation is determined, and when the user finishes the guiding operation, the interface element is re-rendered so as to prevent the user from being guided again or guided in error, and further the experience of the user and the guiding accuracy are improved.

In some embodiments, the interface guidance schematic generation method further includes the steps of: the method comprises the steps that a plug-in module is used for obtaining a re-rendered H5 guide page sent by an H5 application end; the re-rendered H5 guide page is obtained by re-rendering corresponding page elements in the H5 guide page after the H5 application end completes the guide operation by a user; and updating the interface guide schematic diagram according to the re-rendered H5 guide page.

The re-rendered H5 boot page may refer to an interface obtained by re-rendering the rendered page element in the H5 boot page.

Specifically, the H5 application end responds to the operation triggered on the page element in the H5 guide page to generate H5 change data, and when the user is determined to complete the guide operation, the H5 application end re-renders the rendered page element according to the H5 change data to obtain the re-rendered H5 guide page. And the H5 application end sends the re-rendered H5 guide page to the client through the plug-in module. And the client receives the re-rendered H5 guide page and updates the interface guide schematic diagram according to the re-rendered H5 guide page.

For example, the client may replace the H5 boot page after re-rendering with the original H5 boot page to implement updating of the interface boot schematic.

According to the technical scheme, after the user finishes the guiding operation, the H5 application end re-renders the H5 guiding page according to the H5 change data to obtain the re-rendered H5 guiding page, and updates the interface guiding schematic diagram according to the re-rendered H5 guiding page, so that the user is prevented from being guided again or guided in error, and the experience of the user and the guiding accuracy are improved.

Referring to fig. 4, in some embodiments, the interface guidance schematic generating method further includes the following steps:

step 402, obtaining guiding update data, wherein the guiding update data is generated according to service requirements.

The guiding update data may refer to update data corresponding to personalized guiding data of the currently bound user.

Business requirements may refer to requirements that motivate personalized guidance data. For example, a user initiated alert for a particular event of importance, a certain user receiving a red envelope, etc.

For example, the client may initiate an update data acquisition request to the server, so that the server issues the boot data according to the update data acquisition request of the client, and the client receives the boot update data generated according to the service requirement.

Step 404, classifying the guiding update data to obtain the native update data and the H5 update data.

For example, the boot update data may be classified to determine which data in the boot update data belongs to the native update data corresponding to the native interface and which data belongs to the H5 update data corresponding to the H5 page.

And step 406, updating and rendering the interface elements in the original guiding interface according to the original updating data to obtain the updated and rendered original guiding interface.

The client side updates and renders the corresponding page element in the native guiding interface according to the native updating data after acquiring the native updating data, and obtains the updated and rendered native guiding interface.

Step 408, the plug-in module sends the H5 update data to the H5 application end, so that the H5 application end performs update rendering on the page elements in the H5 guide page according to the H5 update data, and the updated and rendered H5 guide page is obtained.

The client sends the H5 updating data to the H5 application end through the plug-in module, and the H5 application end updates and renders page elements in the H5 guide page according to the H5 updating data after receiving the H5 updating data to obtain the updated and rendered H5 guide page.

Step 410, an updated rendered H5 boot page sent by the H5 application is obtained.

The client acquires an updated rendered H5 guide page sent by the H5 application terminal through the JS plug-in module.

Step 412, determining an updated rendered interface guide schematic according to the updated rendered native guide interface and the updated rendered H5 guide page.

Illustratively, the client merges the updated rendered native guide interface and the updated rendered H5 guide interface to generate an updated rendered interface guide schematic.

According to the technical scheme, the guide update data are classified into the H5 update data and the native update data, the interface elements in the native guide interface are updated and rendered according to the native update data, the updated and rendered native guide interface is obtained, the H5 update data are sent to the H5 application end, so that the H5 application end updates and renders the interface elements in the H5 guide interface according to the H5 update data, the updated and rendered H5 guide interface is obtained, and the client end obtains an updated and rendered interface guide schematic diagram according to the H5 guide interface and the native guide interface, so that guide update is realized, and reminding and guide users are facilitated.

In some embodiments, the step of "obtaining the configured user-corresponding personalized guidance data" includes the steps of: sending a data request to a server according to user information corresponding to a currently bound user, so that the server queries from an Hbase database according to the user information carried in the data request to obtain personalized guide data; and receiving the personalized guide data sent by the server.

The user information may refer to information for identifying a currently bound user unique identity. For example, the user information may be an identification card number, a mobile phone number, etc. of the currently bound user, or the user information may be a unique ID number, etc. generated by the client when the user logs in the APP client.

The data request may refer to data information sent by the client requesting the server to send personalized guidance data.

The client sends a data request to the server according to user information corresponding to the currently bound user, so that the server queries from the Hbase database according to the user information to obtain personalized guide data, sends the personalized guide data to the client, and receives the corresponding personalized guide data.

According to the technical scheme, the personalized data are stored in the Hbase database, and the advantages of high concurrency and large storage capacity can be achieved through the Hbase database, so that the stability of the server can be improved, and the user can be guided conveniently.

Referring to fig. 5, some embodiments of the present application further provide an interface guiding schematic generating method, which is illustrated by using the method applied to the H5 application end 105 in fig. 1 as an example, and includes the following steps:

step 502, receiving encapsulation guide data sent by a plug-in module; the encapsulation guiding data is obtained by the client according to the personalized guiding data encapsulation.

The encapsulation guiding data may refer to the data that the client encapsulates the personalized guiding data to obtain only the interface.

The H5 application obtains the package boot data sent by the client through the plug-in module.

And step 504, rendering the page elements in the H5 page according to the encapsulation guide data to obtain the H5 guide page.

The page elements may refer to a series of elements in the H5 page, which may be included in a software or system interface that may meet the interaction requirement and meet the user interaction requirement. An H5 page includes at least one page element, a page element and a path node bound.

Illustratively, the H5 application renders the corresponding page element in the H5 page according to the package guide data, to obtain the corresponding H5 guide page.

For example, the H5 application may add a reddish dot to a corresponding page element in the H5 page according to the package guide data, so as to implement rendering of the page element, and obtain a corresponding H5 guide page.

And step 506, the H5 guide page is sent to the plug-in module, so that the client receives the H5 guide page through the plug-in module, and an interface guide schematic diagram is generated according to the H5 guide page and the native guide interface.

The H5 application sends the corresponding H5 guide page to the plug-in module, and the client receives the H5 guide page through the plug-in module, and generates an interface guide schematic according to the H5 guide page and the native guide page, so that the user can be guided conveniently.

According to the technical scheme, communication connection with each H5 application end is achieved through the plug-in module, when guiding is conducted, the H5 application ends can render page elements in the H5 pages directly according to package guiding data to obtain the H5 guiding pages, the H5 guiding pages are sent to the client through the plug-in module, so that the client generates interface guiding diagrams according to the H5 guiding pages and the original guiding pages, and route guiding is conducted based on the interface guiding diagrams, route guiding of a user is achieved, conversion of data structures between the client and the H5 application ends is not needed, difficulty in achieving user guiding development is simplified, and threshold of user guiding operation is lowered.

Referring to fig. 6, in some embodiments, the interface guidance schematic generating method further includes the following steps:

step 602, it is determined whether the user has completed the booting operation.

The guiding operation may refer to an operation performed by the user at a corresponding position according to the guidance of the interface guiding schematic.

For example, whether the user has completed the booting operation may be determined by determining whether the user has completed the booting operation after the user has completed the operation at the deepest H5 booting interface, or whether information for identifying that the user has cancelled a reminder or that the user has completed a guide may be received.

In step 604, H5 variation data is generated in response to an operation triggered on a page element in the H5 boot page.

The original H5 change data may refer to data generated by an operation triggered by a user on a rendered page element in the H5 guide interface. The H5 change data may be that the user has triggered a page element, for example.

Illustratively, the H5 application may obtain an operation of the user on the H5 boot page, and generate H5 change data in response to the operation triggered on the rendered page element.

Step 606, when the user completes the booting operation, re-rendering the corresponding page element in the H5 booting page according to the H5 variation data, so as to obtain the re-rendered H5 booting page.

After the user is determined to finish the booting operation, the H5 application end re-renders the corresponding page element in the H5 booting page according to the H5 change data, so as to obtain the re-rendered H5 booting page.

Step 608, the re-rendered H5 guide page is sent to the plug-in module, so that the client obtains the re-rendered H5 guide page through the plug-in module, and updates the interface guide schematic according to the re-rendered H5 guide page.

The H5 application sends the re-rendered H5 boot page to the plug-in module, so that the re-rendered H5 boot page is sent to the client through the plug-in module. And the client updates the interface guide schematic diagram according to the obtained re-rendered H5 guide page.

According to the technical scheme, whether the user finishes the guiding operation is determined, and when the user finishes the guiding operation, the page elements are re-rendered, so that the user is prevented from being guided again or guided in error, and the experience of the user and the guiding accuracy are improved.

It should be understood that, although the steps in the flowcharts related to the above embodiments are sequentially shown as indicated by arrows, these steps are not necessarily sequentially performed in the order indicated by the arrows. The steps are not strictly limited to the order of execution unless explicitly recited herein, and the steps may be executed in other orders. Moreover, at least some of the steps in the flowcharts described in the above embodiments may include a plurality of steps or a plurality of stages, which are not necessarily performed at the same time, but may be performed at different times, and the order of the steps or stages is not necessarily performed sequentially, but may be performed alternately or alternately with at least some of the other steps or stages.

Based on the same inventive concept, the embodiment of the application also provides an interface guiding schematic diagram generating device for implementing the above related interface guiding schematic diagram generating method. The implementation of the solution provided by the device is similar to the implementation described in the method above, so the specific limitations in one or more embodiments of the interface guide schematic generation device provided below may be found in the limitations of the interface guide schematic generation method above.

In one embodiment, as shown in fig. 7, there is provided an interface guidance schematic generating apparatus, including: a data acquisition module 702, a sending module 704, an interface rendering module 706, a page acquisition module 708, and a schematic generation module 710, wherein:

the data acquisition module 702 is configured to acquire personalized guide data corresponding to a user.

And the sending module 704 is configured to encapsulate the personalized guiding data to obtain encapsulated guiding data, and send the encapsulated guiding data to the H5 application end through the plug-in module, so that the H5 application end renders the page element in the H5 page according to the encapsulated guiding data to obtain the H5 guiding page.

The interface rendering module 706 is configured to render, according to the personalized guiding data, on an interface element in a native interface of the client, to obtain a native guiding interface.

The page obtaining module 708 is configured to obtain, by using the plug-in module, an H5 boot page sent by the H5 application.

The schematic diagram generating module 710 is configured to generate an interface guiding schematic diagram according to the native guiding interface and the H5 guiding page.

In some embodiments, the interface guidance schematic generating apparatus further includes:

and the first determining module is used for determining whether the user finishes the guiding operation.

And the native change data generation module is used for responding to the operation triggered on the interface element in the native guide interface and generating the native change data.

The interface rendering module 706 is further configured to re-render the corresponding interface element in the native guiding interface according to the native change data if the user completes the guiding operation, so as to obtain a re-rendered native guiding interface.

The schematic diagram generating module 710 is further configured to update the interface guidance schematic diagram according to the re-rendered native guidance interface.

In some embodiments, the page obtaining module 708 is further configured to obtain, by using the plug-in module, a re-rendered H5 boot page sent by the H5 application end; the re-rendered H5 guide page is obtained by re-rendering corresponding page elements in the H5 guide page after the H5 application end completes the guide operation by a user; and updating the interface guide schematic diagram according to the re-rendered H5 guide page.

The schematic diagram generating module 710 is further configured to update the interface guide schematic diagram according to the re-rendered H5 guide page.

In some embodiments, the data acquisition module 702 is further configured to acquire boot update data; the guiding update data is data generated according to service requirements and is also used for classifying the guiding update data to obtain the original update data and the H5 update data.

The interface rendering module 706 is further configured to update and render the interface elements in the native guiding interface according to the native update data, so as to obtain an updated and rendered native guiding interface.

The sending module 704 is further configured to send the H5 update data to the H5 application through the plug-in module, so that the H5 application performs update rendering on page elements in the H5 guide page according to the H5 update data, and obtains an updated and rendered H5 guide page.

The page obtaining module 708 is further configured to obtain an updated rendered H5 boot page sent by the H5 application.

The schematic diagram generating module 710 is further configured to determine an updated rendered interface guiding schematic diagram according to the updated rendered native guiding interface and the updated rendered H5 guiding page.

In some embodiments, the data obtaining module 702 is further configured to send a data request to the server according to user information corresponding to the currently bound user, so that the server queries from the Hbase database according to the user information carried in the data request to obtain personalized guide data; and receiving the personalized guide data sent by the server.

Referring to fig. 8, some embodiments of the present application further provide an interface guiding schematic generating device, which is applied to an H5 application end, and includes:

a data receiving module 802, configured to receive the package guide data sent by the plug-in module; the encapsulation guiding data is obtained by the client according to the personalized guiding data encapsulation.

The page rendering module 804 is configured to render the page elements in the H5 page according to the encapsulated guiding data, so as to obtain the H5 guiding page.

The page sending module 806 is configured to send the H5 guide page to the plug-in module, so that the client receives the H5 guide page through the plug-in module, and generates an interface guide schematic according to the H5 guide page and the native guide interface.

and the second determining module is used for determining whether the user finishes the guiding operation.

An H5 change data generation module for generating H5 change data in response to an operation triggered on a page element in an H5 boot page,

the page rendering module 804 is further configured to re-render the corresponding page element in the H5 guide page according to the H5 change data after the user completes the guide operation, so as to obtain a re-rendered H5 guide page.

The page sending module 806 is further configured to send the re-rendered H5 guide page to the plug-in module, so that the client obtains the re-rendered H5 guide page through the plug-in module, and updates the interface guide schematic according to the re-rendered H5 guide page.

The respective modules in the interface guide schematic generating device may be implemented in whole or in part by software, hardware, or a combination thereof. The above modules may be embedded in hardware or may be independent of a processor in the computer device, or may be stored in software in a memory in the computer device, so that the processor may call and execute operations corresponding to the above modules.

In one embodiment, a computer device is provided, which may be a terminal, and the internal structure thereof may be as shown in fig. 9. The computer device includes a processor, a memory, an input/output interface, a communication interface, a display unit, and an input means. The processor, the memory and the input/output interface are connected through a system bus, and the communication interface, the display unit and the input device are connected to the system bus through the input/output interface. Wherein the processor of the computer device is configured to provide computing and control capabilities. The memory of the computer device includes a non-volatile storage medium and an internal memory. The non-volatile storage medium stores an operating system and a computer program. The internal memory provides an environment for the operation of the operating system and computer programs in the non-volatile storage media. The input/output interface of the computer device is used to exchange information between the processor and the external device. The communication interface of the computer device is used for carrying out wired or wireless communication with an external terminal, and the wireless mode can be realized through WIFI, a mobile cellular network, NFC (near field communication) or other technologies. The computer program, when executed by a processor, implements an interface boot schematic generation method. The display unit of the computer device is used for forming a visual picture, and can be a display screen, a projection device or a virtual reality imaging device. The display screen can be a liquid crystal display screen or an electronic ink display screen, and the input device of the computer equipment can be a touch layer covered on the display screen, can also be a key, a track ball or a touch pad arranged on the shell of the computer equipment, and can also be an external keyboard, a touch pad or a mouse and the like.

It will be appreciated by those skilled in the art that the structure shown in fig. 9 is merely a block diagram of a portion of the structure associated with the present application and is not limiting of the computer device to which the present application applies, and that a particular computer device may include more or fewer components than shown, or may combine some of the components, or have a different arrangement of components.

In one embodiment, a computer device is provided comprising a memory and a processor, the memory having stored therein a computer program, the processor when executing the computer program performing the steps of: acquiring personalized guide data corresponding to a currently bound user; packaging the personalized guide data to obtain packaged guide data, and sending the packaged guide data to an H5 application end through a plug-in module, so that the H5 application end renders page elements in an H5 page according to the packaged guide data to obtain an H5 guide page; rendering is carried out on interface elements in a native interface of the client according to the personalized guiding data, and a native guiding interface is obtained; the method comprises the steps that an H5 guide page sent by an H5 application terminal is obtained through a plug-in module; and generating an interface guide schematic diagram according to the native guide interface and the H5 guide page.

In one embodiment, the processor when executing the computer program further performs the steps of: determining whether the user completes the booting operation; generating native change data in response to an operation triggered on an interface element in a native guide interface; if the user completes the guiding operation, re-rendering the corresponding interface elements in the original guiding interface according to the original change data to obtain a re-rendered original guiding interface; and updating the interface guide schematic diagram according to the re-rendered native guide interface.

In one embodiment, the processor when executing the computer program further performs the steps of: the method comprises the steps that a plug-in module is used for obtaining a re-rendered H5 guide page sent by an H5 application end; the re-rendered H5 guide page is obtained by re-rendering corresponding page elements in the H5 guide page after the H5 application end completes the guide operation by a user; and updating the interface guide schematic diagram according to the re-rendered H5 guide page.

In one embodiment, the processor when executing the computer program further performs the steps of: acquiring guide update data; the guiding update data is data generated according to service requirements; classifying the guide update data to obtain original update data and H5 update data; updating and rendering the interface elements in the original guiding interface according to the original updating data to obtain an updated and rendered original guiding interface; the H5 updating data is sent to an H5 application end through a plug-in module, so that the H5 application end carries out updating rendering on page elements in the H5 guiding page according to the H5 updating data to obtain an updated and rendered H5 guiding page; acquiring an updated rendered H5 guide page sent by an H5 application terminal; and determining an updated rendered interface guide schematic diagram according to the updated rendered native guide interface and the updated rendered H5 guide page.

In one embodiment, the processor when executing the computer program further performs the steps of: sending a data request to a server according to user information corresponding to a currently bound user, so that the server queries from an Hbase database according to the user information carried in the data request to obtain personalized guide data; and receiving the personalized guide data sent by the server.

In one embodiment, the processor when executing the computer program further performs the steps of: receiving encapsulation guide data sent by a plug-in module; the encapsulation guide data are encapsulated by the client according to the personalized guide data; rendering the page elements in the H5 page according to the encapsulation guide data to obtain the H5 guide page; and sending the H5 guide page to the plug-in module, so that the client receives the H5 guide page through the plug-in module, and generating an interface guide schematic diagram according to the H5 guide page and the native guide interface.

In one embodiment, the processor when executing the computer program further performs the steps of: determining whether the user completes the booting operation; generating H5 change data in response to an operation triggered on a page element in the H5 guide page; when the user finishes the guiding operation, re-rendering the corresponding page elements in the H5 guiding page according to the H5 changing data to obtain a re-rendered H5 guiding page; and sending the re-rendered H5 guide page to the plug-in module, so that the client side obtains the re-rendered H5 guide page through the plug-in module, and updating the interface guide schematic diagram according to the re-rendered H5 guide page.

In one embodiment, a computer readable storage medium is provided having a computer program stored thereon, which when executed by a processor, performs the steps of: acquiring personalized guide data corresponding to a currently bound user; packaging the personalized guide data to obtain packaged guide data, and sending the packaged guide data to an H5 application end through a plug-in module, so that the H5 application end renders page elements in an H5 page according to the packaged guide data to obtain an H5 guide page; rendering is carried out on interface elements in a native interface of the client according to the personalized guiding data, and a native guiding interface is obtained; the method comprises the steps that an H5 guide page sent by an H5 application terminal is obtained through a plug-in module; and generating an interface guide schematic diagram according to the native guide interface and the H5 guide page.

In one embodiment, the computer program when executed by the processor further performs the steps of: determining whether the user completes the booting operation; generating native change data in response to an operation triggered on an interface element in a native guide interface; if the user completes the guiding operation, re-rendering the corresponding interface elements in the original guiding interface according to the original change data to obtain a re-rendered original guiding interface; and updating the interface guide schematic diagram according to the re-rendered native guide interface.

In one embodiment, the computer program when executed by the processor further performs the steps of: the method comprises the steps that a plug-in module is used for obtaining a re-rendered H5 guide page sent by an H5 application end; the re-rendered H5 guide page is obtained by re-rendering corresponding page elements in the H5 guide page after the H5 application end completes the guide operation by a user; and updating the interface guide schematic diagram according to the re-rendered H5 guide page.

In one embodiment, the computer program when executed by the processor further performs the steps of: acquiring guide update data; the guiding update data is data generated according to service requirements; classifying the guide update data to obtain original update data and H5 update data; updating and rendering the interface elements in the original guiding interface according to the original updating data to obtain an updated and rendered original guiding interface; the H5 updating data is sent to an H5 application end through a plug-in module, so that the H5 application end carries out updating rendering on page elements in the H5 guiding page according to the H5 updating data to obtain an updated and rendered H5 guiding page; acquiring an updated rendered H5 guide page sent by an H5 application terminal; and determining an updated rendered interface guide schematic diagram according to the updated rendered native guide interface and the updated rendered H5 guide page.

In one embodiment, the computer program when executed by the processor further performs the steps of: sending a data request to a server according to user information corresponding to a currently bound user, so that the server queries from an Hbase database according to the user information carried in the data request to obtain personalized guide data; and receiving the personalized guide data sent by the server.

In one embodiment, the computer program when executed by the processor further performs the steps of: receiving encapsulation guide data sent by a plug-in module; the encapsulation guide data are encapsulated by the client according to the personalized guide data; rendering the page elements in the H5 page according to the encapsulation guide data to obtain the H5 guide page; and sending the H5 guide page to the plug-in module, so that the client receives the H5 guide page through the plug-in module, and generating an interface guide schematic diagram according to the H5 guide page and the native guide interface.

In one embodiment, the computer program when executed by the processor further performs the steps of: determining whether the user completes the booting operation; generating H5 change data in response to an operation triggered on a page element in the H5 guide page; when the user finishes the guiding operation, re-rendering the corresponding page elements in the H5 guiding page according to the H5 changing data to obtain a re-rendered H5 guiding page; and sending the re-rendered H5 guide page to the plug-in module, so that the client side obtains the re-rendered H5 guide page through the plug-in module, and updating the interface guide schematic diagram according to the re-rendered H5 guide page.

In one embodiment, a computer program product is provided comprising a computer program which, when executed by a processor, performs the steps of: acquiring personalized guide data corresponding to a currently bound user; packaging the personalized guide data to obtain packaged guide data, and sending the packaged guide data to an H5 application end through a plug-in module, so that the H5 application end renders page elements in an H5 page according to the packaged guide data to obtain an H5 guide page; rendering is carried out on interface elements in a native interface of the client according to the personalized guiding data, and a native guiding interface is obtained; the method comprises the steps that an H5 guide page sent by an H5 application terminal is obtained through a plug-in module; and generating an interface guide schematic diagram according to the native guide interface and the H5 guide page.

Those skilled in the art will appreciate that implementing all or part of the above described methods may be accomplished by way of a computer program stored on a non-transitory computer readable storage medium, which when executed, may comprise the steps of the embodiments of the methods described above. Any reference to memory, database, or other medium used in the various embodiments provided herein may include at least one of non-volatile and volatile memory. The nonvolatile Memory may include Read-Only Memory (ROM), magnetic tape, floppy disk, flash Memory, optical Memory, high density embedded nonvolatile Memory, resistive random access Memory (ReRAM), magnetic random access Memory (Magnetoresistive Random Access Memory, MRAM), ferroelectric Memory (Ferroelectric Random Access Memory, FRAM), phase change Memory (Phase Change Memory, PCM), graphene Memory, and the like. Volatile memory can include random access memory (Random Access Memory, RAM) or external cache memory, and the like. By way of illustration, and not limitation, RAM can be in the form of a variety of forms, such as static random access memory (Static Random Access Memory, SRAM) or dynamic random access memory (Dynamic Random Access Memory, DRAM), and the like. The databases referred to in the various embodiments provided herein may include at least one of relational databases and non-relational databases. The non-relational database may include, but is not limited to, a blockchain-based distributed database, and the like. The processors referred to in the embodiments provided herein may be general purpose processors, central processing units, graphics processors, digital signal processors, programmable logic units, quantum computing-based data processing logic units, etc., without being limited thereto.

The technical features of the above embodiments may be arbitrarily combined, and all possible combinations of the technical features in the above embodiments are not described for brevity of description, however, as long as there is no contradiction between the combinations of the technical features, they should be considered as the scope of the description.

The above examples only represent a few embodiments of the present application, which are described in more detail and are not to be construed as limiting the scope of the present application. It should be noted that it would be apparent to those skilled in the art that various modifications and improvements could be made without departing from the spirit of the present application, which would be within the scope of the present application. Accordingly, the scope of protection of the present application shall be subject to the appended claims.

Claims

1. An interface guiding schematic diagram generating method, which is characterized by being applied to a client, comprises the following steps:

acquiring personalized guide data corresponding to a currently bound user;

2. The method according to claim 1, wherein the method further comprises:

determining whether the user completes a booting operation;

3. The method according to claim 2, wherein the method further comprises:

4. The method according to claim 1, wherein the method further comprises:

5. The method according to claim 1, wherein the obtaining the configured user-corresponding personalized guidance data includes:

and receiving the personalized guide data sent by the server.

6. The interface guiding schematic diagram generating method is characterized by being applied to an H5 application end, and comprises the following steps:

7. The method of claim 6, wherein the method further comprises:

determining whether the user completes the booting operation;

8. An interface guidance schematic generating apparatus, applied to a client, the apparatus comprising:

9. A computer device comprising a memory and a processor, the memory storing a computer program, characterized in that the processor, when executing the computer program, implements the steps of the method of any one of claims 1 to 6 or the steps of the method of any one of claims 6 to 7.

10. A computer readable storage medium, on which a computer program is stored, characterized in that the computer program, when being executed by a processor, implements the steps of the method of any one of claims 1 to 5 or the steps of the method of any one of claims 6 to 7.