Page component configuration system and method

By introducing the multi-terminal adaptation layer, AI recommendation layer and free configuration layer into the page component configuration system, the problem of insufficient smart and flexible SaaS component automatic configuration page operation is solved, multi-terminal adaptation and AI intelligent recommendation are realized, and the flexibility of configuration is improved. flexibility, personalization and efficiency.

CN119356676APending Publication Date: 2025-01-24BEIJING QIHOOD TECHNOLOGY CO LTD

Patent Information

Application Number
CN202411896342.6
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2024-12-23
Publication Date
2025-01-24

AI Technical Summary

Technical Problem

The existing technology is not intelligent and flexible enough in the automatic configuration page operation of SaaS components, and it is difficult to meet the needs of rapid iteration in multiple scenarios, and it is not intelligent, lack of flexibility, efficiency bottlenecks and other problems.

Method used

A page component configuration system is proposed, including multi -end adaptation layer, AI recommendation layer and free configuration layer. The multi -end adaptation layer response service selection instruction is selected to generate terminal adaptation code; the AI ​​recommendation layer is based on the target configuration plan for generating a preset component combination based on the target large model;

Benefits of technology

Multi -end adaptation and AI intelligent recommendations have been achieved, which improves the flexibility, personalization and efficiency of page component configuration, reduces duplicate development work, and improves user experience and response speed.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN119356676A_ABST
    Figure CN119356676A_ABST
Patent Text Reader

Abstract

The invention discloses a page component configuration system and method, relates to the technical field of software development, and discloses a page component configuration system which comprises a multi-terminal adaptation layer, an AI recommendation layer and a free configuration layer. The multi-terminal adaptation layer is used for determining a currently selected target service in response to a service selection instruction and generating a terminal adaptation code corresponding to a target client; the AI recommendation layer is used for generating a target configuration scheme of preset component combination arrangement for the target service based on a target large model; and the free configuration layer is used for generating an effect display page according to the terminal adaptation code and the target configuration scheme. By means of the mode, multiple different device types can be adapted to perform SaaS component configuration based on the multi-terminal adaptation layer, a configuration scheme which is more flexible and more conforms to different user habits can be performed based on the AI, the flexibility and personalization of page component configuration are improved, and the configuration efficiency is improved.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present application relates to the field of software development technology, and in particular to a page component configuration system and method. Background Art

[0002] With the rapid development of SaaS technology, front-end componentization and multi-terminal adaptation are gradually improving the key requirements of development efficiency and user experience. Traditional application software development relies on fixed components, rules or hard coding, which is difficult to meet the rapid iteration requirements of multi-terminal scenarios (such as Web, APP). At the same time, with the popularization of artificial intelligence technology, more and more companies hope to empower product applications through AI to make them more intelligent and automated. Existing technologies have problems such as difficulty in multi-terminal adaptation, insufficient intelligence, lack of flexibility, and efficiency bottlenecks.

[0003] The above contents are only used to assist in understanding the technical solution of the present application and do not constitute an admission that the above contents are prior art. Summary of the invention

[0004] The main purpose of this application is to provide a page component configuration system and method, aiming to solve the technical problem that the automatic configuration page operation of SaaS components is not intelligent and flexible enough.

[0005] To achieve the above objectives, the present application proposes a page component configuration system, the system comprising: a multi-terminal adaptation layer, an AI recommendation layer and a free configuration layer; The multi-terminal adaptation layer is used to respond to the service selection instruction, determine the currently selected target service, and generate a terminal adaptation code corresponding to the target client; The AI ​​recommendation layer is used to generate a target configuration scheme for the target service based on the target macro model and the combination and arrangement of preset components; The free configuration layer is used to generate an effect display page according to the terminal adaptation code and the target configuration solution.

[0006] Optionally, the multi-terminal adaptation layer is further used to respond to a service selection instruction, determine the target service and the current device type according to the service selection instruction; generate a terminal adaptation code corresponding to the target client according to the current device type and send it to the free configuration layer.

[0007] Optionally, the multi-terminal adaptation layer is further used to define component configuration rules of the target middleware format according to the current device type; determine the terminal adaptation code corresponding to the target client according to the component configuration rules and send it to the free configuration layer.

[0008] Optionally, the AI ​​recommendation layer is also used to obtain the behavior data of the current user; analyze the behavior data based on the target big model to obtain user behavior information; generate a target configuration plan for the target service with preset component combination layout according to the user behavior information and send it to the free configuration layer.

[0009] Optionally, the AI ​​recommendation layer is also used to process the behavior data through a target collaborative filtering algorithm to obtain behavior summary information; and analyze the behavior summary information through a target large model to obtain user behavior information.

[0010] Optionally, the AI ​​recommendation layer is also used to determine user preference information and user habit information based on the user behavior information; generate a target configuration scheme for the preset component combination layout for the target service based on the user preference information and user habit information and send it to the free configuration layer.

[0011] Optionally, the AI ​​recommendation layer is further used to determine an optimization recommendation scheme based on the real-time update data sent by the multi-terminal adaptation layer when receiving the real-time update data; update the target configuration scheme according to the optimization recommendation scheme and send it to the free configuration layer.

[0012] Optionally, the AI ​​recommendation layer is also used to determine user adjustment information according to the personalized adjustment instruction sent by the multi-terminal adaptation layer when receiving the personalized adjustment instruction; adjust the layout of preset components in the target configuration scheme according to the user adjustment information and send it to the free configuration layer.

[0013] Optionally, the free configuration layer is further used to generate an adaptation bottom layer code corresponding to the target configuration scheme according to the terminal adaptation code; and generate an effect display page according to the adaptation bottom layer code.

[0014] Optionally, the free configuration layer is further used to determine a movement plan for each preset component in response to a page effect adjustment instruction sent by the multi-terminal adaptation layer; and update the effect display page according to the movement plan.

[0015] In addition, to achieve the above purpose, the present application also proposes a page component configuration method, which is applied to the page component configuration system as described above, and the method includes: In response to the service selection instruction, determine the currently selected target service and generate a terminal adaptation code corresponding to the target client; Generate a target configuration scheme for the target service based on the target macro model and arrange the preset components; An effect display page is generated according to the terminal adaptation code and the target configuration scheme.

[0016] Optionally, the step of determining the currently selected target service in response to the service selection instruction and generating a terminal adaptation code corresponding to the target client includes: In response to a service selection instruction, determining a target service and a current device type according to the service selection instruction; A terminal adaptation code corresponding to the target client is generated according to the current device type.

[0017] Optionally, the step of generating a terminal adaptation code corresponding to the target client according to the current device type includes: Defining component configuration rules of a target middleware format according to the current device type; The terminal configuration code corresponding to the target client is determined according to the component configuration rule.

[0018] Optionally, the step of generating a target configuration scheme of preset component combination arrangement for the target service based on the target macro model includes: Get the current user's behavior data; Analyze the behavior data based on the target big model to obtain user behavior information; A target configuration scheme for a preset component combination arrangement is generated for the target service according to the user behavior information.

[0019] Optionally, the step of analyzing the behavior data based on the target macro model to obtain user behavior information includes: Processing the behavior data through a target collaborative filtering algorithm to obtain behavior summary information; The behavior summary information is analyzed through the target large model to obtain user behavior information.

[0020] Optionally, the step of generating a target configuration scheme of preset component combination arrangement for the target service according to the user behavior information includes: Determine user preference information and user habit information based on the user behavior information; A target configuration scheme for the target service is generated based on the user preference information and the user habit information.

[0021] Optionally, after the step of generating a target configuration scheme of preset component combination arrangement for the target service according to the user behavior information, the step further includes: When receiving the real-time update data, determining an optimization recommendation plan according to the real-time update data; The target configuration scheme is updated according to the optimization recommendation scheme.

[0022] Optionally, after the step of generating a target configuration scheme of preset component combination arrangement for the target service according to the user behavior information, the step further includes: When receiving the personalized adjustment instruction, determining the user adjustment information according to the personalized adjustment instruction; The arrangement of preset components in the target configuration scheme is adjusted according to the user adjustment information.

[0023] Optionally, the step of generating an effect display page according to the terminal adaptation code and the target configuration scheme includes: Generate an adaptation bottom layer code corresponding to the target configuration scheme according to the terminal adaptation code; Generate an effect display page based on the adaptation underlying code.

[0024] Optionally, after the step of generating an effect display page according to the terminal adaptation code and the target configuration scheme, the step further includes: In response to the page effect adjustment instruction, determining a movement plan for each preset component; The effect display page is updated according to the movement plan.

[0025] One or more technical solutions proposed in this application have at least the following technical effects: The system of the present application includes a multi-terminal adaptation layer, an AI recommendation layer, and a free configuration layer; the multi-terminal adaptation layer is used to respond to the service selection instruction, determine the currently selected target service, and generate the terminal adaptation code corresponding to the target client; the AI ​​recommendation layer is used to generate a target configuration scheme for the target service with a preset component combination arrangement based on the target large model; the free configuration layer is used to generate an effect display page according to the terminal adaptation code and the target configuration scheme. In this way, it is possible to achieve component configuration of SaaS based on the multi-terminal adaptation layer that can adapt to a variety of different device types, and to perform more flexible configuration schemes that are more in line with the habits of different users based on AI, thereby improving the flexibility and personalization of page component configuration and improving the efficiency of configuration. BRIEF DESCRIPTION OF THE DRAWINGS

[0026] The accompanying drawings, which are incorporated in and constitute a part of this specification, illustrate embodiments consistent with the present application and, together with the description, serve to explain the principles of the present application.

[0027] In order to more clearly illustrate the embodiments of the present application or the technical solutions in the prior art, the drawings required for use in the embodiments or the description of the prior art will be briefly introduced below. Obviously, for ordinary technicians in this field, other drawings can be obtained based on these drawings without paying any creative labor.

[0028] Figure 1 A structural diagram provided for the first embodiment of the page component configuration system of this application; Figure 2 A schematic diagram of the system architecture provided for an embodiment of the page component configuration system of this application; Figure 3 A flowchart of the first embodiment of the method for configuring the page components of this application is provided; Figure 4 A flow chart of the second embodiment of the method for configuring the page components of this application is provided.

[0029] The purpose, features and advantages of this application will be further described in conjunction with the embodiments and with reference to the accompanying drawings. DETAILED DESCRIPTION

[0030] It should be understood that the specific embodiments described herein are only used to explain the technical solutions of the present application and are not used to limit the present application.

[0031] In order to better understand the technical solution of the present application, a detailed description will be given below in conjunction with the accompanying drawings and specific implementation methods.

[0032] The main solutions of the embodiments of the present application are: the multi-terminal adaptation layer is used to respond to the service selection instruction, determine the currently selected target service, and generate a terminal adaptation code corresponding to the target client; the AI ​​recommendation layer is used to generate a target configuration scheme for the target service with a combination of preset components based on the target large model; the free configuration layer is used to generate an effect display page according to the terminal adaptation code and the target configuration scheme.

[0033] In this embodiment, for ease of description, the following description is made by taking the identification page component configuration system as the execution subject.

[0034] As existing technologies develop rapidly with SaaS technology, front-end componentization and multi-terminal adaptation gradually improve the key requirements of development efficiency and user experience. Traditional application software development relies on fixed components, rules or hard coding, which is difficult to meet the rapid iteration requirements of multi-terminal scenarios (such as Web, APP). At the same time, with the popularization of artificial intelligence technology, more and more companies hope to empower product applications through AI to make them more intelligent and automated. Existing technologies have problems such as difficulty in multi-terminal adaptation, insufficient intelligence, lack of flexibility, and efficiency bottlenecks.

[0035] The present application provides a solution, through this method, it is possible to implement SaaS component configuration based on a multi-terminal adaptation layer that can adapt to a variety of different device types, and to implement a more flexible configuration scheme that is more in line with the habits of different users based on AI, thereby improving the flexibility and personalization of page component configuration and improving the efficiency of configuration.

[0036] At the same time, the efficiency of multi-terminal adaptation is improved: through a unified component configuration engine and multi-terminal adaptation mechanism, the ability of one-time configuration and multi-terminal generation is realized, which greatly reduces the workload of repeated development. Development efficiency is improved by about 50%-70%. Enhanced intelligence level: The optimal configuration plan is automatically generated through the AI ​​recommendation module, which reduces human decision-making errors and improves the accuracy and rationality of component configuration. Improved response speed: The configuration loading and code generation mechanism are optimized to reduce the response time of the system in complex scenarios by more than 30%. User experience optimization: A low-code visual configuration interface is provided, allowing users to complete personalized configuration without professional development knowledge, improving ease of use and user satisfaction. Real-time preview function is implemented, and users can view multi-terminal rendering effects at any time to avoid configuration errors. Cost and time savings: Reduced development and operation and maintenance costs: Reduced repetitive development work for different terminals, saving 30%-50% of development resources. Shortened product launch cycle: The system supports rapid deployment and real-time updates, significantly improving iteration efficiency. Innovative value: This invention provides a new design and implementation method for SaaS componentized systems through the combination of multi-terminal integration and AI recommendation, and promotes the deep integration of front-end and cloud service technologies. For the first time in the industry, it realizes the organic combination of intelligent recommendation and multi-terminal real-time adaptation, providing a reference solution for low-code development platforms.

[0037] It should be noted that the execution subject of this embodiment can be a computing service device with data processing, network communication and program running functions, such as a tablet computer, a personal computer, a mobile phone, etc., or an electronic device, system, etc. that can realize the above functions. The following takes the page component configuration system as an example to illustrate this embodiment and the following embodiments.

[0038] Based on this, the embodiment of the present application provides a page component configuration system, referring to Figure 1 , Figure 1 This is a structural diagram of the first embodiment of the page component configuration system of this application.

[0039] In this embodiment, the page component configuration system includes a multi-terminal adaptation layer 10, an AI recommendation layer 20, and a free configuration layer 30; The multi-terminal adaptation layer 10 is used to respond to the service selection instruction, determine the currently selected target service, and generate a terminal adaptation code corresponding to the target client; It should be noted that if Figure 2 The figure shows a system architecture diagram of the page component configuration system in this embodiment, in which the user interaction layer can perform user interaction and responsive design. The free configuration layer includes a component configuration engine, the AI ​​recommendation layer includes an AI engine, and the SaaS service management layer: realizes unified management, rapid deployment and real-time update of components.

[0040] It should be understood that the solution of this embodiment provides a unified multi-terminal fusion technology architecture to achieve cross-terminal adaptation and dynamic loading of components, reducing repetitive development work; introduces artificial intelligence algorithms to support intelligent recommendations and configuration optimization, and dynamically adjusts component properties according to user behavior and usage scenarios; adopts a flexible low-code configuration method to support users to freely combine components to meet personalized needs; optimizes the SaaS service architecture to improve the response speed and deployment efficiency of component configuration.

[0041] In the specific implementation, the multi-terminal adaptation mechanism: using a unified component description protocol (such as JSON Schema) to achieve the ability to configure once and generate code on multiple terminals; dynamically adjust the component style and function to meet the needs of different terminals such as the Web terminal, mobile terminal, and mini-programs. AI intelligent recommendation module: based on user behavior analysis and historical configuration data, it uses machine learning algorithms to provide component configuration recommendations; optimizes the recommendation results in real time, supports dynamic adjustment, and improves configuration efficiency and accuracy. Free configuration engine: provides a low-code visual operation interface, supports the combination and layout of components through drag and drop and parameter configuration; supports user-defined styles and logical binding to achieve highly flexible component configuration capabilities. SaaS service management module: supports version management, online storage, and real-time deployment of component configuration; provides unified permission control and configuration rollback functions to ensure the security and stability of the system. Real-time preview and dynamic rendering mechanism: through WebSocket or SSE (Server-SentEvents), the real-time preview function is realized, and users can immediately view the configuration results; multi-terminal dynamic rendering ensures the immediacy and consistency of configuration.

[0042] It should be noted that the target service selected by the user is first determined by the multi-terminal adaptation layer in response to the service selection instruction, and then the terminal adaptation code corresponding to the target client is generated, wherein the target client is the client running on the current device, and the terminal adaptation code is a low-code type adapted to the current device type. The target service can be any one of introduction, translation, key points, analysis, subtitles, original text, etc., which is not limited in this embodiment.

[0043] In a feasible implementation, in order to accurately generate the terminal adaptation code, the multi-terminal adaptation layer 10 is also used to respond to the service selection instruction, determine the target service and the current device type according to the service selection instruction; generate the terminal adaptation code corresponding to the target client according to the current device type and send it to the free configuration layer.

[0044] It should be understood that when a service selection instruction is received, the target service and the current device type are determined according to the service selection instruction. The current device type refers to the type of device currently logged in and operated, which can be a desktop computer, tablet computer, smart phone, etc. The multi-terminal adaptation layer uses responsive design combined with terminal characteristics (such as screen size, interaction method) to dynamically adjust the component layout and style.

[0045] In the specific implementation, after determining the current device type, the terminal adaptation code corresponding to the target client is generated. The terminal adaptation code can subsequently be adapted according to the client to generate the corresponding low code for component configuration.

[0046] In a feasible implementation, in order to accurately generate the terminal adaptation code, the multi-terminal adaptation layer 10 is also used to define the component configuration rules of the target middleware format according to the current device type; determine the terminal adaptation code corresponding to the target client according to the component configuration rules and send it to the free configuration layer.

[0047] It should be noted that the target middleware format is first determined, thereby determining the component configuration rules, defining the component configuration rules based on a unified middleware format (such as JSON Schema), and generating different terminal adaptation codes.

[0048] The AI ​​recommendation layer 20 is used to generate a target configuration scheme for the target service based on the target macro model and the combination and arrangement of preset components; It should be understood that after the multi-terminal adaptation layer 10 generates the terminal adaptation code and determines the target service, the AI ​​recommendation layer performs AI analysis based on the target service and generates a recommended configuration solution based on the current user's behavior habits.

[0049] In a feasible implementation, in order to generate a configuration plan that is more in line with user behavior, the AI ​​recommendation layer 20 is also used to obtain the behavior data of the current user; analyze the behavior data based on the target big model to obtain user behavior information; generate a target configuration plan for the target service with a combination of preset components based on the user behavior information and send it to the free configuration layer.

[0050] In a specific implementation, the behavior data of the current user is first obtained, and then analysis is performed based on the behavior data. The behavior data includes but is not limited to the user's operation history, access history, component placement, operation habits, etc.

[0051] It should be noted that the behavior data is then input into the target big model for analysis, and the output analysis result is the user behavior information, wherein the target big model is a pre-trained big data model.

[0052] It should be understood that after obtaining the user behavior information, a target configuration scheme is generated for the target service based on the user behavior information, and the target configuration scheme is a scheme for generating preset components for combination and arrangement on a specified page. The preset component is a pre-designed and packaged SaaS component, which can be any component, and this embodiment does not limit this.

[0053] In a feasible implementation, in order to accurately obtain user behavior information, the AI ​​recommendation layer 20 is also used to process the behavior data through a target collaborative filtering algorithm to obtain behavior summary information; and analyze the behavior summary information through a target large model to obtain user behavior information.

[0054] In the specific implementation, the behavior data is first processed through a pre-set collaborative filtering algorithm to filter out excess noise data and obtain behavior summary information. The behavior summary information is then input into the target large model for semantic analysis and data analysis to obtain the final user behavior information.

[0055] In a feasible implementation, in order to generate a configuration scheme that is more in line with user behavior for recommendation, the AI ​​recommendation layer 20 is also used to determine user preference information and user habit information based on the user behavior information; generate a target configuration scheme for the target service with a combination of preset components based on the user preference information and user habit information and send it to the free configuration layer.

[0056] It should be noted that user preference information and user habit information are first determined based on user behavior information, that is, user preferences for component size, placement and type, as well as relevant information on user operating habits under the target service.

[0057] It should be understood that after obtaining the user preference information and the user habit information, the user behavior is analyzed based on the user preference information and the user habit information to generate the optimal component configuration solution.

[0058] In a feasible implementation, in order to achieve real-time updates based on newly input data in the process of generating a target configuration scheme, the AI ​​recommendation layer 20 is also used to determine an optimized recommendation scheme based on the real-time update data sent by the multi-terminal adaptation layer when receiving the real-time update data; update the target configuration scheme according to the optimized recommendation scheme and send it to the free configuration layer.

[0059] In the specific implementation, when the multi-terminal adaptation layer and the SaaS service management module receive real-time updated data input by the user, the user behavior information is updated according to the real-time updated data, and is implemented through the target big model, thereby generating an optimized recommendation plan based on the real-time updated data, and then updating the target configuration plan based on the optimized recommendation plan, so that the user can customize and adjust at any time during the plan generation process.

[0060] In a feasible implementation, in order to accept direct modification and adjustment of the plan by the user after the target configuration plan is generated, the AI ​​recommendation layer 20 is also used to determine the user adjustment information according to the personalized adjustment instruction sent by the multi-terminal adaptation layer when receiving the personalized adjustment instruction; adjust the arrangement of the preset components in the target configuration plan according to the user adjustment information and send it to the free configuration layer.

[0061] It should be noted that the multi-terminal adaptation layer and the SaaS service management module first receive the personalized adjustment instructions input by the user, and adjust the generated target configuration plan based on the personalized adjustment instructions, so that corresponding adjustments are made before the final effect display page is generated, thereby improving the user's setting freedom for page generation.

[0062] The free configuration layer 30 is used to generate an effect display page according to the terminal adaptation code and the target configuration solution.

[0063] It should be understood that after obtaining the terminal adaptation code, a low-code design of the target configuration scheme of the user's corresponding path is generated based on the terminal adaptation code, so that an effect display page can be generated. Among them, the user's corresponding path includes but is not limited to: APP, WEB or mini program, etc.

[0064] In a feasible implementation, in order to generate an effect display page for the corresponding channel and adapt to different channels, the free configuration layer 30 is also used to generate the adaptation underlying code corresponding to the target configuration scheme according to the terminal adaptation code; and generate the effect display page according to the adaptation underlying code.

[0065] In the specific implementation, the adaptation underlying code corresponding to the target configuration scheme is first generated according to the terminal adaptation code, that is, the code type corresponding to the terminal of the terminal adaptation code and the target configuration scheme are used to generate the adaptation underlying code that adapts to the current terminal and the current client channel, and then the effect display page can be generated.

[0066] In a feasible implementation, in order to allow adjustments to be made after the page is generated, the free configuration layer 30 is also used to respond to the page effect adjustment instructions sent by the multi-terminal adaptation layer, determine the movement plan of each preset component; and update the effect display page according to the movement plan.

[0067] It should be noted that after the effect display page is generated, if a page effect adjustment instruction triggered by the user is received, the movement plan of moving, replacing and deleting each preset component in each effect display page is determined according to the page effect adjustment instruction, so as to update the effect display page based on the movement plan.

[0068] It should be understood that the complete process of the scheme of this embodiment is as follows: Scenario 1: AI browser, the user enters the SaaS system and selects the required SaaS service (introduction, translation, key points, analysis, subtitles, original text, etc.); the system performs AI analysis based on the user data provided and automatically generates a configuration plan; the user can make personalized adjustments; after the configuration is completed, the system generates the code for the Web side through the multi-terminal adaptation module and deploys it online; the user can view the page effect in real time and adjust the configuration plan. Scenario 2: The cursor on the WeB side selects words, the user enters the SaaS system and selects the required AI polishing SaaS service; the system performs AI analysis based on the user data provided and automatically generates a configuration plan; the user can make personalized adjustments; after the configuration is completed, the system generates the code for the Web side through the multi-terminal adaptation module and deploys it online; the user can view the page effect in real time and adjust the configuration plan. Scenario 3: AI office assistant APP, the user enters the SaaS system and selects the required translation SaaS service; the system performs AI analysis based on the provided user data and automatically generates a configuration plan; the user can make personalized adjustments; after the configuration is completed, the system generates the APP code through the multi-terminal adaptation module and deploys it online; the user can view the page effect in real time and adjust the configuration plan.

[0069] The multi-terminal adaptation layer of this embodiment is used to respond to the service selection instruction, determine the currently selected target service, and generate the terminal adaptation code corresponding to the target client; the AI ​​recommendation layer is used to generate a target configuration scheme for the preset component combination layout for the target service based on the target large model; the free configuration layer is used to generate an effect display page according to the terminal adaptation code and the target configuration scheme. In this way, it is possible to achieve component configuration of SaaS based on the multi-terminal adaptation layer that can adapt to a variety of different device types, and to achieve a more flexible configuration scheme that is more in line with the habits of different users based on AI, thereby improving the flexibility and personalization of page component configuration and improving the efficiency of configuration.

[0070] Based on this, the present application embodiment provides a page component configuration method, referring to Figure 3 , Figure 3 This is a flow chart of the first embodiment of the page component configuration method of this application.

[0071] In this embodiment, the page component configuration method includes steps S10 to S30: Step S10, in response to the service selection instruction, determining the currently selected target service and generating a terminal adaptation code corresponding to the target client; It should be noted that if Figure 2 The figure shows a system architecture diagram of the page component configuration system in this embodiment, in which the user interaction layer can perform user interaction and responsive design. The free configuration layer includes a component configuration engine, the AI ​​recommendation layer includes an AI engine, and the SaaS service management layer: realizes unified management, rapid deployment and real-time update of components.

[0072] It should be understood that the solution of this embodiment provides a unified multi-terminal fusion technology architecture to achieve cross-terminal adaptation and dynamic loading of components, reducing repetitive development work; introduces artificial intelligence algorithms to support intelligent recommendations and configuration optimization, and dynamically adjusts component properties according to user behavior and usage scenarios; adopts a flexible low-code configuration method to support users to freely combine components to meet personalized needs; optimizes the SaaS service architecture to improve the response speed and deployment efficiency of component configuration.

[0073] In the specific implementation, the multi-terminal adaptation mechanism: using a unified component description protocol (such as JSON Schema) to achieve the ability to configure once and generate code on multiple terminals; dynamically adjust the component style and function to meet the needs of different terminals such as the Web terminal, mobile terminal, and mini-programs. AI intelligent recommendation module: based on user behavior analysis and historical configuration data, it uses machine learning algorithms to provide component configuration recommendations; optimizes the recommendation results in real time, supports dynamic adjustment, and improves configuration efficiency and accuracy. Free configuration engine: provides a low-code visual operation interface, supports the combination and layout of components through drag and drop and parameter configuration; supports user-defined styles and logical binding to achieve highly flexible component configuration capabilities. SaaS service management module: supports version management, online storage, and real-time deployment of component configuration; provides unified permission control and configuration rollback functions to ensure the security and stability of the system. Real-time preview and dynamic rendering mechanism: through WebSocket or SSE (Server-SentEvents), the real-time preview function is realized, and users can immediately view the configuration results; multi-terminal dynamic rendering ensures the immediacy and consistency of configuration.

[0074] It should be noted that the target service selected by the user is first determined by the multi-terminal adaptation layer in response to the service selection instruction, and then the terminal adaptation code corresponding to the target client is generated, wherein the target client is the client running on the current device, and the terminal adaptation code is a low-code type adapted to the current device type. The target service can be any one of introduction, translation, key points, analysis, subtitles, original text, etc., which is not limited in this embodiment.

[0075] In a feasible implementation, in order to accurately generate the terminal adaptation code, the multi-terminal adaptation layer is also used to respond to the service selection instruction, determine the target service and the current device type according to the service selection instruction; generate the terminal adaptation code corresponding to the target client according to the current device type and send it to the free configuration layer.

[0076] It should be understood that when a service selection instruction is received, the target service and the current device type are determined according to the service selection instruction. The current device type refers to the type of device currently logged in and operated, which can be a desktop computer, tablet computer, smart phone, etc. The multi-terminal adaptation layer uses responsive design combined with terminal characteristics (such as screen size, interaction method) to dynamically adjust the component layout and style.

[0077] In the specific implementation, after determining the current device type, the terminal adaptation code corresponding to the target client is generated. The terminal adaptation code can subsequently be adapted according to the client to generate the corresponding low code for component configuration.

[0078] In a feasible implementation, in order to accurately generate terminal adaptation code, the multi-terminal adaptation layer is also used to define component configuration rules of the target middleware format according to the current device type; determine the terminal adaptation code corresponding to the target client according to the component configuration rules and send it to the free configuration layer.

[0079] It should be noted that the target middleware format is first determined, thereby determining the component configuration rules, defining the component configuration rules based on a unified middleware format (such as JSON Schema), and generating different terminal adaptation codes.

[0080] Step S20, generating a target configuration scheme of preset component combination arrangement for the target service based on the target macro model; It should be understood that after the multi-terminal adaptation layer generates the terminal adaptation code and determines the target service, the AI ​​recommendation layer performs AI analysis based on the target service and generates a recommended configuration solution based on the current user's behavior habits.

[0081] Step S30: Generate an effect display page according to the terminal adaptation code and the target configuration solution.

[0082] It should be understood that after obtaining the terminal adaptation code, a low-code design of the target configuration scheme of the user's corresponding path is generated based on the terminal adaptation code, so that an effect display page can be generated. Among them, the user's corresponding path includes but is not limited to: APP, WEB or mini program, etc.

[0083] In a feasible implementation, in order to generate an effect display page for the corresponding channel and adapt to different channels, the free configuration layer is also used to generate the adaptation underlying code corresponding to the target configuration scheme according to the terminal adaptation code; and generate the effect display page according to the adaptation underlying code.

[0084] In the specific implementation, the adaptation underlying code corresponding to the target configuration scheme is first generated according to the terminal adaptation code, that is, the code type corresponding to the terminal of the terminal adaptation code and the target configuration scheme are used to generate the adaptation underlying code that adapts to the current terminal and the current client channel, and then the effect display page can be generated.

[0085] In a feasible implementation, in order to allow adjustments to be made after the page is generated, the free configuration layer is also used to respond to the page effect adjustment instructions sent by the multi-terminal adaptation layer, determine the movement plan of each preset component; and update the effect display page according to the movement plan.

[0086] It should be noted that after the effect display page is generated, if a page effect adjustment instruction triggered by the user is received, the movement plan of moving, replacing and deleting each preset component in each effect display page is determined according to the page effect adjustment instruction, so as to update the effect display page based on the movement plan.

[0087] It should be understood that the complete process of the scheme of this embodiment is as follows: Scenario 1: AI browser, the user enters the SaaS system and selects the required SaaS service (introduction, translation, key points, analysis, subtitles, original text, etc.); the system performs AI analysis based on the user data provided and automatically generates a configuration plan; the user can make personalized adjustments; after the configuration is completed, the system generates the code for the Web side through the multi-terminal adaptation module and deploys it online; the user can view the page effect in real time and adjust the configuration plan. Scenario 2: The cursor on the WeB side selects words, the user enters the SaaS system and selects the required AI polishing SaaS service; the system performs AI analysis based on the user data provided and automatically generates a configuration plan; the user can make personalized adjustments; after the configuration is completed, the system generates the code for the Web side through the multi-terminal adaptation module and deploys it online; the user can view the page effect in real time and adjust the configuration plan. Scenario 3: AI office assistant APP, the user enters the SaaS system and selects the required translation SaaS service; the system performs AI analysis based on the provided user data and automatically generates a configuration plan; the user can make personalized adjustments; after the configuration is completed, the system generates the APP code through the multi-terminal adaptation module and deploys it online; the user can view the page effect in real time and adjust the configuration plan.

[0088] This embodiment provides a method for configuring page components, wherein the multi-terminal adaptation layer is used to respond to the service selection instruction, determine the currently selected target service, and generate the terminal adaptation code corresponding to the target client; the AI ​​recommendation layer is used to generate a target configuration scheme for the target service with a preset component combination arrangement based on the target large model; the free configuration layer is used to generate an effect display page according to the terminal adaptation code and the target configuration scheme. In this way, it is possible to achieve component configuration of SaaS based on the multi-terminal adaptation layer that can adapt to a variety of different device types, and to achieve a more flexible configuration scheme that is more in line with the habits of different users based on AI, thereby improving the flexibility and personalization of page component configuration and improving the efficiency of configuration.

[0089] Based on the first embodiment of the present application, in the second embodiment of the present application, the same or similar contents as those in the above-mentioned embodiment 1 can be referred to the above introduction, and will not be repeated in the following. Figure 4 , step S30 includes steps S301 to S304: Step S301, obtaining the behavior data of the current user; In a specific implementation, the behavior data of the current user is first obtained, and then analysis is performed based on the behavior data. The behavior data includes but is not limited to the user's operation history, access history, component placement, operation habits, etc.

[0090] It should be noted that the behavior data of the current user is first obtained, and then analysis is performed based on the behavior data. The behavior data includes but is not limited to the user's operation history, access history, component placement, operation habits, etc.

[0091] Step S302, analyzing the behavior data based on the target macro model to obtain user behavior information; It should be noted that the behavior data is then input into the target big model for analysis, and the output analysis result is the user behavior information, wherein the target big model is a pre-trained big data model.

[0092] In a feasible implementation, in order to accurately obtain user behavior information, the AI ​​recommendation layer is also used to process the behavior data through a target collaborative filtering algorithm to obtain behavior summary information; and analyze the behavior summary information through a target large model to obtain user behavior information.

[0093] In the specific implementation, the behavior data is first processed through a pre-set collaborative filtering algorithm to filter out excess noise data and obtain behavior summary information. The behavior summary information is then input into the target large model for semantic analysis and data analysis to obtain the final user behavior information.

[0094] Step S303: generating a target configuration scheme of preset component combination arrangement for the target service according to the user behavior information.

[0095] It should be understood that after obtaining the user behavior information, a target configuration scheme is generated for the target service based on the user behavior information, and the target configuration scheme is a scheme for generating preset components for combination and arrangement on a specified page. The preset component is a pre-designed and packaged SaaS component, which can be any component, and this embodiment does not limit this.

[0096] In a feasible implementation, in order to generate a configuration scheme that is more in line with user behavior for recommendation, the AI ​​recommendation layer is also used to determine user preference information and user habit information based on the user behavior information; generate a target configuration scheme for the target service with a combination of preset components based on the user preference information and user habit information and send it to the free configuration layer.

[0097] It should be noted that user preference information and user habit information are first determined based on user behavior information, that is, user preferences for component size, placement and type, as well as relevant information on user operating habits under the target service.

[0098] It should be understood that after obtaining the user preference information and the user habit information, the user behavior is analyzed based on the user preference information and the user habit information to generate the optimal component configuration solution.

[0099] In a feasible implementation, in order to achieve real-time updates based on newly input data in the process of generating a target configuration scheme, the AI ​​recommendation layer is also used to determine an optimized recommendation scheme based on the real-time update data sent by the multi-terminal adaptation layer when receiving the real-time update data; update the target configuration scheme according to the optimized recommendation scheme and send it to the free configuration layer.

[0100] In the specific implementation, when the multi-terminal adaptation layer and the SaaS service management module receive real-time updated data input by the user, the user behavior information is updated according to the real-time updated data, and is implemented through the target big model, thereby generating an optimized recommendation plan based on the real-time updated data, and then updating the target configuration plan based on the optimized recommendation plan, so that the user can customize and adjust at any time during the plan generation process.

[0101] In a feasible implementation, in order to accept direct modification and adjustment of the plan by the user after the target configuration plan is generated, the AI ​​recommendation layer is also used to determine the user adjustment information according to the personalized adjustment instruction sent by the multi-terminal adaptation layer when receiving the personalized adjustment instruction; adjust the arrangement of the preset components in the target configuration plan according to the user adjustment information and send it to the free configuration layer.

[0102] It should be noted that the multi-terminal adaptation layer and the SaaS service management module first receive the personalized adjustment instructions input by the user, and adjust the generated target configuration plan based on the personalized adjustment instructions, so that corresponding adjustments are made before the final effect display page is generated, thereby improving the user's setting freedom for page generation.

[0103] This embodiment obtains the behavior data of the current user; analyzes the behavior data based on the target big model to obtain user behavior information; and generates a target configuration scheme for the preset component combination layout for the target service based on the user behavior information. In this way, the AI ​​recommendation module automatically generates the optimal configuration scheme, reduces human decision-making errors, and improves the accuracy and rationality of component configuration.

[0104] It should be noted that the above examples are only used to understand the present application and do not constitute a limitation on the page component configuration method of the present application. More simple transformations based on this technical concept are all within the scope of protection of the present application.

[0105] Computer program code for performing the operations of the present application may be written in one or more programming languages ​​or a combination thereof, including object-oriented programming languages ​​such as Java, Smalltalk, C++, and conventional procedural programming languages ​​such as "C" or similar programming languages. The program code may be executed entirely on the user's computer, partially on the user's computer, as a separate software package, partially on the user's computer and partially on a remote computer, or entirely on a remote computer or server. In the case of a remote computer, the remote computer may be connected to the user's computer through any type of network, including a local area network (LAN) or a wide area network (WAN), or may be connected to an external computer (e.g., via the Internet using an Internet service provider).

[0106] The flow chart and block diagram in the accompanying drawings illustrate the possible architecture, function and operation of the system, method and computer program product according to various embodiments of the present application. In this regard, each square box in the flow chart or block diagram can represent a module, a program segment or a part of a code, and the module, the program segment or a part of the code contains one or more executable instructions for realizing the specified logical function. It should also be noted that in some alternative implementations, the functions marked in the square box can also occur in a sequence different from that marked in the accompanying drawings. For example, two square boxes represented in succession can actually be executed substantially in parallel, and they can sometimes be executed in the opposite order, depending on the functions involved. It should also be noted that each square box in the block diagram and / or flow chart, and the combination of the square boxes in the block diagram and / or flow chart can be implemented with a dedicated hardware-based system that performs a specified function or operation, or can be implemented with a combination of dedicated hardware and computer instructions.

[0107] The modules involved in the embodiments described in this application may be implemented by software or hardware, wherein the name of the module does not constitute a limitation on the unit itself in some cases.

[0108] The above descriptions are only some embodiments of the present application, and are not intended to limit the patent scope of the present application. All equivalent structural changes made using the contents of the present application specification and drawings under the technical concept of the present application, or direct / indirect applications in other related technical fields are included in the patent protection scope of the present application.

[0109] The present invention discloses A1. A page component configuration system, the system comprising: a multi-terminal adaptation layer, an AI recommendation layer and a free configuration layer; The multi-terminal adaptation layer is used to respond to the service selection instruction, determine the currently selected target service, and generate a terminal adaptation code corresponding to the target client; The AI ​​recommendation layer is used to generate a target configuration scheme for the target service based on the target macro model and the combination and arrangement of preset components; The free configuration layer is used to generate an effect display page according to the terminal adaptation code and the target configuration solution.

[0110] A2. In the system as described in A1, the multi-terminal adaptation layer is also used to respond to a service selection instruction, determine the target service and the current device type according to the service selection instruction; generate a terminal adaptation code corresponding to the target client according to the current device type and send it to the free configuration layer.

[0111] A3. In the system as described in A2, the multi-terminal adaptation layer is also used to define component configuration rules of the target middleware format according to the current device type; determine the terminal adaptation code corresponding to the target client according to the component configuration rules and send it to the free configuration layer.

[0112] A4. In the system as described in A1, the AI ​​recommendation layer is also used to obtain the behavior data of the current user; analyze the behavior data based on the target big model to obtain user behavior information; generate a target configuration plan for the target service with a combination of preset components according to the user behavior information and send it to the free configuration layer.

[0113] A5. In the system as described in A4, the AI ​​recommendation layer is further used to process the behavior data through a target collaborative filtering algorithm to obtain behavior summary information; and to analyze the behavior summary information through a target large model to obtain user behavior information.

[0114] A6. In the system described in A5, the AI ​​recommendation layer is further used to determine user preference information and user habit information based on the user behavior information; generate a target configuration scheme for the target service with a combination of preset components based on the user preference information and user habit information and send it to the free configuration layer.

[0115] A7. In the system as described in A4, the AI ​​recommendation layer is further used to determine an optimization recommendation scheme based on the real-time update data sent by the multi-terminal adaptation layer when receiving the real-time update data sent by the multi-terminal adaptation layer; update the target configuration scheme according to the optimization recommendation scheme and send it to the free configuration layer.

[0116] A8. In the system as described in A4, the AI ​​recommendation layer is further used to determine user adjustment information according to the personalized adjustment instruction sent by the multi-terminal adaptation layer when receiving the personalized adjustment instruction sent by the multi-terminal adaptation layer; adjust the arrangement of preset components in the target configuration scheme according to the user adjustment information and send it to the free configuration layer.

[0117] A9. In the system as described in A1, the free configuration layer is further used to generate the adaptation bottom layer code corresponding to the target configuration scheme according to the terminal adaptation code; and generate the effect display page according to the adaptation bottom layer code.

[0118] A10. In the system as described in A9, the free configuration layer is further used to determine the movement plan of each preset component in response to the page effect adjustment instruction sent by the multi-terminal adaptation layer; and update the effect display page according to the movement plan.

[0119] The present invention also discloses B11. a page component configuration method, which is applied to the page component configuration system as described above, and comprises: In response to the service selection instruction, determine the currently selected target service and generate a terminal adaptation code corresponding to the target client; Generate a target configuration scheme for the target service based on the target macro model and arrange the preset components; An effect display page is generated according to the terminal adaptation code and the target configuration scheme.

[0120] B12. As described in B11, the step of determining the currently selected target service in response to the service selection instruction and generating a terminal adaptation code corresponding to the target client comprises: In response to a service selection instruction, determining a target service and a current device type according to the service selection instruction; A terminal adaptation code corresponding to the target client is generated according to the current device type.

[0121] B13. As described in B12, the step of generating a terminal adaptation code corresponding to the target client according to the current device type comprises: Defining component configuration rules of a target middleware format according to the current device type; The terminal configuration code corresponding to the target client is determined according to the component configuration rule.

[0122] B14. As described in B11, the step of generating a target configuration scheme for the target service based on the target macro model and the preset component combination arrangement comprises: Get the current user's behavior data; Analyze the behavior data based on the target big model to obtain user behavior information; A target configuration scheme for a preset component combination arrangement is generated for the target service according to the user behavior information.

[0123] B15. The method as described in B14, wherein the step of analyzing the behavior data based on the target macro model to obtain user behavior information comprises: Processing the behavior data through a target collaborative filtering algorithm to obtain behavior summary information; The behavior summary information is analyzed through the target large model to obtain user behavior information.

[0124] B16. The method as described in B14, wherein the step of generating a target configuration scheme for a preset component combination arrangement for the target service according to the user behavior information comprises: Determine user preference information and user habit information based on the user behavior information; A target configuration scheme for the target service is generated based on the user preference information and the user habit information.

[0125] B17. The method as described in B14, after the step of generating a target configuration scheme for a preset component combination arrangement for the target service according to the user behavior information, further comprises: When receiving the real-time update data, determining an optimization recommendation plan according to the real-time update data; The target configuration scheme is updated according to the optimization recommendation scheme.

[0126] B18. The method as described in B14, after the step of generating a target configuration scheme for a preset component combination arrangement for the target service according to the user behavior information, further comprises: When receiving the personalized adjustment instruction, determining the user adjustment information according to the personalized adjustment instruction; The arrangement of preset components in the target configuration scheme is adjusted according to the user adjustment information.

[0127] B19. As described in B11, the step of generating an effect display page according to the terminal adaptation code and the target configuration scheme comprises: Generate an adaptation bottom layer code corresponding to the target configuration scheme according to the terminal adaptation code; Generate an effect display page based on the adaptation underlying code.

[0128] B20. The method as described in B11, after the step of generating the effect display page according to the terminal adaptation code and the target configuration scheme, further comprises: In response to the page effect adjustment instruction, determining a movement plan for each preset component; The effect display page is updated according to the movement plan.

Claims

1. A page component configuration system, characterized in that: The system includes: a multi-terminal adaptation layer, an AI recommendation layer and a free configuration layer; The multi-terminal adaptation layer is used to respond to the service selection instruction, determine the currently selected target service, and generate a terminal adaptation code corresponding to the target client; The AI ​​recommendation layer is used to generate a target configuration scheme for the target service based on the target macro model and the combination and arrangement of preset components; The free configuration layer is used to generate an effect display page according to the terminal adaptation code and the target configuration solution.

2. The system according to claim 1, characterized in that The multi-terminal adaptation layer is further used to respond to a service selection instruction, determine a target service and a current device type according to the service selection instruction; generate a terminal adaptation code corresponding to the target client according to the current device type and send it to the free configuration layer.

3. The system according to claim 2, characterized in that The multi-terminal adaptation layer is further used to define component configuration rules of the target middleware format according to the current device type; determine the terminal adaptation code corresponding to the target client according to the component configuration rules and send it to the free configuration layer.

4. The system according to claim 1, characterized in that The AI ​​recommendation layer is also used to obtain the behavior data of the current user; analyze the behavior data based on the target big model to obtain user behavior information; generate a target configuration plan for the target service with preset component combination layout according to the user behavior information and send it to the free configuration layer.

5. The system according to claim 4, characterized in that The AI ​​recommendation layer is also used to process the behavior data through a target collaborative filtering algorithm to obtain behavior summary information; and analyze the behavior summary information through a target large model to obtain user behavior information.

6. The system according to claim 5, characterized in that The AI ​​recommendation layer is also used to determine user preference information and user habit information based on the user behavior information; generate a target configuration scheme for the preset component combination layout for the target service based on the user preference information and user habit information and send it to the free configuration layer.

7. The system according to claim 4, characterized in that The AI ​​recommendation layer is further used to determine an optimization recommendation scheme according to the real-time update data sent by the multi-terminal adaptation layer when receiving the real-time update data sent by the multi-terminal adaptation layer; update the target configuration scheme according to the optimization recommendation scheme and send it to the free configuration layer.

8. The system according to claim 4, characterized in that The AI ​​recommendation layer is also used to determine user adjustment information according to the personalized adjustment instruction sent by the multi-terminal adaptation layer when receiving the personalized adjustment instruction sent by the multi-terminal adaptation layer; adjust the arrangement of preset components in the target configuration scheme according to the user adjustment information and send it to the free configuration layer.

9. The system according to claim 1, characterized in that The free configuration layer is further used to generate the adaptation bottom layer code corresponding to the target configuration scheme according to the terminal adaptation code; and generate an effect display page according to the adaptation bottom layer code.

10. A page component configuration method, characterized in that: The page component configuration method is applied to the page component configuration system as claimed in claim 1, and the method comprises: In response to the service selection instruction, determine the currently selected target service and generate a terminal adaptation code corresponding to the target client; Generate a target configuration scheme for the target service based on the target macro model and arrange the preset components; An effect display page is generated according to the terminal adaptation code and the target configuration scheme.

Citation Information

Patent Citations

  • Page configuration method and device, electronic equipment and computer readable medium

    CN113158102A

  • Multi-terminal application development system and method

    CN117369777A

  • Application development method, device and system based on low-code platform

    CN117369853A

  • Small program front-end page website building design method and system

    CN119045790A

  • System compliance assessment utilizing service tiers

    US20180062941A1

Cited By

  • Job recommendation method, system and related device

    CN120216778A