Page operation guiding method and device, storage medium and program product

Abstract

The embodiment of the invention provides a page operation guiding method and device, a storage medium and a program product. The method comprises the steps of displaying a first page; according to a preset guiding task, a first guiding layer used for covering the first page is generated, the first guiding layer is provided with a first visual penetrating area, and a to-be-guided first operation area of the first page is exposed through the first visual penetrating area; displaying the first guide layer; in response to a trigger operation for the first visual penetration area, updating the first page into a second page; according to the guiding task, a second guiding layer used for covering the second page is generated, the second guiding layer is provided with a second visual penetrating area, a to-be-guided second operation area of the second page is exposed through the second visual penetrating area, and the second guiding layer is displayed. According to the technical scheme provided by the embodiment of the invention, dynamic guidance among a plurality of pages can be completed, and functions related to cross-page operation can be guided.

Description

Technical Field

[0001] The present application relates to the field of terminal processing technology, and in particular to a page operation guidance method, device, storage medium and program product. Background Art

[0002] In Internet applications (such as web pages, mobile applications, etc.), in order to guide novices or guide users to complete new function operations, existing technologies usually use a combination of a mask layer and prompt content located above the mask layer to implement operation guidance.

[0003] Specifically, the overlay layer globally covers the entire application page, typically using a translucent black or gray overlay to highlight the prompt content. Furthermore, the overlay layer is used to prevent users from interacting with the underlying page elements, ensuring that users can only follow the preset guidance path. The prompt content is located above the overlay layer and typically includes text descriptions, action buttons (such as "Next" and "Skip"), and UI elements used to highlight the target controls (such as buttons and input boxes) on the underlying page.

[0004] In other words, the existing technology can only meet the static guidance of the first-level page. Summary of the Invention

[0005] Multiple aspects of the present application provide a page operation guidance method, device, storage medium and program product, which can complete dynamic guidance between multiple pages and can guide functions involving cross-page operations.

[0006] In a first aspect of the present application, a page operation guidance method is provided, comprising:

[0007] Display the first page;

[0008] According to a preset guidance task, a first guidance layer is generated for covering the first page, wherein the first guidance layer is provided with a first visually transparent area, and a first operation area to be guided on the first page is exposed through the first visually transparent area;

[0009] displaying the first guide layer;

[0010] In response to a user triggering operation on the first visually transparent area, updating the first page to a second page, where the second page is a page required to be displayed in response to the triggering operation on the first operation area;

[0011] generating, according to the guidance task, a second guidance layer for covering the second page, wherein the second guidance layer is provided with a second visually transparent area, and a second operation area to be guided on the second page is exposed through the second visually transparent area;

[0012] The second guide layer is displayed.

[0013] In a second aspect of the present application, an electronic device is provided. The electronic device includes: a memory and a processor, wherein:

[0014] The memory is used to store programs;

[0015] The processor is coupled to the memory and is configured to execute the program stored in the memory to implement the method described above.

[0016] According to a third aspect of the present application, a computer-readable storage medium storing a computer program is provided, wherein the computer program can implement the above-described method when executed by a computer.

[0017] According to a fourth aspect of the present application, a computer program product is provided, comprising a computer program, which implements the above-described method when executed by a processor.

[0018] In the technical solution provided by the embodiment of the present application, the first visual penetration area of the first guide layer is used to expose the first operation area to be guided of the first page, so that it can play a guiding role. In addition, the user's triggering operation in the first visual penetration area will be transmitted to the first page below, and the first page will respond to the user's triggering operation in the first visual penetration area in the same way as it responds to the user's triggering operation on the first operation area, thereby updating to the second page. After entering the second page, a second guide layer for guiding the second page will continue to be generated based on the preset guidance task to continue guiding the second page. It can be seen that the technical solution provided by the embodiment of the present application can complete dynamic guidance between multiple pages, can guide functions involving cross-page operations, and improve the operation guidance effect. BRIEF DESCRIPTION OF THE DRAWINGS

[0019] The drawings described herein are used to provide a further understanding of the present application and constitute a part of the present application. The illustrative embodiments of the present application and their descriptions are used to explain the present application and do not constitute an improper limitation on the present application. In the drawings:

[0020] Figure 1 A flowchart of a page operation guidance method provided by an exemplary embodiment of the present application;

[0021] Figure 2 A code example for creating a mask layer with a hollowed-out area provided in an exemplary embodiment of the present application;

[0022] Figure 3 An example of a mask layer with a hollow area provided in an exemplary embodiment of the present application;

[0023] Figure 4An example of guidance data provided for an exemplary embodiment of the present application;

[0024] Figure 5 A flowchart of a page operation guidance method provided by another exemplary embodiment of the present application;

[0025] Figure 6 A schematic structural diagram of an electronic device provided as an exemplary embodiment of the present application. DETAILED DESCRIPTION

[0026] To make the purpose, technical solutions, and advantages of this application more clear, the technical solutions of this application will be clearly and completely described below in conjunction with the specific embodiments of this application and the corresponding drawings. Obviously, the embodiments described are only part of the embodiments of this application, not all of them. Based on the embodiments in this application, all other embodiments obtained by ordinary technicians in this field without making creative efforts are within the scope of protection of this application.

[0027] It should be noted that, in the case of user information involved in the embodiments of the present application, the user information (including but not limited to user device information, user personal information, etc.) and data (including but not limited to data used for analysis, stored data, displayed data, etc.) involved in the embodiments of the present application are all information and data authorized by the user or fully authorized by all parties, and the collection, use and processing of relevant data need to comply with the relevant laws, regulations and standards of the relevant countries and regions, and provide corresponding operation entrances for users to choose to authorize or refuse. In addition, the various models involved in this application (including but not limited to language models or large models) are in compliance with relevant laws and standards.

[0028] Before introducing the technical solutions provided by the embodiments of this application, the technical terms involved in this article are explained:

[0029] SVG: Scalable Vector Graphics, is an open standard graphic format based on XML. It uses mathematical formulas to define graphic elements such as paths, shapes, and text, rather than relying on pixels. This feature gives SVG the advantage of infinite scalability without distortion, making it very suitable for use on high-resolution screens, such as Retina displays. SVG files not only have concise code, but can also be directly embedded in HTML or CSS, and support dynamic interaction and style adjustment through JavaScript and CSS. Its core features are very significant, including vector rendering for lossless scaling; rich expressiveness, supporting gradients, filters, animations and other effects; open syntax, easy to edit and extend; and deep integration with modern Web technologies. Based on these features, SVG is widely used in web icons, data visualization, responsive design, interactive animation, and icon fonts, making it an ideal choice for Web graphics and cross-platform design.

[0030] Front-end guided tours: This approach uses step-by-step interactive prompts to help users familiarize themselves with interface features. It intuitively guides users through interface exploration, reducing learning curves and increasing feature usage. This approach is commonly used for new feature launches, complex workflows, or first-time users. It can be combined with A / B testing to optimize the guided tour, making it a key tool for improving user experience and retention.

[0031] The following describes in detail the technical solutions provided by various embodiments of the present application in conjunction with the accompanying drawings.

[0032] Figure 1 This is a flow chart of a page operation guidance method provided by an exemplary embodiment of the present application. The execution subject of this method may include an electronic device with a display screen, such as: a mobile phone, a tablet computer, a smart wearable device, or any other terminal device.

[0033] like Figure 1 As shown, the method may include the following steps:

[0034] 101. Display the first page.

[0035] In some embodiments, the first page and the second page may be pages of an application APP. For example, the application APP may be a life service APP, specifically a local life service APP. For example, the first page may be the homepage (or first-level page) of the application APP.

[0036] In other embodiments, the first page and the second page may be web pages on a web terminal. For example, the first page may be the first page of a website.

[0037] In actual applications, the first page may be displayed in response to a trigger operation input by the user to enter the first page.

[0038] In some embodiments, the first page can be any page that appears in the boot process executed for a preset boot task. The page can be the first page that appears in the boot process, such as a first-level page, or it can be a page that does not appear first in the boot process, such as a second-level page, a third-level page, etc.

[0039] 102. Generate a first guidance layer for covering the first page according to a preset guidance task.

[0040] The first guide layer is provided with a first visual penetration area, through which a first operation area to be guided of the first page is exposed.

[0041] In some embodiments, after the first page is covered with the first guide layer, the brightness of the first visually transparent area is higher than the brightness of other areas. The brightness refers to screen brightness.

[0042] In some embodiments, a contour of the first visually transparent area is adapted to a first operation area to be guided on the first page.

[0043] Exemplarily, the first guide layer may be a mask layer.

[0044] The first visual penetration area may be a transparent area, that is, the transparency of the first visual penetration area is greater than 0 and less than or equal to 100%.

[0045] In some embodiments, the transparency of the first vision-transmitting area of the first guide layer is greater than the transparency of other areas of the first guide layer except the first vision-transmitting area.

[0046] Exemplarily, the first visually transparent area of the first guide layer is a fully transparent area, and the remaining areas of the first guide layer other than the first visually transparent area are semi-transparent areas. A fully transparent area refers to an area with 100% transparency, and a semi-transparent area refers to an area with a transparency greater than 0 and less than 100%. Optionally, the remaining areas of the first guide layer other than the first visually transparent area are semi-transparent areas in black or gray.

[0047] In practical applications, the first operation area may be highlighted by using different transparency and / or brightness.

[0048] 103. Display the first guide layer.

[0049] The first guide layer is displayed in a form covering the first page.

[0050] 104. In response to a user triggering operation on the first visual penetration area, update the first page to a second page.

[0051] The second page is a page that needs to be displayed in response to a trigger operation on the first operation area.

[0052] That is, the user's triggering operation on the first visual penetration area will penetrate to the first page, so that the first page can be updated to the second page in response to the triggering operation.

[0053] The first page and the second page are different pages, wherein the difference lies in the page content or page layout. The difference in page content can be partial page content or all page content.

[0054] Taking the local life service APP as an example, the first page is a first-level page, providing multiple first-level category options, such as: "Renting a House", "Finding a Job", "Local Services", etc. The first operation area is the area where the "Local Services" option is located. In response to the user's trigger operation on the first visual penetration area, the first page is updated to the second page, that is, the second page is displayed in place of the first page. The second page is a second-level page, which is the details page of "Local Services".

[0055] Still taking the local life service APP as an example, the first page is a second-level page, specifically the details page of "local services". The first area of the page displays multiple second-level category options, such as: "Housekeeping", "Second-hand Recycling", "Moving", etc. The second area of the page displays multiple third-level category options under the second-level category of "Housekeeping" by default. The first operation area is the area where the "Second-hand Recycling" option is located. In response to the user's trigger operation on the first visual penetration area, the first page is updated to the second page, that is, the second page is displayed in place of the first page. The second page is still a second-level page, which can also be called the details page of "local services", but the second area of the page displays multiple third-level category options under the second-level category of "Second-hand Recycling". In other words, some page contents of the first and second pages are different.

[0056] 105. Generate a second guidance layer for covering the second page according to the guidance task.

[0057] The second guide layer is provided with a second visual penetration area, through which a second operation area to be guided of the second page is exposed.

[0058] In some embodiments, the contour of the second visual penetration area is adapted to the second operation area to be guided on the second page.

[0059] Exemplarily, the second guide layer may be a mask layer.

[0060] The second visual penetration area may be a transparent area, that is, the transparency of the second visual penetration area is greater than 0 and less than or equal to 100%.

[0061] In some embodiments, the transparency of the second vision-transmitting area of the second guide layer is greater than the transparency of other areas of the second guide layer except the second vision-transmitting area.

[0062] Exemplarily, the second visually transparent area of the second guide layer is a fully transparent area, and the remaining areas of the second guide layer, excluding the first visually transparent area, are semi-transparent areas. A fully transparent area is an area with 100% transparency, and a semi-transparent area is an area with a transparency greater than 0 and less than 100%. Optionally, the remaining areas of the second guide layer, excluding the second visually transparent area, are semi-transparent areas in black or gray.

[0063] 106. Display the second guide layer.

[0064] In some embodiments, after the second page is covered with the second guide layer, the brightness of the second visually transparent area is higher than that of other areas. The brightness refers to screen brightness.

[0065] The second guide layer is displayed in a manner of covering the second page.

[0066] It should be noted that when the second page and the second guide layer are displayed, the first page and the first guide layer will not be displayed.

[0067] In some embodiments, the orthographic projection of the first visual penetration area on the first page completely overlaps with the first operation area of the first page. In some embodiments, the orthographic projection of the second visual penetration area on the second page completely overlaps with the second operation area of the second page.

[0068] In some embodiments, areas of the first guide layer other than the first visually permeable area do not respond to user trigger operations or trigger events, that is, the other areas are non-interactive areas. In some embodiments, areas of the second guide layer other than the second visually permeable area do not respond to user trigger operations or trigger events, that is, the other areas are non-interactive areas.

[0069] In practical applications, the second operation area may be highlighted by different transparency and / or brightness.

[0070] In the technical solution provided by the embodiment of the present application, the first visual penetration area of the first guide layer is used to expose the first operation area to be guided of the first page, so that it can play a guiding role. In addition, the user's triggering operation in the first visual penetration area will be transmitted to the first page below, and the first page will respond to the user's triggering operation in the first visual penetration area in the same way as it responds to the user's triggering operation on the first operation area, thereby updating to the second page. After entering the second page, a second guide layer for guiding the second page will continue to be generated based on the preset guidance task to continue guiding the second page. It can be seen that the technical solution provided by the embodiment of the present application can complete dynamic guidance between multi-level pages, can guide functions involving cross-page operations, and improve the operation guidance effect.

[0071] In some embodiments, the above-mentioned visual penetration area can be a hollow area. In an optional embodiment, Scalable Vector Graphics (SVG) technology is used to generate a guide layer with a hollow area. The guide layer generated by the technology of "SVG combined graphics to achieve hollow effect" can achieve a "hole-digging" effect. On the one hand, the operation area to be guided in the page below can be highlighted in the guide layer without the need for a separate highlight effect; on the other hand, the user can be guided to perform the most real and effective operation behavior without the need to design a separate response logic in the guide component.

[0072] Can be used Figure 2 The code shown generates Figure 3 A mask layer with cutout areas shown. Figure 3 In the example, the black area cannot respond to user operations, but the hollow area (the area surrounded by the black area) can respond to user operations.

[0073] In practical applications, SVG can generate graphics of various shapes, support backgrounds, gradients, animations, etc., with more user-friendly effects and richer scenarios, and can meet the needs under various specific conditions.

[0074] In some embodiments, in a page, the area that can be operated is usually the area where the control is located. Therefore, the first operation area is the area where the first control is located on the first page, and the second operation area is the area where the second control is located on the second page.

[0075] In some embodiments, the guidance task includes an operation path to be guided and control identifiers of multiple controls to be guided involved in the operation path, and the multiple controls to be guided are distributed in different pages.

[0076] In the above step 105 , “generating a second guide layer for covering the second page according to the guide task” can be implemented by the following steps:

[0077] 1051. Determine the next control of the first control in the operation path as the second control.

[0078] In the operation path, the first control and the second control are two adjacent controls, and the first control is triggered before the second control.

[0079] For example, the operation path is: control A -> control B -> control C -> control D, where A, B, C and D are control identifiers of different controls.

[0080] It should be noted that the control identifier of a control is fixed and remains unchanged no matter how the application APP is updated or iterated.

[0081] 1052. Determine, based on the control identifier of the second control and the page layout information of the second page, an area in the second page where the second control is located as the second operation area to be guided.

[0082] The page layout information of the second page may include control position information of multiple controls included on the second page. The page layout information of the second page may be searched based on the control identifier of the second control, thereby determining the control position information of the second control. Based on the control position information of the second control, the area on the second page where the second control is located is determined, and the area on the second page where the second control is located is determined as the second operation area to be guided.

[0083] 1053. Generate a second guide layer for covering the second page according to the position of the second operation area on the second page.

[0084] According to the position of the second operating area on the second page, the position of the second visual penetration area in the second guide layer can be determined, thereby generating a second guide layer for covering the second page.

[0085] In some optional embodiments, guidance data is generated according to the position of the second operation area on the second page, and a second guide layer is generated according to the guidance data. The guidance data may include but is not limited to: step index, highlight area coordinates and width and height, prompt box coordinate width and height, prompt box text, operation button configuration in the prompt box, and step completion status. Among them, the operation button configuration may include the shape, size, text and response configuration of the button, and the step index is used to indicate the serial number of the current guidance step. The highlighted area refers to the second operation area or the second visual penetration area. The step completion status is used to indicate whether the guidance step has been completed. The step completion status is an unfinished state before the second visual penetration area is triggered, and a completed state after the second visual penetration area is triggered. Therefore, in actual applications, the step completion status can be updated to a completed state after the second visual penetration area is triggered.

[0086] Figure 4 This is the guidance data for three guidance steps generated sequentially for the guidance task. The step index of the first guidance step is 1, the step index of the second guidance step is 2, and the step index of the third guidance step is 3.

[0087] In an embodiment of the present application, the second guide layer of the second page is generated based on the page layout information of the second page, which can improve the applicability of the solution. Regardless of whether the application is updated or iterated, this solution can be applied.

[0088] Furthermore, in actual applications, in order to provide users with personalized services, the page layout is personalized based on the user's personalized data. When the page layout of the second page is determined based on the user's personalized data, the solution provided in the embodiment of the present application can still generate an adaptive second guidance layer for the second page that can complete the guidance task.

[0089] In some embodiments, the page layout of the first page and / or the page layout of the second page are determined based on the personalized data of the user. The personalized data may include a user portrait and / or a layout mode selected by the user. The user portrait may be obtained based on an analysis of the user's historical behavior data. It should be noted that when the user is a new user, the user's historical behavior data may not be collected. At this time, the user portrait of the user may be generated based on the geographical location of the user's user terminal. The layout mode may include but is not limited to: night mode, day mode, elderly mode, young mode, etc. In actual applications, the page layout of the first page is different for different users, and the page layout of the second page is different for different users. Different page layouts refer to different positions of controls in the page. For example, taking the local life service APP as an example, the page is a first-level page, providing multiple first-level category options, such as: "Renting a House", "Finding a Job", "Local Services", etc. If it is found based on the user portrait that the user is currently looking for a job, then "Finding a Job" can be placed in the most conspicuous position on the page, for example: in the middle; if it is found based on the user portrait that the user is currently looking for a nanny, then "Local Services" can be placed in the most conspicuous position on the page, for example: in the middle.

[0090] In some embodiments, the page layout of the first page and / or the page layout of the second page is determined based on A / B testing configuration data.

[0091] A / B testing is an experimental method used to compare the effectiveness of different versions of a product or feature. A / B testing configuration data refers to all the parameters and rules that control the experiment's execution, ensuring the scientific nature and operability of the test. Based on this A / B testing configuration data, the target group to which the user belongs is determined from the experimental and control groups. The layout and content of the first and second pages are determined based on the target group to which the user belongs.

[0092] It can be seen that this solution generates the corresponding guidance layer in real time based on the layout information of the page. It can adapt to different terminal proportions, different user portraits, test data, and guidance steps under guidance tasks. It breaks away from the single and fixed model and has more advantages for complex operation paths.

[0093] In some embodiments, the above method may further include:

[0094] 107. Determine whether the second control is the last control in the operation path.

[0095] 108. When the second control is the last control in the operation path, an end control is displayed on the second guide layer, where the end control is used to end the guide process.

[0096] If the second control is the last control in the operation path, it indicates that there are no subsequent controls that require further navigation. Therefore, an end control can be displayed on the second navigation layer, and the end control is used to end the navigation process. In response to the user triggering the end control, the second navigation layer is destroyed (i.e., the second navigation layer is no longer displayed), and the navigation process ends.

[0097] It should be noted that the display position of the end control is not in the second visual penetration area, that is, the orthographic projections of the end control and the second visual penetration area on the second page have no overlapping parts.

[0098] When the second control is not the last control in the operation path, the end control is not displayed on the second guide layer.

[0099] In some embodiments, before step 105, that is, before the step of generating a second guide layer for covering the second page according to the guide task, the method may further include:

[0100] 109. Determine whether the first control is the last control in the operation path.

[0101] 110. When the first control is not the last control in the operation path, executing the step of generating a second guide layer for covering the second page according to the guide task.

[0102] 111. When the first control is the last control in the operation path, end the guidance process.

[0103] When the first control is the last control in the operation path, it indicates that there are no controls on the second page that need to be guided, and there is no need to generate a second guidance layer for guiding the second page. When the first control is not the last control in the operation path, it indicates that there are controls on the second page that need to be guided, and therefore it is necessary to generate a second guidance layer for guiding the second page.

[0104] In actual applications, prompt information and / or operable controls may also be displayed on other areas of the guide layer except for the visual penetration area. The prompt information may be used to prompt the user that the visual penetration area is operable or interactive. The operable controls may include: a "Next" control. The effect of the user clicking the "Next" control is the same as the effect of the user clicking the "visual penetration area", that is, in response to the user's triggering operation on the "Next" control located above the guide layer, the page below the guide layer is updated. Optionally, the operable controls may include: a "Complete" control. The "Complete" control is used to end the guide process. In other words, the user can exit the guide process at any time.

[0105] The following will be combined Figure 5 The flowchart shown is an example of the technical solution provided in the embodiment of the present application:

[0106] When a user clicks the icon of a local life service app and enters the app, the user's user profile, guidance tasks, A / B testing configuration data, layout mode configuration, etc. are obtained by default. Among them, the guidance tasks are background configuration data and include the operation path to be guided.

[0107] 1. Generate the page that needs to be displayed based on the user's user portrait, A / B test configuration data, and layout mode configuration.

[0108] Among them, the page content and / or page layout of the page is related to the user's user portrait, A / B test configuration data, and layout mode configuration.

[0109] 2. Generate guidance data based on the page layout and guidance tasks.

[0110] The guidance data includes: step index, highlight area coordinates and width and height, prompt box coordinates and width and height, prompt box text, prompt box operation button configuration, step completion status, etc. For example: Figure 4 The boot data corresponding to step index 1 in .

[0111] 3. Based on the guidance data, use the "SVG combined graphics to achieve hollowing effect" technology to generate a mask layer with a hollow area, a prompt box with prompt text and operation buttons.

[0112] 4. Display the page and the mask layer used to cover the page.

[0113] The controls to be guided in the page are exposed through the hollowed-out areas of the mask layer.

[0114] 5. The user follows the instructions in the prompt box, clicks on the reserved hollow area, and updates the page based on the user's user portrait, A / B test configuration data, and layout mode configuration.

[0115] 6. Determine whether the control to be guided is the last control in the operation path.

[0116] If yes, then the boot process ends; otherwise, return to step 2.

[0117] As shown above, you can now create a complete solution for dynamically generating personalized front-end navigation features based on SVG. This technical solution may be used in user interfaces that require new user guidance, key update prompts, and complex operation step guidance.

[0118] An exemplary embodiment of the present application further provides a page operation guiding device, the device comprising:

[0119] A display module, configured to display a first page;

[0120] a generating module, configured to generate a first guiding layer for covering a first page according to a preset guiding task, wherein the first guiding layer is provided with a first visually transparent area, and a first operation area to be guided on the first page is exposed through the first visually transparent area;

[0121] The display module is configured to display the first guide layer;

[0122] an updating module, configured to update the first page to a second page in response to a user triggering operation on the first visual penetration area, where the second page is a page required to be displayed in response to the triggering operation on the first operation area;

[0123] The generating module is configured to generate a second guiding layer for covering the second page according to the guiding task, wherein the second guiding layer is provided with a second visually transparent area, and a second operation area to be guided on the second page is exposed through the second visually transparent area;

[0124] The display module is used to display the second guide layer.

[0125] In the technical solution provided by the embodiment of the present application, the first visual penetration area of the first guide layer is used to expose the first operation area to be guided of the first page, so that it can play a guiding role. In addition, the user's triggering operation in the first visual penetration area will be transmitted to the first page below, and the first page will respond to the user's triggering operation in the first visual penetration area in the same way as it responds to the user's triggering operation on the first operation area, thereby updating to the second page. After entering the second page, a second guide layer for guiding the second page will continue to be generated based on the preset guidance task to continue guiding the second page. It can be seen that the technical solution provided by the embodiment of the present application can complete dynamic guidance between multiple pages, can guide functions involving cross-page operations, and improve the operation guidance effect.

[0126] Optionally, the first operation area is an area where a first control on the first page is located, and the second operation area is an area where a second control on the second page is located.

[0127] Optionally, the guidance task includes an operation path to be guided and control identifiers of multiple controls to be guided involved in the operation path, and the multiple controls to be guided are distributed in different pages;

[0128] When the generating module generates the second guiding layer for covering the second page according to the guiding task, it is specifically configured to:

[0129] determining the next control of the first control in the operation path as the second control;

[0130] Determining, according to the control identifier of the second control and the page layout information of the second page, an area on the second page where the second control is located as the second operation area to be guided;

[0131] A second guide layer for covering the second page is generated according to the position of the second operation area on the second page.

[0132] Optionally, in the operation path, the first control and the second control are two adjacent controls and the first control is triggered before the second control.

[0133] Optionally, also include:

[0134] a judging module, configured to judge whether the second control is the last control in the operation path;

[0135] The display module is configured to display an end control on the second guide layer when the second control is the last control in the operation path, wherein the end control is used to end the guide process.

[0136] Optionally, the display module is configured to not display the end control on the second guide layer when the second control is not the last control in the operation path.

[0137] Optionally, also include:

[0138] The destruction module is configured to destroy the second guide layer and end the guide process in response to a user triggering operation on the end control.

[0139] Optionally, before the step of generating a second guide layer for covering the second page according to the guide task, the generating module is further configured to:

[0140] Determine whether the first control is the last control in the operation path;

[0141] When the first control is not the last control in the operation path, performing the step of generating a second guide layer for covering the second page according to the guide task;

[0142] When the first control is the last control in the operation path, the guiding process ends.

[0143] Optionally, the page layout of the first page and / or the page layout of the second page is determined based on personalized data of the user.

[0144] Optionally, the transparency of the first visually transparent area of the first guide layer is greater than the transparency of other areas of the first guide layer.

[0145] It should be noted here that: the various devices provided in the above embodiments can implement the technical solutions described in the corresponding method embodiments above. The specific implementation principles and corresponding beneficial effects of the above modules or units can be found in the corresponding contents of the above method embodiments, which will not be repeated here.

[0146] Figure 6 FIG. 1 shows a schematic diagram of the structure of an electronic device provided by an embodiment of the present application. Figure 6 As shown, the electronic device includes a memory 1101 and a processor 1102. The memory 1101 can be configured to store various other data to support operations on the electronic device. Examples of such data include instructions for any application or method operating on the electronic device. The memory 1101 can be implemented by any type of volatile or non-volatile storage device or a combination thereof, such as static random access memory (SRAM), electrically erasable programmable read-only memory (EEPROM), erasable programmable read-only memory (EPROM), programmable read-only memory (PROM), read-only memory (ROM), magnetic memory, flash memory, magnetic disk, or optical disk.

[0147] The memory 1101 is used to store programs;

[0148] The processor 1102 is coupled to the memory 1101 and is configured to execute the program stored in the memory 1101 to implement the methods provided in the above method embodiments.

[0149] Further, if Figure 6 As shown, the electronic device also includes: a communication component 1103, a display 1104, a power component 1105, an audio component 1106 and other components. Figure 6 Only some components are shown schematically, which does not mean that the electronic device only includes Figure 6 Components shown.

[0150] Accordingly, an embodiment of the present application further provides a computer-readable storage medium storing a computer program, which, when executed by a computer, can implement the steps or functions of the methods provided in the above-mentioned method embodiments.

[0151] An embodiment of the present application also provides a computer program product, including a computer program, which, when executed by a processor, can implement the steps or functions of the methods provided in the above-mentioned method embodiments.

[0152] The device embodiments described above are merely illustrative. The units described as separate components may or may not be physically separate, and the components shown as units may or may not be physical units, i.e., they may be located in one location or distributed across multiple network units. Some or all of the modules may be selected based on actual needs to achieve the objectives of the present embodiment. Persons of ordinary skill in the art will be able to understand and implement the present invention without inventive effort.

[0153] Through the description of the above embodiments, those skilled in the art can clearly understand that each embodiment can be implemented by means of software plus a necessary general hardware platform, or of course, by hardware. Based on this understanding, the above technical solution, in essence, or the part that contributes to the prior art, can be embodied in the form of a software product. The computer software product can be stored in a computer-readable storage medium, such as ROM (Read Only Memory) / RAM (Random Access Memory), a disk, an optical disk, etc., and includes a number of instructions for enabling a computer device (which can be a personal computer, a server, or a network device, etc.) to execute the methods described in each embodiment or certain parts of the embodiments.

[0154] Finally, it should be noted that the above embodiments are only used to illustrate the technical solutions of the present application, rather than to limit it, and multiple embodiments can be combined with each other; although the present application has been described in detail with reference to the aforementioned embodiments, ordinary technicians in this field should understand that they can still modify the technical solutions recorded in the aforementioned embodiments, or make equivalent replacements for some of the technical features therein; and these modifications or replacements do not cause the essence of the corresponding technical solutions to deviate from the spirit and scope of the technical solutions of the various embodiments of the present application.

Claims

1. A page operation guidance method, characterized in that: include: Display the first page; According to a preset guidance task, a first guidance layer is generated for covering the first page, wherein the first guidance layer is provided with a first visually transparent area, and a first operation area to be guided on the first page is exposed through the first visually transparent area; displaying the first guide layer; In response to a user triggering operation on the first visually transparent area, updating the first page to a second page, where the second page is a page required to be displayed in response to the triggering operation on the first operation area; generating, according to the guidance task, a second guidance layer for covering the second page, wherein the second guidance layer is provided with a second visually transparent area, and a second operation area to be guided on the second page is exposed through the second visually transparent area; The second guide layer is displayed.

2. The method according to claim 1, characterized in that The first operation area is an area where a first control on the first page is located, and the second operation area is an area where a second control on the second page is located.

3. The method according to claim 2, characterized in that The guidance task includes an operation path to be guided and control identifiers of multiple controls to be guided involved in the operation path, wherein the multiple controls to be guided are distributed in different pages; Generating a second guide layer for covering the second page according to the guide task, including: determining the next control of the first control in the operation path as the second control; Determining, according to the control identifier of the second control and the page layout information of the second page, an area on the second page where the second control is located as the second operation area to be guided; A second guide layer for covering the second page is generated according to the position of the second operation area on the second page.

4. The method according to claim 3, characterized in that In the operation path, the first control and the second control are two adjacent controls, and the first control is triggered before the second control.

5. The method according to claim 3, characterized in that Also includes: Determine whether the second control is the last control in the operation path; When the second control is the last control in the operation path, an end control is displayed on the second guide layer, and the end control is used to end the guide process.

6. The method according to claim 5, characterized in that Also includes: When the second control is not the last control in the operation path, the end control is not displayed on the second guide layer.

7. The method according to claim 5, characterized in that Also includes: In response to the user's triggering operation on the end control, the second guide layer is destroyed, and the guide process is ended.

8. The method according to any one of claims 3 to 7, characterized in that Before the step of generating a second guide layer for covering the second page according to the guide task, the method further includes: Determine whether the first control is the last control in the operation path; When the first control is not the last control in the operation path, performing the step of generating a second guide layer for covering the second page according to the guide task; When the first control is the last control in the operation path, the guiding process ends.

9. The method according to any one of claims 1 to 7, characterized in that The page layout of the first page and / or the page layout of the second page is determined based on the personalized data of the user.

10. The method according to any one of claims 1 to 7, characterized in that The transparency of the first vision-transmitting area of the first guide layer is greater than the transparency of other areas of the first guide layer.

11. The method according to any one of claims 1 to 7, characterized in that After the first page is covered with the first guide layer, the brightness of the first visual penetration area is higher than that of other areas, and / or after the second page is covered with the second guide layer, the brightness of the second visual penetration area is higher than that of other areas.

12. An electronic device, characterized in that: include: memory and a processor, wherein The memory is used to store programs; The processor is coupled to the memory, and is configured to execute the program stored in the memory to implement the method according to any one of claims 1 to 11.

13. A computer-readable storage medium storing a computer program, characterized in that: When the computer program is executed by a computer, the method according to any one of claims 1 to 11 can be implemented.

14. A computer program product comprising a computer program, characterized in that When the computer program is executed by a processor, the method according to any one of claims 1 to 11 is implemented.

Images