Page switching display method and device
By identifying the user's sliding operation and using the guide area content to generate the target page, the problem of the page display content in the prior art is solved, and the user's willingness to switch pages and browsing experience is improved.
Patent Information
- Application Number
- CN202210751322.4
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2022-06-29
- Publication Date
- 2025-06-10
- Estimated Expiration
- 2042-06-29
AI Technical Summary
In the prior art, the way the application displays the page on the client side causes the content of the main page to be too rough, which reduces the user's willingness to gain in-depth understanding, and the content displayed on the switched page is too detailed, affecting the user experience.
By identifying the user's sliding operation on the main page, using the specified display content in the guide area, a card to be displayed is obtained, and a target page is generated based on the card, so as to switch the page to display the page.
It has enhanced users' willingness to switch pages, and improved users' browsing experience by generating targeted target pages, and improved the user experience as a whole.
Smart Images

Figure CN115268746B_ABST
Abstract
Description
Technical Field
[0001] The embodiments of this specification relate to the technical field of terminal page display, and particularly to a page switching and display method. Background Art
[0002] With the development of Internet technology, various application programs display pages on terminals, display corresponding information for users and interact with users to improve the user experience.
[0003] Currently, application programs are displayed on the client side. Basically, the main page displays rough information content. Users need to switch pages to display more detailed information. For example, in the application program of an e-commerce platform, the main page displays a search box and some popular product images. Users can input keywords in the search box or click on the area of the popular product image to switch pages and display more detailed information such as product price information, store information, and purchase method information.
[0004] However, such a page display method and page switching method reduce the willingness of users to switch pages for in-depth understanding because the content displayed on the main page is too rough. Moreover, the content displayed on the switched page is too detailed, affecting the browsing experience of users after page switching and reducing the user experience. Therefore, there is an urgent need for a page switching and display method that can improve the user's page switching and browsing experience. Summary of the Invention
[0005] In view of this, the embodiments of this specification provide a page switching and display method. One or more embodiments of this specification also relate to a page switching and display device, a computing device, a computer-readable storage medium, and a computer program to solve the technical defects existing in the prior art.
[0006] According to the first aspect of the embodiments of this specification, a page switching and display method is provided, which is applied to a client and includes:
[0007] Identifying a sliding operation of a user on the main page, where the main page includes a guiding area in which specified display content is played;
[0008] When the sliding operation matches the position of the guiding area, obtaining a to-be-displayed card according to the object information in the specified display content;
[0009] Generating a target page according to the to-be-displayed card and switching the main page to the target page for display.
[0010] According to the second aspect of the embodiments of this specification, a page switching and display device is provided, including:
[0011] An identification module, configured to identify a sliding operation of a user on a main page, where the main page includes a guiding area in which specified display content is played;
[0012] A to-be-displayed card acquisition module, configured to acquire a to-be-displayed card according to object information in the specified display content when the sliding operation matches the position of the guiding area;
[0013] A switching display module, configured to generate a target page according to the to-be-displayed card, and switch the main page to the target page for display.
[0014] According to a third aspect of the embodiments of the present specification, a computing device is provided, including:
[0015] A memory and a processor;
[0016] The memory is used to store computer-executable instructions, and the processor is used to execute the computer-executable instructions. When the computer-executable instructions are executed by the processor, the steps of the above-mentioned page switching display method are implemented.
[0017] According to a fourth aspect of the embodiments of the present specification, a computer-readable storage medium is provided, which stores computer-executable instructions. When the instructions are executed by a processor, the steps of the above-mentioned page switching display method are implemented.
[0018] According to a fifth aspect of the embodiments of the present specification, a computer program is provided. When the computer program is executed on a computer, the computer is made to execute the steps of the above-mentioned page switching display method.
[0019] In an embodiment of the present specification, identify a sliding operation of a user on a main page, where the main page includes a guiding area in which specified display content is played. When the sliding operation matches the position of the guiding area, acquire a to-be-displayed card according to the object information in the specified display content, generate a target page according to the to-be-displayed card, and switch the main page to the target page for display. By playing specified display content in the guiding area of the main page, the display content of the main page is made more abundant, so that the user can switch pages through a sliding operation, enhancing the user's willingness to switch pages. And acquire the to-be-displayed card corresponding to the display content and generate a target page, making the display content of the switched target page more targeted, thereby enhancing the user's browsing experience and overall enhancing the user experience. BRIEF DESCRIPTION OF THE DRAWINGS
[0020] Figure 1 is a processing flow chart of a page switching display system provided by an embodiment of the present specification;
[0021] Figure 2AIt is a flowchart of a page switching display method provided by an embodiment of this specification;
[0022] Figure 2B It is an effect diagram of single - card page display of a page switching display method provided by an embodiment of this specification;
[0023] Figure 2C It is an effect diagram of multi - card page display of a page switching display method provided by an embodiment of this specification;
[0024] Figure 2D It is an effect diagram of the display style of a favorite card of a page switching display method provided by an embodiment of this specification;
[0025] Figure 2E It is an effect diagram of the display style of a voting card of a page switching display method provided by an embodiment of this specification;
[0026] Figure 2F It is an effect diagram of the display style of a virtual reality card of a page switching display method provided by an embodiment of this specification;
[0027] Figure 2G It is an effect diagram of the display style of a panoramic display card of a page switching display method provided by an embodiment of this specification;
[0028] Figure 2H It is an effect diagram of the display style of a brand card of a page switching display method provided by an embodiment of this specification;
[0029] Figure 3 It is a flowchart of the processing process of a page switching display method applied to an e - commerce platform provided by an embodiment of this specification;
[0030] Figure 4A It is an effect diagram of the display of the guiding area of a page switching display method provided by an embodiment of this specification;
[0031] Figure 4B It is an effect diagram of the semi - screen display style of a page switching display method provided by an embodiment of this specification;
[0032] Figure 4C It is an effect diagram of the full - screen display style of a page switching display method provided by an embodiment of this specification;
[0033] Figure 5 It is a schematic structural diagram of a page switching display device provided by an embodiment of this specification;
[0034] Figure 6 It is a structural block diagram of a computing device provided by an embodiment of this specification. Detailed implementation manners
[0035] In the following description, numerous specific details are set forth in order to provide a thorough understanding of the present specification. However, the present specification may be implemented in many other ways different from those described herein, and those skilled in the art can make similar extensions without departing from the connotation of the present specification. Therefore, the present specification is not limited by the specific implementations disclosed below.
[0036] The terms used in one or more embodiments of the present specification are for the purpose of describing specific embodiments only and are not intended to limit one or more embodiments of the present specification. The singular forms "a", "the", and "said" used in one or more embodiments of the present specification and the appended claims are also intended to include the plural forms unless the context clearly dictates otherwise. It should also be understood that the term "and / or" used in one or more embodiments of the present specification refers to and encompasses any and all possible combinations of one or more of the associated listed items.
[0037] It should be understood that although the terms first, second, etc. may be used in one or more embodiments of the present specification to describe various information, such information should not be limited to these terms. These terms are only used to distinguish the same type of information from each other. For example, without departing from the scope of one or more embodiments of the present specification, the first may also be referred to as the second, and similarly, the second may also be referred to as the first. Depending on the context, the word "if" as used herein may be interpreted as "when" or "while" or "in response to determining".
[0038] First, the noun terms related to one or more embodiments of the present specification are explained.
[0039] In the present specification, a page switching display method is provided. The present specification also relates to a page switching display device, a computing device, and a computer-readable storage medium, which will be described in detail one by one in the following embodiments.
[0040] See Figure 1 , Figure 1 which shows a processing flowchart of a page switching display system according to an embodiment of the present specification.
[0041] As Figure 1As shown, the page switching display system includes an application server, a terminal, and a database. The application server pre-sends a recommended video update message to the terminal. The application client on the terminal correspondingly obtains the recommended videos in the database and stores them locally. When the user logs in to the application client, the recommended videos are played on the splash screen page. The application server sends a notification message to the client of the terminal. The client obtains the multimedia data from the database according to the address information in the notification message, generates a card to be displayed, and determines the target page. The client of the terminal recognizes the user's swiping operation on the main page, switches the main page to the target page, and displays it.
[0042] See Figures 2A - 2G , Figure 2A shows a flowchart of a page switching display method provided according to an embodiment of the present specification, which is applied to a client and includes the following specific steps.
[0043] Step 202: Recognize the user's swiping operation on the main page, where the main page includes a guidance area, and specified display content is played in the guidance area.
[0044] The client is the client of the application. The application is a multi-page architecture application that needs to perform page switching to guide the user to deeply browse the target item. For example, applications such as e-commerce platforms, online video applications, online book applications, social software applications, housing agency applications, and financial wealth management applications. The target item is the product or object information provided by the application, such as online goods, online videos, online books, social user information, housing information, financial wealth management product information, etc.
[0045] The main page is the main page of the application and is the navigation page of the application, including product catalogs, popular target items, search boxes, message page switching display components, personal information page switching display components, etc.
[0046] The specified display content is the relevant information content of the target item of the application, including information content in video form, information content in picture form, and information content in text form.
[0047] The guidance area is the playing area on the main page where the specified display content is played. The user performs a swiping operation on the guidance area to execute the page switching display instruction, generate the target page, and perform switching display.
[0048] Recognizing the user's swiping operation on the main page specifically means: recognizing the user's swiping operation on the main page of the application displayed on the terminal.
[0049] Exemplarily, the application is an application for a certain online video, and the specified display content is a promotional picture of multiple recommended popular videos. After playing the specified display content in the guiding area of the main page, the sliding operation of the user on the main page of the mobile terminal is recognized.
[0050] By recognizing the user's sliding operation on the main page, a trigger condition is provided for obtaining the card to be displayed subsequently.
[0051] Step 204: When the sliding operation matches the position of the guiding area, obtain the card to be displayed according to the object information in the specified display content.
[0052] The guiding area is a preset position on the main page. Therefore, in order to avoid accidental sliding operations by the user, it is necessary that the sliding operation matches the position of the guiding area. For example, the guiding area is on the left side of the main page. Only when the user performs a rightward sliding operation on the main page will it be determined that the user needs to switch the page display, and then the page switching display instruction is executed to generate the target page.
[0053] The object information of the specified display content is the target item information in the specified display content, including the attribute information of the target item, the target item material information, etc. For example, the specified display content is images of multiple popular products. When the user performs a sliding operation on the main page and it matches the position of the guiding area, it triggers the acquisition of the product information of multiple popular products, including the attribute information of the products (store information, product categories, products) and the product material information (videos, pictures, texts, etc.).
[0054] A card is a visual display container for data displayed on a page. By adding target item materials such as pictures, texts, and videos to it, the target item is displayed more immersively. One page can display one or more cards, and components are set on each card to allow the user to browse information in a more interactive form when the user recognizes the components or the cards. For example, on the target page, videos or images of the target item are displayed. The user clicks on the card once to perform a page-turning operation to display the text information of the target item. The user clicks on the card twice to determine the selection of the target item and then perform functions such as image magnification or video pause and skip. The user performs a sliding operation on the card to switch to the next card. The user clicks on the favorite and like components on the card, and the client performs operations such as favoriting and liking the target item of the card.
[0055] To obtain the card to be displayed according to the object information in the specified display content, the specific method is: according to the object information in the specified display content, obtain the target item materials in the specified display content from the pre-stored database, and generate the card to be displayed according to the target item materials.
[0056] Exemplarily, specify the display content as a promotional picture with multiple popular video recommendations. According to the types and storage address information of the multiple popular videos in the promotional picture, obtain the video content and video label text information (such as production staff text information, distribution staff text information, and evaluation text information, etc.) of the multiple popular videos from the remote video database. Generate the cards to be displayed for the multiple popular videos according to the popular video content and video label text information.
[0057] When the sliding operation matches the position of the guiding area, as a triggering condition, the triggering of page switching display is more accurate. At the same time, according to the object information in the specified display content, obtain the cards to be displayed, providing display data for the generation of the target page.
[0058] Step 206: Generate a target page according to the cards to be displayed, and switch the main page to the target page for display.
[0059] The target page is a card display page that is displayed after switching the main page on the terminal, and can be a single-card display page. As Figure 2B shown, Figure 2B shows the single-card page display effect diagram of a page switching display method provided according to an embodiment of this specification, and single cards are displayed in sequence on the target page.
[0060] As Figure 2C shown. Figure 2C shows the multi-card page display effect diagram of a page switching display method provided according to an embodiment of this specification, and multiple cards are displayed in a spatial arrangement on the target page: Card 1, Card 2, Card 3, Card 4, Card 5, Card 6, Card 7, Card 8, Card 9. When the target page is a multi-card display page, the user can click on one of the multiple cards to switch the multi-card display page to a single-card display page for display.
[0061] Generate a target page according to the cards to be displayed. The specific method is: add components to the cards to be displayed to generate a target page, and switch the main page to the target page for display.
[0062] Exemplarily, add a pause component, a favorite component, and a page-turning component to the cards to be displayed for the multiple popular videos to generate a target page, and switch the main page to the target page for display, so that when the user clicks on the card on the target page or the components on the card on the terminal, the corresponding operations of pausing the video, favoriting the video, and displaying the video label text information (such as production staff text information, distribution staff text information, and evaluation text information, etc.) are executed.
[0063] In the embodiments of this specification, a sliding operation of a user on the main page is recognized. The main page includes a guiding area where specified display content is played. When the sliding operation matches the position of the guiding area, a card to be displayed is obtained according to the object information in the specified display content. A target page is generated based on the card to be displayed, and the main page is switched to the target page for display. By playing specified display content in the guiding area of the main page, the display content of the main page is made more abundant, so that the user can switch pages through a sliding operation, enhancing the user's willingness to switch pages. Moreover, a card to be displayed is obtained corresponding to the display content, and a target page is generated, making the display content of the switched target page more targeted, thus enhancing the user's browsing experience and overall user experience.
[0064] Optionally, step 202 includes the following specific steps:
[0065] Recognize the sliding direction of the user's sliding operation on the main page;
[0066] When the sliding operation matches the position of the guiding area, obtaining a card to be displayed according to the object information in the specified display content includes:
[0067] When the sliding direction and the position of the guiding area meet the preset matching condition, obtain a card to be displayed according to the object information in the specified display content.
[0068] The sliding direction is the direction in which the user slides on the main page of the terminal.
[0069] The matching condition is that the sliding direction and the position direction of the guiding area on the main page are in opposite directions. For example, if the guiding area is at the upper position of the main page, when the sliding direction is from top to bottom, it meets the preset matching condition; or if the guiding area is at the right position of the main page, when the sliding direction is from right to left, it meets the preset matching condition.
[0070] When the sliding direction and the position of the guiding area meet the preset matching condition, the specific method of obtaining a card to be displayed according to the object information in the specified display content is: determine whether the direction in which the user slides on the main page of the terminal is the opposite direction of the pre-set position of the guiding area on the main page. If it is the opposite direction, obtain a card to be displayed according to the object information in the specified display content. If it is the same direction or a perpendicular direction, continue to display the main page on the terminal.
[0071] Exemplarily, the application is an application for an online car. The main page of the application for the online car is displayed on the mobile terminal. A car video of a certain model of car is displayed in the guiding area above the main page. The user swipes downwards on the main page of the terminal and determines that the direction of the downward swipe is the opposite direction to the preset position (above) of the guiding area on the main page. According to the brand information, model information, and the storage address information of the car materials of this model of car in the car video, the exterior pictures and interior pictures of this model of car, the driving video, and the new parameter text are obtained, and a display card to be displayed for this model of car is generated.
[0072] The sliding direction of the user's sliding operation on the main page is recognized, and only when the sliding direction and the position of the guiding area meet the preset matching conditions, will the display card to be displayed be obtained according to the object information in the specified display content, avoiding the user's misoperation on the main page, thereby causing a page switching display that does not meet the user's needs, improving the accuracy of the page switching display, and enhancing the user experience.
[0073] Optionally, step 202 includes the following specific steps:
[0074] Recognize the sliding distance of the user's sliding operation on the main page;
[0075] Switching the main page to the target page for display includes:
[0076] Determine the display style of the target page according to the sliding distance;
[0077] Based on the display style, display the target page.
[0078] The sliding distance is the distance that the user slides on the main page of the terminal.
[0079] The display style is the display style of the target page on the terminal, including: full-screen display style, half-screen display style, simplified display style, and rich display style. Among them, the simplified display style is the style of displaying some of the display cards to be displayed, which can be set to not play videos or display low-resolution pictures on the display cards to be displayed, thereby saving traffic consumed by the application for the user. The detailed display style is the style of displaying all the display cards to be displayed, and videos will be played normally and high-resolution pictures will be displayed on the display cards to be displayed, thereby providing users with more rich content information and enhancing the browsing experience.
[0080] Determine the display style of the target page according to the sliding distance. Specifically, if the preset display styles of the target page are full-screen display style and half-screen display style, then identify the distance that the user slides on the main page of the terminal. If it is greater than or equal to the preset sliding distance threshold, determine that the display style of the target page is the full-screen display style. If it is less than or equal to the preset sliding distance threshold, determine that the display style of the target page is the half-screen display style. Or, if the preset display styles of the target page are simplified display style and rich display style, then identify the distance that the user slides on the main page of the terminal. If it is greater than or equal to the preset sliding distance threshold, determine that the display style of the target page is the rich display style. If it is less than or equal to the preset sliding distance threshold, determine that the display style of the target page is the simplified display style.
[0081] Exemplarily, the application is an application of a housing agency. The main page of the application of the housing agency is displayed on the mobile terminal. The preset display styles of the target page are full-screen display style and half-screen display style. The guiding area is above the terminal. The screen length of the terminal is d. The identified distance that the user slides on the main page of the terminal is 0.3d. The preset sliding distance threshold is 0.4d. Since it is less than or equal to the preset sliding distance threshold, determine that the display style of the target page is the half-screen display style. Set the display length of the target page to 0.5d and display it on the terminal.
[0082] Identify the sliding distance of the user's sliding operation on the main page. According to the sliding distance, determine the display style of the target page. Based on the display style, display the target page. By determining the display style of the target page according to the user's sliding distance for display, while ensuring that the page switching display can improve the user's browsing experience, it also determines a more targeted display style of the target page according to the user's actual needs for display, improving the applicability of the page switching display and overall improving the user experience.
[0083] Optionally, step 204 includes the following specific steps:
[0084] Determine the target item attributes preset for the object information according to the object information in the specified display content;
[0085] Determine the target card style preset for the target item attributes according to the target item attributes;
[0086] Search for the card to be displayed according to the target card style.
[0087] Currently, when switching and displaying the main page, the obtained target page mainly displays the catalog of the target project and the images or text information of the target project. After the user clicks on the target project, they need to switch and display to the details page of the target project to browse more in-depth information. Such a target page with insufficient richness and interactivity cannot enhance the user's willingness to browse in-depth.
[0088] The target project attributes are the material attributes and / or service field attributes of multiple target projects in the object information. For example, when specifying the display content as a promotional video of an e-commerce platform, it contains the attribute information of multiple popular products, the corresponding brand information, and / or the video, image, and text information of the popular products.
[0089] The target card style is the preset display style of the target card, including: favorite card style, voting card style, virtual reality card style, panoramic display card style, brand card style, etc. For example, for the favorite card style, the brand information or picture of the target project needs to be displayed; for the voting card style, the picture and text information of the target project need to be displayed; for the virtual display card style, a virtual reality target project needs to be generated based on the picture of the target project; for the panoramic display card style, a panoramic display scene needs to be generated using the picture, video, and text of the target project; for the brand card style, the brand information of the target project is required.
[0090] The favorite card style is as Figure 2D shown, Figure 2D which shows the display effect diagram of the favorite card style of a page switching and display method provided according to an embodiment of this specification. Multiple target projects are displayed on the target page. First, the user clicks on the area corresponding to the target project to select the target project, and then clicks on the favorite component to perform the favorite processing on the target project.
[0091] The voting card style is as Figure 2E shown, Figure 2E which shows the display effect diagram of the voting card style of a page switching and display method provided according to an embodiment of this specification. There are two target projects on the target page: target project 1 and target project 2. The user clicks on the voting component below the target project to perform the voting processing on the target project, and the vote count comparison of the two target projects at the current moment will be displayed below the voting component.
[0092] The virtual reality card style is as Figure 2F shown, Figure 2FThe figure shows a virtual reality card style display effect diagram of a page switching display method provided according to an embodiment of this specification. The target item displayed on the target page is a computer monitor. By obtaining the picture of the monitor, a virtual reality scene of the monitor is constructed. The user can perform left and right sliding operations on the terminal, so that the display angle of the monitor changes correspondingly.
[0093] The panoramic display card style is as Figure 2G shown. Figure 2G The figure shows a panoramic display card style display effect diagram of a page switching display method provided according to an embodiment of this specification. The target item displayed on the target page is house decoration. By clicking the "Add Furniture" component below, furniture is correspondingly added to the display panel above to perform a panoramic display of the house decoration effect.
[0094] The brand card style is as Figure 2H shown. Figure 2H The figure shows a brand card style display effect diagram of a page switching display method provided according to an embodiment of this specification. The target item displayed on the target page is Brand A. The trademark of Brand A is displayed above the card, and a brand introduction video is displayed below the trademark. When the user clicks on the bottom area of the brand introduction video, brand story text is displayed.
[0095] According to the target item attribute, determine the target card style preset for the target item attribute. The specific method is: based on the material attributes and / or service field attributes of multiple target items, determine the target card style preset for the target item attribute.
[0096] Exemplarily, specify that the display content is a promotional activity publicity video of an e-commerce platform, which contains the attribute information (clothing) of multiple popular products, the corresponding brand information (Brand A, Brand B, Brand C), and the material information of popular products. According to the attribute information (clothing) of popular products, brand information (Brand A, Brand B, Brand C), and material information of popular products (text; video, picture, text; picture, text), search for the target card styles preset for the target item attribute: brand card style, panoramic display card style, and voting card style.
[0097] According to the object information in the specified display content, determine the target item attribute preset for the object information. According to the target item attribute, determine the target card style preset for the target item attribute. According to the target card style, search for the card to be displayed. For the target item attribute, determine the target card style, and then obtain a more targeted and richer style card to be displayed in the subsequent display, making the displayed content more abundant and improving the user's browsing experience.
[0098] Optionally, before step 202, the following specific steps are further included:
[0099] When the user logs in to the client, a splash page is displayed, and a recommended video is played on the splash page;
[0100] When the display duration of the splash page reaches the preset duration, the splash page is switched to the main page for display, and the recommended video is played as the specified display content in the guiding area.
[0101] The splash page is a waiting state display page designed to make the user perceive the normal startup of the application when the application starts. Usually, the preset picture of the application is displayed on the splash page. When the preset picture is displayed on the splash page, the client receives the data file of the main page from the server and then generates the main page. After the splash page is displayed for a certain period of time, it is switched to display the main page.
[0102] The recommended video is a video for recommending target projects to the user. The recommended video is pre-stored in the application client and is played on the splash page when the user logs in to the client. The recommended video is determined according to the current version number of the application and / or the user portrait. For example, the application is an application of an e-commerce platform, the current version number of the application is 6.10, and a promotion activity is launched for the application corresponding to the current version number. The recommended video of the promotion activity is determined according to the current version number of the client. Or, according to the user's historical behavior and personal settings on the application client, the user portrait is determined, and then a video with a high matching degree is determined as the recommended video.
[0103] By setting the preset duration, it is ensured that the user will not stay on the splash page for a long time. That is, when the display duration of the splash page reaches the preset duration, the splash page is switched to the main page for display, further improving the user experience.
[0104] The recommended video is played as the specified display content in the guiding area. In order to consider that the user cannot perform other operations if staying on the splash page for a long time, it is necessary to control the display time of the splash page so that the main page can be switched and displayed faster, facilitating the user to search in the search box on the main page or select the corresponding content to obtain more detailed information. However, generally, the time of the recommended video is often more than 15s, which conflicts with the preset duration of the splash page. By continuing to play as the specified display content in the guiding area of the main page after switching to display the main page, more information can be continuously provided to the user, enhancing the user's subsequent browsing willingness.
[0105] Play a recommended video in the guiding area. Specifically, according to the end timestamp of the recommended video played on the splash screen page, after switching to display the main page, continue to play the recommended video according to the end timestamp. Since the recommended video contains a large amount of object information, it is used to guide the user to switch from the main page to the target page and further browse the cards to be displayed. In order to ensure that the content of the recommended video can be played completely, it is to enhance the user's willingness to deeply browse the target project.
[0106] Exemplarily, the current version number of the application client is 6.10, and the corresponding promotional activity is the promotional activity on XX month XX day. The client pre-obtains the corresponding recommended video. When the user logs in to the client, the splash screen page is displayed and the recommended video is played on the splash screen page. When the display duration of the splash screen page reaches 5s, that is, the preset duration is reached, the end timestamp is determined to be 5s. The splash screen page is switched to the main page for display, and the recommended video is continued to be played from 5s in the guiding area.
[0107] When the user logs in to the client, a splash screen page with a recommended video played is displayed. When the display duration of the splash screen page reaches the preset duration, the splash screen page is switched to the main page for display, and the recommended video is played as the specified display content in the guiding area. This avoids the too long display time of the splash screen page, which affects the user experience. And by playing the recommended video in the guiding area after switching to display the main page, more information is provided for the user, enhancing the user's subsequent browsing willingness.
[0108] Optionally, before recognizing the user's swiping operation on the main page, the following specific steps are further included:
[0109] When the user logs in to the client, a splash screen page is displayed, and a recommended video is played in the splash screen page;
[0110] In the case of receiving a notification message sent by the server, according to the address information carried in the notification message, obtain the target multimedia file;
[0111] Switch the splash screen page to the main page for display, and play the multimedia file as the specified display content in the guiding area.
[0112] The server is the server of the application.
[0113] The multimedia file is the target project material, which can be a video, an image, text, etc.
[0114] The notification message is the address information sent by the server to the client containing the storage location of the target project material, so that the client can obtain the corresponding target project material from the target project material database.
[0115] Specifically, when a user logs in to the client, a splash screen page with a recommended video playing is displayed. In the case of receiving a notification message sent by the server, according to the address information of the storage location of the target project material carried in the notification message, the target multimedia file is obtained from the target project material database, the splash screen page is switched to the main page for display, and the multimedia file is played as the specified display content in the guidance area.
[0116] Exemplarily, the application is a financial management application. When a user logs in to the client, a splash screen page with recommended foods of popular financial products is displayed. In the case of receiving a notification message sent by the server of the financial management application, according to the address information of the storage location of the pictures (trend charts) and texts (contents of financial products, precautions, etc.) of the financial products carried therein, the pictures and texts are obtained from the financial product pictures and texts database, the splash screen page is switched to the main page for display, and the pictures and texts are played in the guidance area of the main page.
[0117] In the case of receiving a notification message sent by the server, according to the address information carried in the notification message, the multimedia file is obtained, and the multimedia file is played as the specified display content in the guidance area. This can enable the user to accurately obtain the target multimedia file as the specified display content, and then display more vivid content on the home page, enhancing the user's willingness to slide the main page to switch to display the target page and improving the user experience.
[0118] Optionally, playing the multimedia file as the specified display content in the guidance area includes the following specific steps:
[0119] Taking the multimedia file as the specified display content, according to the preset playing parameters, play the specified display content in the guidance area.
[0120] The playing parameters are the playing parameters set corresponding to the type of the multimedia file. For example, if the multimedia file is multiple pictures, the playing parameters correspond to the playing sequence parameters of the multiple pictures, that is, the playing order, the resolution parameters of the multiple pictures, and the playing time parameters of the multiple pictures (the playing duration of a single picture and the playing interval duration between multiple pictures). If the multimedia file is a video, the playing parameters correspond to the playing duration parameter of the video, the resolution parameter of the video, etc.
[0121] Specifically, taking the multimedia file as the specified display content, determine the corresponding preset playing parameters according to the type of the multimedia file, and play the specified display content in the guidance area according to the playing parameters.
[0122] Exemplarily, the multimedia file is pictures of multiple books. According to the type of the multimedia file being pictures, the corresponding preset playback parameters are determined: playback sequence parameter: Picture 1 - Picture 3 - Picture 2..., picture resolution parameter: 720:480; the playback duration of a single picture is 1 s, and the playback interval duration is 0.5 s.
[0123] By determining that the multimedia file is the specified display content, richer and more vivid content is provided for the user, thereby enhancing the user's willingness to perform a sliding operation to switch to the display target page, improving the user experience. According to the preset playback parameters, the specified display content is played in the guidance area to ensure the playback effect of the specified display content, thereby enhancing the user experience.
[0124] Optionally, step 206 includes the following specific steps:
[0125] Obtain a preset interaction component;
[0126] Add the preset interaction component to the card to be displayed to generate a target page.
[0127] An interaction component is a component through which the user can interact with the target item. Through the interaction component, the user can implement the interaction function for the target item on the terminal. For example, a purchase component, a sharing component, a favorite component, etc.
[0128] Specifically, according to the type of the card to be displayed, obtain the preset interaction component from the preset component library, and add the preset interaction component to the card to be displayed to generate a target page.
[0129] Exemplarily, the preset component library includes a purchase component, a sharing component, a favorite component, etc. The card to be displayed is a brand card, and the user can favorite and share the brand. Therefore, the favorite component and the sharing component are determined from the preset component library, and the processing instructions for favoriting and sharing are bound to the corresponding card to be displayed.
[0130] By adding an interaction component to the card to be displayed to generate a target page, a card to be displayed with diverse interaction functions can be quickly generated, improving the generation efficiency of the card to be displayed, and enabling the card to be displayed to execute the corresponding interaction function, further enriching the functionality of the target page, enhancing the user's willingness to browse more deeply, and improving the user experience.
[0131] Optionally, after step 206, the following specific steps are further included:
[0132] Collect the operation data of the user's operation on the preset interaction component;
[0133] Send the operation data to the server so that the server can determine and update the specified display content according to the operation data;
[0134] Receive the updated specified display content sent by the server and store the updated specified display content so that the updated specified display content is displayed when the user logs in to the client again.
[0135] The operation data is data collected from the operations of multiple users on a preset interactive component, including the total number of collections, the total number of likes, the total number of purchases, etc. For example, multiple users perform a collection operation on a target item corresponding to a certain card through the interactive component on the client, and obtain the total number of collections of the target item by multiple users.
[0136] By storing the updated specified display content, when the user logs in to the client next time, it is directly displayed on the splash screen, thus eliminating the need to obtain it from the server again, reducing the user waiting time, and enhancing the user experience.
[0137] The server determines the updated specified display content according to the operation data. The specific method is: according to the operation data, determine the popular target items, and according to the popular target items, determine the updated specified display content.
[0138] Exemplarily, the operation data is the total number of purchases. Multiple users perform a purchase operation on a product corresponding to a certain product card through the purchase component on the client of the application program on the e-commerce platform, and obtain the total number of purchases of the product by multiple users. The total number of purchases of the product is sent to the server. The server determines whether the product is a popular product according to the total number of purchases. If it is a popular product, obtain the multimedia file of the popular product as the updated specified display content and send it to the client. After receiving the updated specified display content, the client stores it in the client. When the user logs in to the client again, it is displayed on the product page.
[0139] By collecting the operation data of the user's operations on the preset interactive component and determining the updated specified display content, it is ensured that the updated specified display content is determined according to the user's operations, making the specified display content more targeted, enhancing the user experience, and storing it after receiving the updated specified display content, reducing the user waiting time, and further enhancing the user experience.
[0140] Optionally, step 206 includes the following specific steps:
[0141] Identify each basic component in the card to be displayed;
[0142] For each basic component, bind the corresponding processing instruction respectively.
[0143] The basic component is an enabling component of the card. Through the enabling component, the displayed card can execute corresponding processing functions through the user on the terminal. For example, a selection component, a magnification component, a play / pause component, a rotation component, etc.
[0144] The processing instructions are functional instructions corresponding to the basic components. For example, selecting a component corresponds to selecting a target item, magnifying a component corresponds to magnifying and displaying the images and texts on the card, playing / pausing a component corresponds to playing or pausing the video on the card, and rotating a component corresponds to rotating the image on the card.
[0145] Specifically, identify the type of the card to be displayed, obtain the preset basic components from the preset component library, and bind the corresponding processing instructions to the card to be displayed.
[0146] Exemplarily, the preset component library includes a selection component, a magnification component, a play / pause component, a rotation component, etc. The card to be displayed is a virtual reality card, and it is necessary to display the virtual reality scene of the target item on the target page, and the virtual reality card can be magnified by clicking on the corresponding area and rotated by swiping on the corresponding area. Therefore, the magnification component and the rotation component are determined, and the magnification component and the rotation component are added to the virtual reality card to generate the target page.
[0147] By binding the processing instructions for the basic components to the card to be displayed, the card to be displayed with diverse processing functions can be quickly generated through the corresponding components, which improves the generation efficiency of the card to be displayed, and enables the card to be displayed to execute the corresponding processing functions, further enriching the functional richness of the target page, enhancing the user's willingness to browse more deeply, and improving the user experience.
[0148] The following combines the attached Figure 3 , taking the application of the page switching and display method provided in this specification in an e-commerce platform as an example, to further illustrate the page switching and display method. Among them, Figure 3 FIG. shows the processing procedure flowchart of a page switching and display method applied to an e-commerce platform provided in an embodiment of this specification, which specifically includes the following steps.
[0149] Step 302: Obtain recommended videos;
[0150] The recommended videos are the recommended videos of the promotional activities of the e-commerce platform, and the recommended videos include the product information of multiple popular products.
[0151] Step 304: When the user logs in to the client of the e-commerce platform, display a splash page with the recommended video playing;
[0152] Step 306: When the display duration of the splash page reaches the preset duration, switch the splash page to the main page for display, and continue to play the recommended video in the guiding area;
[0153] Step 308: Identify the sliding distance of the user's sliding operation on the main page;
[0154] Step 310: When the sliding distance is greater than or equal to the preset distance, determine that the display style of the target page is the full-screen display style;
[0155] Step 312: When the sliding distance is less than the preset distance, determine that the display style of the target page is the half-screen display style;
[0156] Step 314: Determine the target card style preset for the product attribute according to the product attribute in the product information;
[0157] Step 316: Generate a product card according to the target card style;
[0158] After obtaining the display effect of the product card according to the target card style, correspondingly add interactive components such as sharing, collecting, adding to shopping cart, and purchasing, and basic components such as clicking, sliding, and long pressing.
[0159] Step 318: Display the target page based on the display style and the product card.
[0160] In the embodiments of this specification, by playing a recommended video in the guiding area of the main page, the display content of the main page is made more abundant, so that the user can perform page switching through a sliding operation, which improves the user's willingness to perform page switching. Moreover, different sliding distances correspond to different display styles of the target page, which improves the applicability of page switching display. And the card to be displayed is obtained corresponding to the display content. According to the product attribute, the target card style is determined, and then a more targeted and richer style product card is obtained, making the content displayed on the target page more abundant, improving the user's browsing experience, and thus overall improving the user experience.
[0161] See Figures 4A - 4C , Figure 4A shows the guiding area display effect diagram of a page switching display method provided according to an embodiment of this specification.
[0162] As Figure 4A shown, a guiding area is displayed above the main page, specified display content is displayed in the guiding area, a search box and a search component are displayed below the guiding area. By entering a keyword in the search box and clicking the search component, a search result page corresponding to the keyword is obtained, and the main page is replaced with the search result page for display. Multiple current popular target project pictures are displayed below the search box, and the user switches the main page to the details page of the target project by clicking the target project picture. A product catalog page switching display component, a message page switching display component, and a personal information page switching display component are set at the bottom of the main page. By clicking any component, the main page is switched to the corresponding page.
[0163] Figure 4BShows the rendering of the half-screen display style of a page switching display method provided according to an embodiment of this specification.
[0164] As Figure 4B shown, based on the display of the main page of Figure 4A , a target page containing cards is generated, and the target page is displayed in the upper half-screen area of the original main page. While retaining the content of the original main page, the content of the original main page is translated downward, and the positions of the product catalog page switching display component, the message page switching display component, and the personal information page switching display component in the main page remain unchanged.
[0165] Figure 4C Shows the rendering of the full-screen display style of a page switching display method provided according to an embodiment of this specification.
[0166] As Figure 4B shown, based on the display of the main page of Figure 4A , a target page containing cards is generated, and the target page replaces all the content of the main page for display.
[0167] Corresponding to the above method embodiment, this specification also provides an embodiment of a page switching display device. Figure 5 Shows the structural schematic diagram of a page switching display device provided according to an embodiment of this specification. As Figure 5 shown, the device includes:
[0168] An identification module 502, configured to identify the sliding operation of the user on the main page, where the main page includes a guidance area, and specified display content is played in the guidance area;
[0169] A to-be-displayed card obtaining module 504, configured to obtain the to-be-displayed card according to the object information in the specified display content when the sliding operation matches the position of the guidance area;
[0170] A switching display module 506, configured to generate a target page according to the to-be-displayed card, and switch the main page to the target page for display.
[0171] Optionally, the identification module 502 is further configured to:
[0172] Identify the sliding direction of the user's sliding operation on the main page;
[0173] Correspondingly, the to-be-displayed card obtaining module 504 is further configured to:
[0174] Obtain the to-be-displayed card according to the object information in the specified display content when the sliding direction and the position of the guidance area meet the preset matching condition.
[0175] Optionally, the recognition module 502 is further configured to:
[0176] Recognize the sliding distance of the user's sliding operation on the main page;
[0177] Correspondingly, the switching display module 506 is further configured to:
[0178] Determine the display style of the target page according to the sliding distance, and display the target page based on the display style.
[0179] Optionally, the to-be-displayed card acquisition module 504 is further configured to:
[0180] Determine the target item attribute preset for the object information according to the object information in the specified display content, determine the target card style preset for the target item attribute according to the target item attribute, and search for the to-be-displayed card according to the target card style.
[0181] Optionally, the device further includes:
[0182] A recommended video playback module, configured to display a splash screen page when the user logs in to the client, where a recommended video is played in the splash screen page. When the display duration of the splash screen page reaches a preset duration, the splash screen page is switched to the main page for display, and the recommended video is used as the specified display content to be played in the guidance area.
[0183] Optionally, the device further includes:
[0184] A multimedia file playback module, configured to display a splash screen page when the user logs in to the client, where a recommended video is played in the splash screen page. When receiving a notification message sent by the server, obtain a target multimedia file according to the address information carried in the notification message, switch the splash screen page to the main page for display, and use the multimedia file as the specified display content to be played in the guidance area.
[0185] Optionally, the multimedia file playback module is further configured to:
[0186] Use the multimedia file as the specified display content and play the specified display content in the guidance area according to the preset playback parameters.
[0187] Optionally, the switching display module 506 is further configured to:
[0188] Obtain a preset interaction component, add the preset interaction component to the to-be-displayed card, and generate a target page.
[0189] Optionally, the device further includes:
[0190] The operation data processing module is configured to collect operation data of a user's operations on a preset interaction component, send the operation data to a server, so that the server determines to update specified display content according to the operation data, receive the updated specified display content sent by the server, and store the updated specified display content, so that the updated specified display content is displayed when the user logs in to the client again.
[0191] Optionally, the switching display module 506 is further configured to:
[0192] Identify each basic component in the card to be displayed, and respectively bind corresponding processing instructions for each basic component.
[0193] In the embodiment of the present specification, identify the sliding operation of the user on the main page. Among them, the main page includes a guiding area, and specified display content is played in the guiding area. When the sliding operation matches the position of the guiding area, obtain the card to be displayed according to the object information in the specified display content, generate a target page according to the card to be displayed, and switch the main page to the target page for display. By playing specified display content in the guiding area of the main page, the display content of the main page is made more abundant, so that the user can perform page switching through the sliding operation, enhancing the user's willingness to perform page switching. And obtain the card to be displayed according to the corresponding display content, generate the target page, making the display content of the switched target page more targeted, thus enhancing the user's browsing experience and overall enhancing the user experience.
[0194] The above is a schematic solution of a page switching display device in this embodiment. It should be noted that the technical solution of this page switching display device and the technical solution of the above page switching display method belong to the same concept. For the details not described in the technical solution of the page switching display device, reference can be made to the description of the technical solution of the above page switching display method.
[0195] Figure 6 The structural block diagram of a computing device provided according to an embodiment of the present specification is shown. The components of the computing device 600 include, but are not limited to, a memory 610 and a processor 620. The processor 620 is connected to the memory 610 through a bus 630, and the database 650 is used to store data.
[0196] The computing device 600 also includes an access device 640, which enables the computing device 600 to communicate via one or more networks 660. Examples of such networks include the Public Switched Telephone Network (PSTN), Local Area Network (LAN), Wide Area Network (WAN), Personal Area Network (PAN), or a combination of communication networks such as the Internet. The access device 640 may include one or more of any type of wired or wireless network interfaces (e.g., Network Interface Controller (NIC)), such as IEEE 802.11 Wireless Local Area Networks (WLAN) wireless interfaces, World Interoperability for Microwave Access (Wi-MAX) interfaces, Ethernet interfaces, Universal Serial Bus (USB) interfaces, cellular network interfaces, Bluetooth interfaces, Near Field Communication (NFC) interfaces, and so on.
[0197] In one embodiment of the present specification, the above components of the computing device 600 and Figure 6 other components not shown may also be connected to each other, for example, via a bus. It should be understood that Figure 6 the block diagram of the computing device shown is for illustrative purposes only and is not a limitation on the scope of the present specification. Those skilled in the art can add or replace other components as needed.
[0198] The computing device 600 can be any type of stationary or mobile computing device, including mobile computers or mobile computing devices (e.g., tablet computers, personal digital assistants, laptop computers, notebook computers, netbooks, etc.), mobile phones (e.g., smartphones), wearable computing devices (e.g., smartwatches, smart glasses, etc.) or other types of mobile devices, or stationary computing devices such as desktop computers or PCs. The computing device 600 can also be a mobile or stationary server.
[0199] Wherein, the processor 620 is used to execute the following computer-executable instructions, and when the computer-executable instructions are executed by the processor, the steps of the above page switching display method are implemented.
[0200] The above is a schematic solution of a computing device according to this embodiment. It should be noted that the technical solution of this computing device and the technical solution of the above page switching display method belong to the same concept. For the details not described in detail in the technical solution of the computing device, reference can be made to the description of the technical solution of the above page switching display method.
[0201] An embodiment of this specification also provides a computer-readable storage medium, which stores computer-executable instructions. When the computer-executable instructions are executed by a processor, the steps of the above page switching display method are implemented.
[0202] The above is a schematic solution of a computer-readable storage medium according to this embodiment. It should be noted that the technical solution of this storage medium and the technical solution of the above page switching display method belong to the same concept. For the details not described in detail in the technical solution of the storage medium, reference can be made to the description of the technical solution of the above page switching display method.
[0203] An embodiment of this specification also provides a computer program. When the computer program is executed on a computer, the computer is made to execute the steps of the above page switching display method.
[0204] The above is a schematic solution of a computer program according to this embodiment. It should be noted that the technical solution of this computer program and the technical solution of the above page switching display method belong to the same concept. For the details not described in detail in the technical solution of the computer program, reference can be made to the description of the technical solution of the above page switching display method.
[0205] The above describes specific embodiments of this specification. Other embodiments are within the scope of the appended claims. In some cases, the actions or steps recited in the claims can be performed in a different order than in the embodiments and still achieve the desired results. Additionally, the processes depicted in the figures do not necessarily require the particular order or sequential order shown to achieve the desired results. In certain embodiments, multitasking and parallel processing are also possible or may be advantageous.
[0206] The computer instructions include computer program code, which can be in the form of source code, object code, executable files, or some intermediate forms, etc. The computer-readable medium can include: any entity or device capable of carrying the computer program code, recording medium, USB flash drive, mobile hard disk, magnetic disk, optical disk, computer memory, read-only memory (ROM, Read-Only Memory), random access memory (RAM, Random Access Memory), electrical carrier signals, telecommunication signals, and software distribution media, etc.
[0207] It should be noted that, for the foregoing method embodiments, for the sake of simplicity of description, they are all expressed as a series of action combinations. However, those skilled in the art should know that the embodiments of this specification are not limited by the described action sequence, because according to the embodiments of this specification, certain steps can be performed in other sequences or simultaneously. Secondly, those skilled in the art should also know that the embodiments described in the specification are all preferred embodiments, and the actions and modules involved are not necessarily essential to the embodiments of this specification.
[0208] In the above embodiments, the descriptions of the respective embodiments have their own focuses. For the parts not detailed in a certain embodiment, reference can be made to the relevant descriptions of other embodiments.
[0209] The preferred embodiments of this specification disclosed above are only used to help explain this specification. The alternative embodiments do not describe all the details in detail, nor do they limit the invention to the specific embodiments described. Obviously, many modifications and variations can be made according to the content of the embodiments of this specification. This specification selects and specifically describes these embodiments to better explain the principles and practical applications of the embodiments of this specification, so that those skilled in the art can well understand and utilize this specification. This specification is only limited by the claims and their full scope and equivalents.
Claims
1. A page switching display method, applied to a client, the method comprises: identifying a sliding distance of a sliding operation performed by a user on a main page, wherein the main page includes a guiding area, and designated display content is played in the guiding area; when the sliding operation matches the position of the guiding area, obtaining target project materials in the designated display content from a pre-stored database according to object information in the designated display content, and generating a to-be-displayed card according to the target project materials; generating a target page according to the to-be-displayed card, determining a display style of the target page according to the sliding distance, and based on the display style, switching the main page to the target page for display.
2. The method according to claim 1, wherein obtaining target project materials in the designated display content from a pre-stored database according to object information in the designated display content, and generating a to-be-displayed card according to the target project materials comprises: determining a target project attribute preset for the object information according to the object information in the designated display content; determining a target card style preset for the target project attribute according to the target project attribute; searching for a to-be-displayed card according to the target card style.
3. The method according to claim 1, before identifying the sliding distance of the sliding operation performed by the user on the main page, further comprises: when the user logs in to the client, displaying a splash page, wherein a recommended video is played in the splash page; when the display duration of the splash page reaches a preset duration, switching the splash page to the main page for display, and playing the recommended video as the designated display content in the guiding area.
4. The method according to claim 1, before identifying the sliding distance of the sliding operation performed by the user on the main page, further comprises: when the user logs in to the client, displaying a splash page, wherein a recommended video is played in the splash page; when receiving a notification message sent by a server, obtaining a target multimedia file according to address information carried in the notification message; switching the splash page to the main page for display, and playing the multimedia file as the designated display content in the guiding area.
5. The method according to claim 4, wherein playing the multimedia file as the designated display content in the guiding area comprises: taking the multimedia file as the designated display content and playing the designated display content in the guiding area according to preset playing parameters.
6. The method according to claim 1, wherein based on the display style, switching the main page to the target page for display comprises: obtaining a preset interactive component; adding the preset interactive component to the to-be-displayed card to generate a target page.
7. The method according to claim 6, after switching the main page to the target page for display, further comprises: Collect the operation data of the user's operation on the preset interaction component; Send the operation data to the server so that the server determines to update the specified display content according to the operation data; Receive the updated specified display content sent by the server and store the updated specified display content so that the user can display the updated specified display content when logging in to the client again.
8. The method according to claim 1, generating a target page according to the card to be displayed, comprising: Identify each basic component in the card to be displayed; For each of the basic components, bind corresponding processing instructions respectively.
9. A page switching display device, comprising: An identification module configured to identify the sliding distance of the user's sliding operation on the main page, wherein the main page includes a guide area in which specified display content is played; A card-to-be-displayed obtaining module configured to, when the sliding operation matches the position of the guide area, obtain the target item material in the specified display content from a pre-stored database according to the object information in the specified display content, and generate a card to be displayed according to the target item material; A switching display module configured to generate a target page according to the card to be displayed, determine the display style of the target page according to the sliding distance, and based on the display style, switch the main page to the target page and display it.
10. A computing device, comprising: A memory and a processor; The memory is used to store computer-executable instructions, and the processor is used to execute the computer-executable instructions. When the computer-executable instructions are executed by the processor, the steps of the page switching display method according to any one of claims 1 to 8 are implemented.
11. A computer-readable storage medium storing computer-executable instructions, and when the computer-executable instructions are executed by a processor, the steps of the page switching display method according to any one of claims 1 to 8 are implemented.
Citation Information
Patent Citations
Method and device for displaying application flash screen image
CN106469073A
Page display method and device, electronic equipment and storage medium
CN114185629A
Content acquisition method and device, storage medium and electronic equipment
CN114470751A