Page layout management method and device, electronic equipment and computer program product
By analyzing user characteristics to select preset templates and generating personalized page layouts, the problems of difficult layout updates and poor user experience in existing technologies are solved, and flexible and personalized page display is achieved.
Patent Information
- Application Number
- CN202510946115.8
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2025-07-09
- Publication Date
- 2025-11-04
AI Technical Summary
In existing technologies, page layout and content are tightly coupled, making layout updates difficult and unreasonable layouts negatively impacting user experience.
By receiving users' page request instructions, analyzing customer characteristics, selecting the most suitable preset template, and generating personalized page layouts, including component drag-and-drop, scaling, and mapping settings, the page layout is dynamically adjusted in conjunction with the template framework and version information.
It enables flexible matching and personalized display of page layouts, reduces the difficulty of layout updates, and improves user experience and page adaptability.
Smart Images

Figure CN120892124A_ABST
Abstract
Description
Technical Field
[0001] This application relates to the field of financial technology, and more specifically, to a method, apparatus, electronic device, and computer program product for managing page layout. Background Technology
[0002] By properly configuring operational slots, the operations team can flexibly display dynamic content, such as advertisements, promotions, and news updates, in applications or websites, making good use of user interface space.
[0003] Configuring operational layouts involves the layout of pages, regions, and elements. Existing technologies have the following drawbacks: the layout method is tightly coupled with the content, requiring layout adjustments when content is updated. As business needs change and page content increases, the complexity of the layout also increases, necessitating frequent updates to the original layout, leading to greater difficulty in maintenance and updates. Furthermore, in layout design, there is an overemphasis on visual effects while neglecting user experience, resulting in a cluttered user interface and negatively impacting user experience.
[0004] There is currently no effective solution to the problems of difficulty in updating page layout and unreasonable page layout affecting user experience in related technologies. Summary of the Invention
[0005] The main objective of this application is to provide a method, apparatus, electronic device, and computer program product for managing page layout, in order to solve the problems of difficulty in updating page layout and unreasonable page layout affecting user experience in related technologies.
[0006] To achieve the above objectives, according to one aspect of this application, a page layout management method is provided. The method includes: receiving a user's page request instruction and parsing the user's customer group characteristics based on the page request instruction, wherein the page request instruction is used to request the display of a target page; determining a target template from a plurality of preset templates associated with the target page based on the customer group characteristics, wherein the plurality of preset templates are page layout templates for the target page; generating a target page layout for the target page based on the target template; and displaying the target page under the target page layout.
[0007] Optionally, multiple preset templates associated with the target page are generated in the following ways: loading the initial template of the target page according to the template version information; determining at least one component and its attribute information from the component list, and loading at least one component into the initial template according to the component's attribute information to obtain the initial preset template, wherein each component corresponds to a specific area of the target page; setting the template configuration information of the initial preset template to obtain the preset template, wherein the template configuration information includes at least one of the following: template number, priority, effective time, and customer group information; and establishing the association information between the preset template and the target page.
[0008] Optionally, determining at least one component and its attribute information from the component list, and loading at least one component into the initial template based on the component's attribute information to obtain the initial preset template includes: responding to a drag operation by a business user, dragging the selected component from the component list to the initial template to obtain the position information of the selected component on the initial template; responding to a scaling operation by a business user, scaling the selected component on the initial template to obtain the size information of the selected component on the initial template; and obtaining the initial preset template after determining the position and size information of all components in at least one component on the initial template.
[0009] Optionally, determining at least one component and its attribute information from the component list, and loading at least one component into the initial template based on the component's attribute information to obtain the initial preset template includes: responding to the business user's selection operation, determining the type of the selected component from the selected component list, and recording the selection status of each selected component; setting the mapping relationship between each selected component and the area of the target page; setting the size and position information of each selected component based on the mapping relationship and the size of the area of the target page; and loading at least one component into the initial template based on the size and position information to obtain the initial preset template.
[0010] Optionally, before loading the initial template of the target page based on the template version information, the method further includes: creating a template frame based on the version information, wherein the template frame includes at least one of the following: a title bar, a menu bar, and a fixed layout element; establishing a connection between the template frame and the version information to obtain the initial template.
[0011] Optionally, after setting the template configuration information of the initial preset template and obtaining the preset template, the method further includes: for the same preset template, displaying the preset template to different customers of the same customer group at the same time period; collecting feedback data from different customers, and adjusting the page layout of the preset template according to the feedback data.
[0012] Optionally, the method further includes: recording usage data of multiple preset templates through an integrated data analysis tool; determining the usage effect information of the preset template based on the usage data of each preset template; and adjusting the preset template based on the usage effect information of each preset template, wherein the adjustment method includes at least one of the following: deleting the preset template or adjusting the page layout of the preset template.
[0013] To achieve the above objectives, according to another aspect of this application, a page layout management apparatus is provided. The apparatus includes: a parsing unit, configured to receive a user's page request instruction and parse the user's customer group characteristics based on the page request instruction, wherein the page request instruction is used to request the display of a target page; a first determining unit, configured to determine a target template from a plurality of preset templates associated with the target page based on the customer group characteristics, wherein the plurality of preset templates are page layout templates for the target page; and a generating unit, configured to generate a target page layout for the target page based on the target template and display the target page under the target page layout.
[0014] Optionally, the device further includes a preset template generation unit, which includes: a loading module for loading an initial template of the target page according to the template version information; an initial preset template generation module for determining at least one component and its attribute information from a component list, and loading at least one component into the initial template according to the component's attribute information to obtain an initial preset template, wherein each component corresponds to a specific area of the target page; a setting module for setting the template configuration information of the initial preset template to obtain a preset template, wherein the template configuration information includes at least one of the following: template number, priority, effective time, and customer group information; and an establishment module for establishing the association information between the preset template and the target page.
[0015] Optionally, the initial preset template generation module includes: a first response submodule, used to respond to the drag operation of the business personnel, drag the selected component from the component list to the initial template, and obtain the position information of the selected component on the initial template; a second response submodule, used to respond to the scaling operation of the business personnel, scale the selected component on the initial template, and obtain the size information of the selected component on the initial template; and an initial preset template generation submodule, used to obtain the initial preset template after determining the position information and size information of all components in at least one component on the initial template.
[0016] Optionally, the initial preset template generation module includes: a third response submodule, used to respond to the selection operation of business personnel, determine the type of the selected component from the list of selected components, and record the selection status of each selected component; a mapping relationship setting submodule, used to set the mapping relationship between each selected component and the area of the target page; an information setting submodule, used to set the size information and position information of each selected component according to the mapping relationship and the size of the area of the target page; and an initial preset template loading submodule, used to load at least one component into the initial template according to the size information and position information to obtain the initial preset template.
[0017] Optionally, the apparatus further includes: a creation module for creating a template frame based on the version information before loading the initial template of the target page based on the version information, wherein the template frame includes at least one of the following: a title bar, a menu bar, and fixed layout elements; and an association establishment module for establishing an association between the template frame and the version information to obtain the initial template.
[0018] Optionally, the device further includes: a display module, used to display the preset template to different customers of the same customer group at the same time period after obtaining the preset template by setting the template configuration information of the initial preset template; and an adjustment module, used to collect feedback data from different customers and adjust the page layout of the preset template according to the feedback data.
[0019] Optionally, the device further includes: a recording unit for recording usage data of multiple preset templates using an integrated data analysis tool; a second determining unit for determining usage effect information of the preset templates based on the usage data of each preset template; and an adjusting unit for adjusting the preset templates based on the usage effect information of each preset template, wherein the adjustment method includes at least one of the following: deleting the preset template or adjusting the page layout of the preset template.
[0020] In this embodiment, a user's page request instruction is received, and the user's customer group characteristics are analyzed based on the page request instruction. The page request instruction is used to request the display of a target page. A target template is determined from multiple preset templates associated with the target page based on the customer group characteristics. The multiple preset templates are page layout templates for the target page. A target page layout for the target page is generated based on the target template, and the target page under the target page layout is displayed. By receiving the user's page request, intelligently matching the target template based on the user's customer group characteristics, and then generating a personalized page layout indicated by the target template in real time, the goal of meeting the user's needs for the page layout of the target page is achieved. This achieves the technical effect of reducing the difficulty of updating the page layout, and thus solves the problems of high difficulty in updating the page layout and unreasonable page layout affecting the user experience in related technologies. Attached Figure Description
[0021] The accompanying drawings, which form part of this application, are used to provide a further understanding of this application. The illustrative embodiments and descriptions of this application are used to explain this application and do not constitute an undue limitation of this application. In the drawings:
[0022] Figure 1 A hardware structure block diagram of a computer terminal for implementing a page layout management method is shown.
[0023] Figure 2 This is a flowchart of a page layout management method provided according to an embodiment of this application;
[0024] Figure 3 This is a schematic diagram of a page layout management device according to an embodiment of this application;
[0025] Figure 4 This is a structural block diagram of an electronic device according to an embodiment of this application. Detailed Implementation
[0026] To enable those skilled in the art to better understand the present application, the technical solutions in the embodiments of the present application will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of the present application, and not all embodiments. Based on the embodiments in the present application, all other embodiments obtained by those of ordinary skill in the art without creative effort should fall within the scope of protection of the present application.
[0027] It should be noted that the terms "first," "second," etc., in the specification, claims, and accompanying drawings of this application are used to distinguish similar objects and are not necessarily used to describe a specific order or sequence. It should be understood that such data can be interchanged where appropriate so that the embodiments of this application described herein can be implemented in orders other than those illustrated or described herein. Furthermore, the terms "comprising" and "having," and any variations thereof, are intended to cover non-exclusive inclusion; for example, a process, method, system, product, or apparatus that comprises a series of steps or units is not necessarily limited to those steps or units explicitly listed, but may include other steps or units not explicitly listed or inherent to such processes, methods, products, or apparatus.
[0028] It should be noted that the information collected in this application (including but not limited to user device information, user personal information, etc.) and data (including but not limited to data used for display, data used for analysis, etc.) are information and data authorized by the user or fully authorized by all parties. Furthermore, the collection, storage, use, processing, transmission, provision, disclosure, and application of this data all comply with relevant laws, regulations, and standards, necessary confidentiality measures have been taken, and they do not violate public order and good morals. Corresponding access points are provided for users to choose to authorize or refuse. For example, interfaces are set up between this system and relevant users or organizations, providing users with corresponding access points to choose to agree to or refuse automated decision-making results; if the user chooses to refuse, the process proceeds to the expert decision-making stage.
[0029] Example 1
[0030] According to an embodiment of this application, a page layout management method embodiment is also provided. It should be noted that the steps shown in the flowchart in the accompanying drawings can be executed in a computer system such as a set of computer-executable instructions. Also, although a logical order is shown in the flowchart, in some cases, the steps shown or described may be executed in a different order than that shown here.
[0031] The method embodiment provided in Embodiment 1 of this application can be executed on a mobile terminal, computer terminal, or similar computing device. Figure 1 A hardware structure block diagram of a computer terminal for implementing a page layout management method is shown. Figure 1 As shown, computer terminal 10 (or mobile device) may include one or more ( Figure 1 (Illustrated using 102a, 102b, ..., 102n) Processor 102 (processor 102 may include, but is not limited to, a microprocessor (MCU) or a field-programmable gate array (FPGA) processing device), memory 104 for storing data, and transmission device 106 for communication functions. In addition, it may include: a display, input / output interface (I / O interface), Universal Serial Bus (USB) port (which may be included as one of the ports of a BUS bus), network interface, power supply, and / or camera. Those skilled in the art will understand that... Figure 1 The structure shown is for illustrative purposes only and does not limit the structure of the aforementioned electronic device. For example, computer terminal 10 may also include... Figure 1 The more or fewer components shown, or having the same Figure 1 The different configurations shown.
[0032] It should be noted that the aforementioned one or more processors 102 and / or other data processing circuits are generally referred to herein as "data processing circuits". These data processing circuits may be embodied, in whole or in part, in software, hardware, firmware, or any other combination thereof. Furthermore, the data processing circuits may be a single, independent processing module, or may be integrated, in whole or in part, into any other element within the computer terminal 10 (or mobile device). As involved in the embodiments of this application, the data processing circuits serve as a processor control mechanism (e.g., selection of a variable resistor termination path connected to an interface).
[0033] The memory 104 can be used to store software programs and modules of application software, such as the program instructions / data storage device corresponding to the page layout management method in this embodiment. The processor 102 executes various functional applications and data processing by running the software programs and modules stored in the memory 104, thereby realizing the page layout management method described above. The memory 104 may include high-speed random access memory, and may also include non-volatile memory, such as one or more magnetic storage devices, flash memory, or other non-volatile solid-state memory. In some instances, the memory 104 may further include memory remotely located relative to the processor 102, and these remote memories can be connected to the computer terminal 10 via a network. Examples of such networks include, but are not limited to, the Internet, corporate intranets, local area networks, mobile communication networks, and combinations thereof.
[0034] The transmission device 106 is used to receive or send data via a network. Specific examples of the network described above may include a wireless network provided by the communication provider of the computer terminal 10. In one example, the transmission device 106 includes a Network Interface Controller (NIC), which can connect to other network devices via a base station to communicate with the Internet. In another example, the transmission device 106 may be a Radio Frequency (RF) module, used for wireless communication with the Internet.
[0035] The display can be, for example, a touchscreen liquid crystal display (LCD), which allows the user to interact with the user interface of the computer terminal 10 (or mobile device).
[0036] Under the aforementioned operating environment, this application provides the following: Figure 2 The page layout management method is shown. Figure 2 This is a flowchart of a page layout management method provided according to an embodiment of this application.
[0037] Step S201: Receive the user's page request instruction and parse the user's customer group characteristics based on the page request instruction, wherein the page request instruction is used to request the display of the target page.
[0038] A page request instruction refers to a user's instruction to the server to display a specific page when using an application or website, through interactive operations such as clicking, searching, or navigation menus. For example, in a mobile banking app, clicking "Home" triggers a page request instruction.
[0039] After receiving a page request, and with the user's authorization, the server analyzes user-related data, such as the user's age, usage habits, historical behavior, and geographical location, to identify the user's customer group and analyze its characteristics. This analysis is accomplished through front-end or back-end logic processing, such as using cookies (small text files that a website server can store on a user's browser, which the server can read to identify the user when the user visits the website again), user account information, or device information.
[0040] By identifying user requests and analyzing their customer characteristics, the goal is to intelligently match page layouts that suit the characteristics of that customer group, ensuring that the page display can be personalized and accurately meet the needs of different user groups.
[0041] Step S202: Determine the target template from multiple preset templates associated with the target page based on the characteristics of the target group, wherein the multiple preset templates are page layout templates of the target page.
[0042] The multiple preset templates refer to a series of layout schemes pre-designed and stored for the target page. Each preset template has its own template number, version, priority, effective time, and target audience information. The existence of preset templates allows the target page to be flexibly adjusted according to different usage scenarios and user group needs.
[0043] After analyzing the user's demographic characteristics, the system selects the most suitable template from multiple preset templates associated with the target page by comparing the templates' demographic information with the user's demographic characteristics. Besides demographic information, the selection process can also be based on priority, effective time, or other preset rules to ensure that the selected target template best suits the current scenario. By intelligently matching demographic characteristics with preset templates, the page layout seen by each user can be tailored to their individual needs, enhancing the application's personalization and thus improving the user experience.
[0044] Step S203: Generate the target page layout of the target page according to the target template, and display the target page under the target page layout.
[0045] After determining the target template, a specific target page layout is generated based on the component positions, sizes, and types defined in the target template, as well as other page layout information. This includes loading dynamic elements, resizing or positioning smart components, and rendering the final page layout.
[0046] Once the target page layout is generated, it will be displayed in real-time or upon the next page refresh. This allows users to see a page optimized based on their target audience characteristics and the current scenario, including, for example, specific content display, ad carousels, and prominent feature entry points. By dynamically generating and displaying the target page layout, flexible matching between content and layout is achieved, improving the dynamism and personalization of the page layout for a better user experience.
[0047] The page layout management method provided in this application receives a user's page request instruction and parses the user's customer group characteristics based on the page request instruction, wherein the page request instruction is used to request the display of a target page; a target template is determined from multiple preset templates associated with the target page according to the customer group characteristics, wherein the multiple preset templates are page layout templates of the target page; a target page layout of the target page is generated according to the target template, and the target page under the target page layout is displayed. By receiving the user's page request, intelligently matching the target template based on the user's customer group characteristics, and then generating a personalized page layout indicated by the target template in real time, the method achieves the goal of ensuring that the page layout of the target page meets the user's needs, thereby reducing the difficulty of updating the page layout and solving the problems of high difficulty in updating the page layout and unreasonable page layout affecting the user experience in related technologies.
[0048] To ensure the diversity and applicability of the target page layout, multiple preset templates need to be generated for the target page. Optionally, in the page layout management method provided in this application embodiment, the multiple preset templates associated with the target page are generated in the following way: loading the initial template of the target page according to the template version information; determining at least one component and the component's attribute information from the component list, and loading at least one component into the initial template according to the component's attribute information to obtain the initial preset template, wherein each component corresponds to a specific area of the target page; setting the template configuration information of the initial preset template to obtain the preset template, wherein the template configuration information includes at least one of the following: template number, priority, effective time, and customer group information; and establishing the association information between the preset template and the target page.
[0049] First, the initial template for the target page is loaded based on the template's version information. Version information represents the template's iteration history, helping to understand which version the current template was based on for modification or optimization. Loading the initial template provides a basic framework for subsequent component loading and layout adjustments; this framework includes the page's basic structure, styles, and existing component layouts.
[0050] Next, select at least one component and its attribute information from the component list. The component list is a resource library maintained by business operations personnel, containing all different types of components that can be used for page layout, such as ad carousels, grids, text blocks, and images. The attribute information includes, but is not limited to, parameters such as the component's size, color, and behavioral logic; these parameters determine the component's specific appearance on the page. Loading the selected component and its attribute information into the initial template allows for dynamic adjustments to the page layout, making it more diverse and adaptable to the needs of different user groups.
[0051] Next, the template configuration information for the initial preset template is set to obtain a complete preset template. The template configuration information is the core identifier of the template, including at least the template number, priority, effective time, and target audience information. The template number uniquely identifies each template, the priority determines the order in which the template is adopted among multiple options, the effective time limits the template's available time period, and the target audience information identifies the user group for which the template is most suitable. Through template configuration, it can be ensured that each template provides services to the right users at the right time and under the right conditions, thereby improving the targeting and effectiveness of the layout.
[0052] Finally, establish the association information between the preset template and the target page. This association information goes beyond simple links; it also includes the template's actual location on the page, whether it's enabled, and its interaction logic with other page elements. Through this association, the application can quickly identify and invoke the corresponding preset template when a user requests the target page, and then rapidly generate a page layout that meets the user's needs based on their demographics, improving the personalization and responsiveness of the user interface.
[0053] This embodiment determines suitable elements from the component list, loads them onto the initial template, adjusts the layout, and sets the template's configuration information. On the one hand, this simplifies page maintenance and reduces development costs. On the other hand, it intelligently matches the most suitable page layout based on individual differences, making content display more personalized and adaptable to various user scenarios, effectively enhancing user stickiness and application attractiveness.
[0054] To improve the convenience and flexibility of generating initial preset templates, optionally, in the page layout management method provided in this application embodiment, determining at least one component and its attribute information from a component list, and loading at least one component into an initial template according to the component's attribute information to obtain an initial preset template includes: responding to a drag operation by a business user, dragging a selected component from the component list to the initial template to obtain the position information of the selected component on the initial template; responding to a scaling operation by a business user, scaling the selected component on the initial template to obtain the size information of the selected component on the initial template; and obtaining the initial preset template after determining the position and size information of all components in at least one component on the initial template.
[0055] For example, the first step involves responding to drag-and-drop operations by business users. In the page layout editing interface, business users can select the desired components from the component list, such as an ad carousel, a grid display area, or a text input box, and drag the selected components directly from the component list area to the loaded initial template. This step is fundamental to component positioning. Drag-and-drop operations refer to the actions taken by business users through a graphical user interface, using a mouse or touchscreen to move components from the component list area to the template design area. Business users can freely move components on the template and determine their specific positions on the page, reducing the complex command input or code writing required in traditional editing modes.
[0056] Position information refers to the coordinates of a component recorded by the system when it is placed at a specific position on the initial template. This includes the X and Y coordinates, as well as the component's relative position to other page elements, such as left-aligned, center-aligned, or right-aligned. This information is saved as part of the template and used for generating the subsequent page layout.
[0057] The second step is to respond to scaling operations from business users. Scaling operations refer to how business users, after dragging and dropping components onto the initial template, change the size of the components on the page using the mouse wheel, pinch-to-zoom, or dedicated scaling tools. Scaling operations allow business users to manually adjust the size of components according to page design requirements. Through scaling operations, it's ensured that different types of components adapt well to different devices while maintaining visual consistency and aesthetics. For example, it ensures that components present a good visual effect whether on a large desktop computer or a small smartphone.
[0058] Among them, the size information is the width and height information of the component recorded by the application after scaling, as well as details such as whether the aspect ratio is maintained. It is an important part of the component's appearance and directly affects the readability and usability of the user interface.
[0059] The third step involves determining the position and size of all components on the initial template. The application then automatically saves the current template state, including the position and size of all components and their interaction logic with other elements in the template, ultimately generating an initial preset template. This template will serve as the base template for subsequent editing, configuration, and publishing.
[0060] This embodiment provides a more intuitive and flexible editing mode to assist business personnel in determining the position and size of components on the page through intuitive interactive operations during the page layout design process. Business personnel can freely plan the layout of components on the page through drag-and-drop and scaling operations, including the arrangement order, spacing, alignment, etc. After the business personnel have completed the position and size settings of all components, the application integrates this information to form a specific template design scheme, namely the initial preset template. On the one hand, it simplifies the page layout design process, improves efficiency, and also enhances the personalization and adaptability of the template. Business personnel do not need to master complex coding knowledge; they can flexibly adjust the layout and appearance of page elements through intuitive graphical interface operations to meet the needs of different user groups and scenarios. On the other hand, the generation of the initial preset template also provides rich materials for subsequent template configuration and intelligent matching, making page layout management and optimization more intelligent and efficient, laying a solid foundation for subsequent template configuration and page display.
[0061] To improve the automation of generating the initial preset template, optionally, in the page layout management method provided in this application embodiment, determining at least one component and its attribute information from the component list, and loading at least one component into the initial template according to the component's attribute information to obtain the initial preset template includes: responding to the selection operation of the business personnel, determining the type of the selected component from the selected component list, and recording the selection status of each selected component; setting the mapping relationship between each selected component and the area of the target page; setting the size information and position information of each selected component according to the mapping relationship and the size of the area of the target page; and loading at least one component into the initial template according to the size information and position information to obtain the initial preset template.
[0062] The first step is for business users to select one or more components from the component list using mouse clicks or multi-touch on a touchscreen. The component list is a collection maintained by the application, containing all component types available for page design, such as ad carousels, grid layouts, text boxes, and buttons. Business users can intuitively select the desired components from the list through clicks or multi-selection. The application immediately responds to these operations, recording the component type and selection status (whether it is selected and the selection order). This helps maintain the correct order and relevance of components when editing templates, allowing the application to understand and track which components have been incorporated into the current page design, preparing for subsequent layout design.
[0063] The second step is to set up the mapping relationship between each selected component and a specific area on the target page. The mapping relationship refers to the logic that connects a component to a specific area on the page; it defines the component's location within the page and clarifies which part of the page the component should appear in. For example, one component might be mapped to the ad carousel area, while another component might be placed in the function entry area. By setting up mapping relationships, business users can clearly control the layout of components on the page, thereby better organizing and presenting page content.
[0064] The third step involves setting the size and position information for each selected component based on the mapping relationship and the dimensions of the target page area. Size settings adjust the component's width, height, and other dimensions according to the target page area's dimensions and the component's type, ensuring the component is both aesthetically pleasing and functional on the page, while also considering different device screen sizes. Position settings determine the component's coordinate position within the page area, including X-axis and Y-axis offsets, and horizontal or vertical alignment, such as center, left, or top, to achieve precise component positioning on the page. This ensures that the component not only maps to the correct area but also adapts to the actual size of that area, while determining the component's specific position within the area. For example, a component might be set to occupy one-third of the width of the ad carousel area and be located at the top.
[0065] The fourth step involves integrating all components with their dimensions and positions set into the initial page template according to their mapping relationships and configuration parameters. This initial template contains the basic structure and style of the page but lacks specific content or components. By loading these components, the initial template transforms into a pre-set initial template, possessing actual content display capabilities and layout characteristics, forming a template ready for further editing and publishing. The pre-set initial template, formed after component loading, not only retains the basic framework and style of the page but also includes specific components and their attribute information, becoming a complete design solution that can be further adjusted and confirmed by business personnel or directly used for page display.
[0066] This embodiment automatically generates an initial preset template by responding to the intuitive operations of business personnel, such as selecting components, setting mapping relationships, and adjusting attribute information. Through the setting of mapping relationships, components can be more accurately positioned in the corresponding areas of the page. Combined with the adjustment of size and position information, it ensures good adaptability of page layout on different devices and user experience. This not only simplifies the page design process and lowers the operation threshold, but also greatly improves the flexibility and accuracy of page layout, enabling it to better adapt to diverse user needs and scenario changes.
[0067] To enhance the structured and version management of page layout, optionally, in the page layout management method provided in the embodiments of this application, before loading the initial template of the target page according to the version information of the template, the method further includes: creating a template frame according to the version information, wherein the template frame includes at least one of the following: a title bar, a menu bar, and fixed layout elements; establishing an association between the template frame and the version information to obtain the initial template.
[0068] Version information is data used to identify the template's iteration status. It helps the application understand which version the current template was created or edited on, thus avoiding version conflicts and ensuring template continuity and consistency. The template framework consists of a title bar, menu bar, and fixed layout elements, which form the basic structure of the page and provide a clear starting point for subsequent component loading and layout design. The title bar contains the page title or logo, the menu bar contains navigation links, and fixed layout elements may be structured designs such as sidebars and footers, which remain unchanged across different template versions.
[0069] Before designing or editing a preset page template, you first need to create a template framework based on the template's version information. Version information represents the template's iteration history, including identifiers such as the template's creation date, last modification date, and version number, used to track the template's evolution. The template framework is the template's basic structure, including fixed elements in the page layout, such as the title bar and menu bar. These elements remain consistent across different versions to ensure the page's basic appearance and functionality remain stable.
[0070] Furthermore, an association is established between the template framework and version information to ensure that each template framework has its own version identifier. This association can be established through database records or metadata tags. Establishing the association binds the template framework to specific version information, such as by creating a record in the database containing the template framework's ID (Unique Identification), version number, creation date, etc., or by adding comments or metadata tags to the template framework's code to explicitly indicate its version information. The purpose of this step is to maintain the traceability of each template version during the template design and management process, ensuring version control of the template framework, facilitating switching and comparison between different versions for business personnel and applications, and simplifying subsequent template maintenance and iteration.
[0071] Finally, by combining the template framework and version information, the application obtains an initial template. This initial template is a blank template with a basic structure, containing a title bar, menu bar, and fixed layout elements, but without any dynamic components or content. Business users can then use drag-and-drop and scaling operations to load and adjust components based on page requirements and target audience characteristics, creating specific preset templates.
[0072] This embodiment creates a template framework based on version information before generating a preset page template. An initial template is then created based on the template framework and version information. This initial template has a certain structure and layout but does not contain specific dynamic content or components. This provides a clean and clear working interface for subsequent page layout design, allowing business personnel to more intuitively see the basic structure of the page and better plan the loading and layout of dynamic components based on the initial template. On the one hand, this ensures that the page design conforms to the brand image while meeting the personalized needs of different user groups. On the other hand, it simplifies the template creation process, reduces the difficulty of version control, and improves the efficiency and accuracy of page layout. Furthermore, the association between the template framework and version information facilitates template iteration and historical version lookup, helping to maintain the consistency and stability of the page layout.
[0073] To further optimize the page layout of the preset template to better meet the needs of specific customer groups, optionally, in the page layout management method provided in the embodiments of this application, after setting the template configuration information of the initial preset template and obtaining the preset template, the method further includes: for the same preset template, displaying the preset template to different customers of the same customer group at the same time period; collecting feedback data from different customers, and adjusting the page layout of the preset template according to the feedback data.
[0074] First, after setting the initial preset template configuration information, the application will display the same preset template to different customers within the same customer group within the same time period. The same preset template refers to a specific template scheme defined through template configuration information (such as template number, priority, effective time, and customer group information). The same time period refers to the effective display period of the preset template, ensuring that all participating customers experience the page layout under the same conditions and environment, thereby reducing deviations caused by time factors. The same customer group here refers to the target user group filtered based on customer group information. They have similar characteristics or needs, such as age group, consumption habits, and geographical location. By displaying the template to the same customer group, feedback from a specific group can be collected centrally, providing targeted data support for subsequent optimization. The purpose of this operation is to test and evaluate the performance of the template in real-world application scenarios and observe the reactions and usage of different users to the page layout.
[0075] Next, feedback data from different customers on the preset template is collected. Customer feedback is gathered through built-in analytics tools or third-party data analytics services, automatically recording user interactions with the page. Simultaneously, user opinions and suggestions are proactively collected through surveys, online polls, and other methods. Feedback data includes, but is not limited to, customer behavior data (click-through rate, dwell time, scroll depth), satisfaction ratings, complaint records, or direct user comments. This data reflects the layout's usability, attractiveness, and user-friendliness, and is a key source of information for evaluating page layout effectiveness and improving the template.
[0076] Finally, based on feedback data, system or business personnel can identify potential problems or areas for improvement in the page layout, such as low click-through rates for certain components or short user dwell time. They can then make corresponding adjustments, which may include fine-tuning component layout parameters, changing component types, or completely redesigning the page. For example, rearranging component positions, adjusting sizes, optimizing color schemes, or improving interaction design can enhance user experience and conversion rates. The adjusted layout needs to be tested again to verify the effectiveness of the improvements, while continuing to collect new feedback to provide more data support for subsequent optimizations, forming a closed loop of continuous optimization.
[0077] In this example, customer feedback is collected, and the page layout of the preset template is continuously optimized based on genuine customer feedback, improving its performance and acceptance among specific customer groups. This not only enhances the dynamism and personalization of the page layout but also shortens the iteration cycle from design to optimization, reduces the failure rate caused by guessing user preferences, and establishes a user-participatory feedback channel, enabling products and services to be more closely aligned with user needs and better meet the requirements of specific customer groups.
[0078] To enable dynamic adjustment and optimization of templates, optionally, in the page layout management method provided in this application embodiment, the method further includes: recording the usage data of multiple preset templates through an integrated data analysis tool; determining the usage effect information of the preset template based on the usage data of each preset template; and adjusting the preset template based on the usage effect information of each preset template, wherein the adjustment method includes at least one of the following: deleting the preset template, or adjusting the page layout of the preset template.
[0079] First, usage data from multiple preset templates is recorded using integrated data analytics tools. Data analytics tools are software or services capable of collecting, analyzing, and reporting user behavior data. These tools are deeply integrated into the application for real-time monitoring and evaluation of the effectiveness of different preset templates. Usage data encompasses all user interaction-related data collected during the template's launch period, including but not limited to key metrics such as page views, user dwell time, click-through rate, conversion rate, and user feedback. This data reflects the template's appeal and usability to users, providing a multi-dimensional assessment of its actual performance and serving as a crucial basis for evaluating template effectiveness and making subsequent adjustments.
[0080] Next, based on the data analysis results of each preset template, its usage effectiveness information is determined. This usage effectiveness information, based on the analysis results of usage data, quantifies and describes the performance of the preset template in actual application, serving as a comprehensive evaluation of the template's effectiveness. It not only reflects the template's direct effects, such as click-through rate and conversion rate, but may also involve users' subjective evaluations of the template, such as satisfaction ratings and feedback comments.
[0081] Finally, based on the performance information of each preset template, appropriate measures are taken to adjust the preset templates. Preset templates with poor performance can be directly deleted from the system to avoid negative user experience or wasted resources. Preset templates with acceptable performance but room for improvement can have their page layout optimized by fine-tuning the layout, size, color, or interaction design of components, thereby improving user experience and page conversion efficiency. Adjustments include, but are not limited to, deleting poorly performing templates and adjusting the page layout of templates to enhance their attractiveness and usability.
[0082] This embodiment uses data analysis tools to continuously monitor and evaluate the effectiveness of preset templates, thereby achieving dynamic optimization of templates. It can quickly identify and eliminate poorly performing templates, reduce resource waste, and accurately adjust the page layout based on user feedback and behavioral data, thereby improving the page's attractiveness and conversion efficiency.
[0083] It should be noted that the steps shown in the flowchart in the accompanying drawings can be executed in a computer system such as a set of computer-executable instructions, and although a logical order is shown in the flowchart, in some cases the steps shown or described may be executed in a different order than that shown here.
[0084] Example 2
[0085] This application also provides a page layout management device. It should be noted that the page layout management device of this application can be used to execute the page layout management method provided in this application. The page layout management device provided in this application will be described below.
[0086] According to an embodiment of this application, an apparatus for implementing the above-described page layout management method is also provided. Figure 3 This is a schematic diagram of a page layout management device according to an embodiment of this application, such as... Figure 3 As shown, the device includes: a parsing unit 302, a first determining unit 304, and a generating unit 306.
[0087] The parsing unit 302 is used to receive the user's page request instruction and parse the user's customer characteristics based on the page request instruction, wherein the page request instruction is used to request the display of the target page;
[0088] The first determining unit 304 is used to determine the target template from multiple preset templates associated with the target page based on the characteristics of the target group, wherein the multiple preset templates are page layout templates of the target page;
[0089] The generation unit 306 is used to generate the target page layout of the target page according to the target template, and to display the target page under the target page layout.
[0090] The page layout management device provided in this application embodiment receives a user's page request instruction through a parsing unit 302 and parses the user's customer group characteristics based on the page request instruction, wherein the page request instruction is used to request the display of a target page; a first determining unit 304 determines a target template from multiple preset templates associated with the target page according to the customer group characteristics, wherein the multiple preset templates are page layout templates of the target page; a generating unit 306 generates a target page layout of the target page according to the target template and displays the target page under the target page layout. By receiving the user's page request, intelligently matching the target template based on the user's customer group characteristics, and then generating a personalized page layout indicated by the target template in real time, the device achieves the goal of ensuring that the page layout of the target page meets the user's needs, thereby reducing the difficulty of updating the page layout and solving the problems of high difficulty in updating the page layout and unreasonable page layout affecting the user experience in related technologies.
[0091] Optionally, in the page layout management device provided in this application embodiment, the device further includes a preset template generation unit, which includes: a loading module, used to load an initial template of the target page according to the template version information; an initial preset template generation module, used to determine at least one component and the component's attribute information from a component list, and load at least one component into the initial template according to the component's attribute information to obtain an initial preset template, wherein each component corresponds to a specific area of the target page; a setting module, used to set the template configuration information of the initial preset template to obtain a preset template, wherein the template configuration information includes at least one of the following: template number, priority, effective time, and customer group information; and an establishment module, used to establish the association information between the preset template and the target page.
[0092] Optionally, in the page layout management device provided in this application embodiment, the initial preset template generation module includes: a first response submodule, used to respond to the drag operation of the business personnel, drag the selected component from the component list to the initial template, and obtain the position information of the selected component on the initial template; a second response submodule, used to respond to the scaling operation of the business personnel, scale the selected component on the initial template, and obtain the size information of the selected component on the initial template; and an initial preset template generation submodule, used to obtain the initial preset template after determining the position information and size information of all components in at least one component on the initial template.
[0093] Optionally, in the page layout management device provided in this application embodiment, the initial preset template generation module includes: a third response submodule, used to respond to the selection operation of business personnel, determine the type of the selected component from the list of selected components, and record the selection status of each selected component; a mapping relationship setting submodule, used to set the mapping relationship between each selected component and the area of the target page; an information setting submodule, used to set the size information and position information of each selected component according to the mapping relationship and the size of the area of the target page; and an initial preset template loading submodule, used to load at least one component into the initial template according to the size information and position information to obtain the initial preset template.
[0094] Optionally, in the page layout management device provided in the embodiments of this application, the device further includes: a creation module, used to create a template frame according to the version information before loading the initial template of the target page according to the version information, wherein the template frame includes at least one of the following: a title bar, a menu bar, and fixed layout elements; and an association establishment module, used to establish an association between the template frame and the version information to obtain the initial template.
[0095] Optionally, in the page layout management device provided in the embodiments of this application, the device further includes: a display module, used to display the preset template to different customers of the same customer group at the same time period after setting the template configuration information of the initial preset template and obtaining the preset template; and an adjustment module, used to collect feedback data from different customers and adjust the page layout of the preset template according to the feedback data.
[0096] Optionally, in the page layout management device provided in the embodiments of this application, the device further includes: a recording unit, used to record the usage data of multiple preset templates through an integrated data analysis tool; a second determining unit, used to determine the usage effect information of the preset template based on the usage data of each preset template; and an adjusting unit, used to adjust the preset template based on the usage effect information of each preset template, wherein the adjustment method includes at least one of the following: deleting the preset template, or adjusting the page layout of the preset template.
[0097] It should be noted that the above-mentioned units and modules correspond to the steps in Embodiment 1, and the instances and application scenarios implemented by the corresponding steps are the same, but are not limited to the content disclosed in Embodiment 1. It should be noted that the above-mentioned modules or units may be hardware components or software components stored in memory (e.g., memory 104) and processed by one or more processors (e.g., processors 102a, 102b, ..., 102n). The above-mentioned modules may also be part of a device and can run in the computer terminal 10 provided in Embodiment 1.
[0098] Example 3
[0099] Embodiments of this application may provide an electronic device. Figure 4 This is a structural block diagram of an electronic device according to an embodiment of this application. Figure 4 As shown, the electronic device may include: one or more ( Figure 4 (Only one is shown) processor 1002, memory 1004, memory controller, and peripheral interface, wherein the peripheral interface is connected to the radio frequency module, audio module and display.
[0100] The memory can be used to store software programs and modules, such as the program instructions / modules corresponding to the methods and apparatus in the embodiments of this application. The processor executes various functional applications and data processing by running the software programs and modules stored in the memory, thereby implementing the above-described methods. The memory may include high-speed random access memory, and may also include non-volatile memory, such as one or more magnetic storage devices, flash memory, or other non-volatile solid-state memory. In some instances, the memory may further include memory remotely located relative to the processor, and these remote memories can be connected to the terminal via a network. Examples of such networks include, but are not limited to, the Internet, corporate intranets, local area networks, mobile communication networks, and combinations thereof.
[0101] The processor can access information and applications stored in the memory via a transmission device to perform the following steps: receiving a user's page request instruction and parsing the user's customer characteristics based on the page request instruction, wherein the page request instruction is used to request the display of a target page; determining a target template from multiple preset templates associated with the target page based on the customer characteristics, wherein the multiple preset templates are page layout templates for the target page; generating a target page layout for the target page based on the target template, and displaying the target page under the target page layout.
[0102] The processor can also invoke information and applications stored in the memory via a transmission device to perform the following steps: Multiple preset templates associated with the target page are generated in the following manner: the initial template of the target page is loaded according to the template version information; at least one component and its attribute information are determined from the component list, and at least one component is loaded into the initial template according to the component's attribute information to obtain an initial preset template, wherein each component corresponds to a specific area of the target page; the template configuration information of the initial preset template is set to obtain a preset template, wherein the template configuration information includes at least one of the following: template number, priority, effective time, and customer group information; and the association information between the preset template and the target page is established.
[0103] The processor can also invoke information and applications stored in the memory via a transmission device to perform the following steps: determining at least one component and its attribute information from a component list, and loading at least one component into an initial template according to the component's attribute information to obtain an initial preset template, including: responding to a drag operation by a business user, dragging the selected component from the component list to the initial template to obtain the position information of the selected component on the initial template; responding to a scaling operation by a business user, scaling the selected component on the initial template to obtain the size information of the selected component on the initial template; and obtaining the initial preset template after determining the position and size information of all components in at least one component on the initial template.
[0104] The processor can also invoke information and applications stored in the memory via a transmission device to perform the following steps: determining at least one component and its attribute information from a component list, and loading at least one component into an initial template based on the component's attribute information to obtain an initial preset template, including: responding to the selection operation of a business user, determining the type of the selected component from the selected component list, and recording the selection status of each selected component; setting a mapping relationship between each selected component and the area of the target page; setting the size and position information of each selected component based on the mapping relationship and the size of the area of the target page; and loading at least one component into the initial template based on the size and position information to obtain an initial preset template.
[0105] The processor can also invoke information and applications stored in the memory via a transmission device to perform the following steps: before loading the initial template of the target page according to the version information of the template, the method further includes: creating a template frame according to the version information, wherein the template frame includes at least one of the following: a title bar, a menu bar, and a fixed layout element; establishing an association between the template frame and the version information to obtain the initial template.
[0106] The processor can also call the information and application stored in the memory through the transmission device to perform the following steps: After setting the template configuration information of the initial preset template and obtaining the preset template, the method further includes: for the same preset template, displaying the preset template to different customers of the same customer group at the same time period; collecting feedback data from different customers, and adjusting the page layout of the preset template according to the feedback data.
[0107] The processor can also access information and applications stored in the memory via a transmission device to perform the following steps: The method further includes: recording usage data of multiple preset templates using an integrated data analysis tool; determining the usage effect information of the preset templates based on the usage data of each preset template; adjusting the preset templates based on the usage effect information of each preset template, wherein the adjustment method includes at least one of the following: deleting the preset templates, adjusting the page layout of the preset templates.
[0108] Those skilled in the art will understand that Figure 4 The structure shown is for illustrative purposes only. Electronic devices can also be smartphones, tablets, handheld computers, mobile internet devices (MIDs), PADs (tablet computers), and other terminal devices. Figure 4 This does not limit the structure of the aforementioned electronic device. For example, electronic devices may also include components that are more... Figure 4 The more or fewer components shown (such as network interfaces, display devices, etc.), or having the same Figure 4 The different configurations shown.
[0109] Those skilled in the art will understand that all or part of the steps in the various methods of the above embodiments can be implemented by a program instructing the hardware related to the terminal device. The program can be stored in a computer-readable storage medium, which may include: flash drive, read-only memory (ROM), random access memory (RAM), disk or optical disk, etc.
[0110] Example 4
[0111] Embodiments of this application also provide a storage medium. Optionally, in this embodiment, the storage medium can be used to store the program code executed by the page layout management method provided in Embodiment 1.
[0112] Optionally, in this embodiment, the storage medium may be located in any computer terminal in a group of computer terminals in a computer network, or in any mobile terminal in a group of mobile terminals.
[0113] This application also provides a computer program product, which, when executed on a data processing device, is suitable for performing page layout management method steps.
[0114] The sequence numbers of the embodiments in this application are for descriptive purposes only and do not represent the superiority or inferiority of the embodiments.
[0115] In the above embodiments of this application, the descriptions of each embodiment have different focuses. For parts not described in detail in a certain embodiment, please refer to the relevant descriptions of other embodiments.
[0116] In the several embodiments provided in this application, it should be understood that the disclosed technical content can be implemented in other ways. The device embodiments described above are merely illustrative; for example, the division of units is only a logical functional division, and in actual implementation, there may be other division methods. For example, multiple units or components may be combined or integrated into another system, or some features may be ignored or not executed. Furthermore, the displayed or discussed mutual coupling, direct coupling, or communication connection may be through some interfaces; the indirect coupling or communication connection between units or modules may be electrical or other forms.
[0117] The units described as separate components may or may not be physically separate. The components shown as units may or may not be physical units; that is, they may be located in one place or distributed across multiple network units. Some or all of the units can be selected to achieve the purpose of this embodiment according to actual needs.
[0118] Furthermore, the functional units in the various embodiments of this application can be integrated into one processing unit, or each unit can exist physically separately, or two or more units can be integrated into one unit. The integrated unit can be implemented in hardware or as a software functional unit.
[0119] If the integrated unit is implemented as a software functional unit and sold or used as an independent product, it can be stored in a computer-readable storage medium. Based on this understanding, the technical solution of this application, in essence, or the part that contributes to the prior art, or all or part of the technical solution, can be embodied in the form of a software product. This computer software product is stored in a storage medium and includes several instructions to cause a computer device (which may be a personal computer, server, or network device, etc.) to execute all or part of the steps of the methods described in the various embodiments of this application. The aforementioned storage medium includes various media capable of storing program code, such as a USB flash drive, read-only memory (ROM), random access memory (RAM), portable hard drive, magnetic disk, or optical disk.
[0120] The above description is only a preferred embodiment of this application. It should be noted that for those skilled in the art, several improvements and modifications can be made without departing from the principle of this application, and these improvements and modifications should also be considered within the scope of protection of this application.
Claims
1. A method for managing page layout, characterized in that, include: Receive a user's page request instruction, and parse the user's customer characteristics based on the page request instruction, wherein the page request instruction is used to request the display of a target page; The target template is determined from multiple preset templates associated with the target page based on the customer characteristics, wherein the multiple preset templates are page layout templates of the target page; Generate a target page layout for the target page based on the target template, and display the target page under the target page layout.
2. The method according to claim 1, characterized in that, The multiple preset templates associated with the target page are generated in the following ways: Load the initial template of the target page according to the template version information; Determine at least one component and its attribute information from the component list, and load the at least one component into the initial template according to the component's attribute information to obtain an initial preset template, wherein each component corresponds to a specific area of the target page; The initial preset template is configured with template configuration information to obtain the preset template, wherein the template configuration information includes at least one of the following: template number, priority, effective time, and customer group information; Establish the association information between the preset template and the target page.
3. The method according to claim 2, characterized in that, Determine at least one component and its attribute information from the component list, and load the at least one component into the initial template according to the component's attribute information to obtain the initial preset template, including: In response to the drag-and-drop operation of the business personnel, the selected component in the component list is dragged to the initial template to obtain the position information of the selected component on the initial template; In response to the scaling operation of the business personnel, the selected component on the initial template is scaled to obtain the size information of the selected component on the initial template; After determining the position and size information of all components in the at least one component on the initial template, the initial preset template is obtained.
4. The method according to claim 2, characterized in that, Determine at least one component and its attribute information from the component list, and load the at least one component into the initial template according to the component's attribute information to obtain the initial preset template, including: In response to the selection operation of business personnel, determine the type of the selected component from the list of selected components, and record the selection status of each selected component; Configure the mapping relationship between each selected component and the region of the target page; Based on the mapping relationship and the size of the target page area, set the size and position information of each selected component; The at least one component is loaded into the initial template based on the size and position information to obtain the initial preset template.
5. The method according to claim 2, characterized in that, Before loading the initial template of the target page based on the template version information, the method further includes: A template framework is created based on the version information, wherein the template framework includes at least one of the following: a title bar, a menu bar, and fixed layout elements; Establish the association between the template framework and the version information to obtain the initial template.
6. The method according to claim 2, characterized in that, After setting the template configuration information of the initial preset template and obtaining the preset template, the method further includes: For the same preset template, the preset template will be displayed to different customers of the same customer group at the same time period; Collect feedback data from the different customers, and adjust the page layout of the preset template based on the feedback data.
7. The method according to claim 1, characterized in that, The method further includes: The usage data of the multiple preset templates is recorded using integrated data analysis tools; The usage effect information of the preset template is determined based on the usage data of each preset template. The preset templates are adjusted based on the usage effect information of each preset template, wherein the adjustment methods include at least one of the following: deleting the preset template, or adjusting the page layout of the preset template.
8. A page layout management device, characterized in that, include: The parsing unit is used to receive a user's page request instruction and parse the user's customer characteristics based on the page request instruction, wherein the page request instruction is used to request the display of a target page; The first determining unit is configured to determine a target template from a plurality of preset templates associated with the target page based on the customer group characteristics, wherein the plurality of preset templates are page layout templates of the target page; The generation unit is used to generate the target page layout of the target page according to the target template, and to display the target page under the target page layout.
9. An electronic device, characterized in that, include: Memory, which stores executable programs; A processor for running the program, wherein the program, when running, performs the method according to any one of claims 1 to 7.
10. A computer program product comprising computer instructions, characterized in that, When the computer instructions are executed by the processor, they implement the steps of the method described in any one of claims 1 to 7.