Low-code interface generation and optimization method based on user behaviors
By using cross-framework real-time tracking and lightweight machine learning models to dynamically adjust the interface, the shortcomings of low-code platforms in personalization and data analysis are solved, achieving personalized interface optimization and high-efficiency performance improvement, thereby enhancing user experience and platform adaptability.
Patent Information
- Application Number
- CN202511104977.2
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2025-08-07
- Publication Date
- 2025-11-21
AI Technical Summary
Existing low-code platforms lack personalization when dealing with complex business logic and specific industry needs. They have static interface designs, slow response speeds, insufficient data analysis, and difficulty in achieving dynamic adjustments and efficient optimization. They also cannot comprehensively collect and analyze user behavior.
By collecting user behavior data in real time across frameworks, using lightweight machine learning models for in-depth analysis, and combining metadata configuration and lifecycle functions to achieve dynamic interface optimization, a real-time feedback loop is established, supporting multiple optimization strategies and platform compatibility.
It enables personalized interface design, improves user experience and operational efficiency, enhances the flexibility and scalability of the low-code platform, and can quickly respond to changes in business needs and continuously optimize the user experience.
Abstract
Description
TECHNICAL FIELD
[0001] The present application relates to the technical field of human-computer interaction, in particular to a low-code interface generation and optimization method based on user behavior. BACKGROUND
[0002] "Human-computer interaction" refers to the process of information exchange and interaction between human and computer system. It covers how humans input information to computers, such as through keyboards, mice, voice, etc., and how computers output information to humans, such as displaying graphics, text on the screen, or through voice broadcasting, etc. The carrier of this interaction process is usually called interface, such as mobile phone screen, computer screen, etc.
[0003] With the technical solution, the human-computer interaction mode has far exceeded the basic interaction function. Only through basic interaction communication, the behavior content and demand path of customers cannot be fully and accurately collected. With the explosive increase in the interaction time of people on the interface, how to form a more reasonable visual, operation experience, and detailed big data collection function determines the important indicators of human-computer interaction interface design.
[0004] However, the existing technology has the following specific shortcomings:
[0005] 1) Lack of personalized customization: current low-code platforms have limitations in handling complex business logic and specific industry needs, making it difficult to achieve highly personalized user experience.
[0006] 2) Static interface design: interface design is usually static and cannot be dynamically adjusted according to user behavior and preferences.
[0007] 3) Slow response speed: the processing efficiency of real-time user feedback and behavior data is low, and it cannot be immediately reflected in interface optimization.
[0008] 4) Insufficient data analysis: lack of in-depth user behavior analysis capabilities, making it difficult to accurately identify user needs and optimize the interface accordingly.
[0009] 5) Insufficient behavior data analysis: existing solutions do not fully capture and analyze user interaction behavior, making it difficult to support precise optimization.
[0010] Based on the above reasons, the present application designs a low-code interface generation and optimization method based on user behavior, which realizes dynamic interface adjustment and efficient performance optimization by intelligently adjusting the interface and personalized services, deeply analyzes user behavior using machine learning, greatly improves user experience and satisfaction. SUMMARY
[0011] The purpose of this invention is to overcome the shortcomings of the prior art and provide a low-code interface generation and optimization method based on user behavior. By intelligently adjusting the interface and personalized services, and using machine learning to deeply analyze user behavior, dynamic interface adjustment and efficient performance optimization are achieved, which greatly improves user experience and satisfaction.
[0012] This invention provides a low-code interface generation and optimization method based on user behavior, comprising the following steps:
[0013] S1, cross-framework real-time tracking to collect user interaction behavior data across different front-end frameworks, including:
[0014] S1-1, SDK Development and Integration for Data Tracking: The SDK encapsulates user behavior data collection functionality through custom tuples and shadow DOM technology.
[0015] S1-2, Definition and collection of multi-dimensional user behavior data;
[0016] S1-3, Real-time Data Transmission and Storage: An incremental data transmission strategy is adopted to transmit the collected user behavior data to the backend service of the low-code platform in real time through a lightweight API interface. The real-time storage of the data uses the database built into the low-code platform or cloud services to ensure the security and accessibility of the data.
[0017] S2, Lightweight Machine Learning Model Construction and Deployment: Utilizing lightweight machine learning models to perform in-depth analysis of user behavior data transmitted and stored in S1-3, identifying user preferences and demand patterns, specifically including:
[0018] S2-1, Data Preprocessing and Feature Engineering: Cleaning and preprocessing the collected raw user behavior data, including missing value imputation, outlier handling, and data standardization; at the same time, feature engineering is performed to extract key features related to interface optimization.
[0019] S2-2, Lightweight Model Selection and Training: Utilize lightweight machine learning libraries to develop models suitable for low-code environments. Model selection is based on the complexity of the user scenario and resource constraints.
[0020] S2-3, Model Lightweighting and Low-Code Deployment: The trained model is lightweighted through quantization and pruning techniques to reduce model size and computational resource consumption;
[0021] S3, Dynamic Interface Generation and Optimization: Based on the analysis results of machine learning models, the system dynamically optimizes the interface through a metadata configuration engine and framework lifecycle functions, specifically including:
[0022] S3-1, Metadata-driven interface generation: Low-code platforms usually use metadata to describe interface layouts and component configurations. The system maps the analysis results of machine learning models into these metadata, and automatically generates or adjusts interface code through parsing engines;
[0023] S3-2, Dynamic layout rule engine: Convert user behavior analysis results into specific interface parameter adjustment rules. Rule engine supports various optimization strategies, including:
[0024] Based on user preferences: Prioritize frequently used functions or content for users;
[0025] Based on operational efficiency: Adjust component position and order to reduce user operation path;
[0026] Based on emotional feedback: Optimize the visual effects of interface elements to improve user satisfaction;
[0027] Based on environmental adaptation: Automatically adjust the layout according to the device type;
[0028] S3-3, Real-time dynamic adjustment implementation: Realize the real-time dynamic adjustment of interface through the lifecycle function of framework, the specific implementation steps include:
[0029] S3-3-1, Define metadata configuration of interface components in low-code platform;
[0030] S3-3-2, Map analysis results of machine learning models to these metadata configurations;
[0031] S3-3-3, Real-time update interface layout and component configuration through framework lifecycle function or low-code platform event trigger mechanism;
[0032] S3-3-4, Ensure that the interface after dynamic adjustment maintains good performance and user experience.
[0033] S4, Effect evaluation and feedback loop: Establish a real-time feedback mechanism of user behavior→analysis→interface adjustment→effect evaluation, continuously optimize interface experience, including:
[0034] S4-1, A / B testing and effect evaluation: Compare the dynamically optimized interface with the original interface to evaluate the optimization effect. Evaluation indicators include user satisfaction, operation efficiency, conversion rate, response speed;
[0035] S4-2, Feedback data collection and model update: Collect A / B test effect data as feedback for model update. Data includes user behavior data, interface performance indicators, and user satisfaction scores. Model update is through incremental learning mechanism to continuously optimize machine learning model, improve prediction accuracy and interface optimization effect;
[0036] S4-3, optimization of closed loop formation: the updated results of S4-2 model are applied to interface optimization again to form a continuously improved closed loop, and the improved closed loop is automatically or through review and adjustment by business personnel.
[0037] User behavior in S1-1 includes clicking, sliding, and page staying.
[0038] The SDK in S1-1 supports Vue, React, and Angular front-end frameworks.
[0039] The user behavior data in S1-2 is specifically:
[0040] Basic attributes: including user ID, device type, browser information, and timestamp;
[0041] Interaction behavior: including click position, sliding trajectory, page staying time, and scroll depth;
[0042] Operation path: including page jump sequence, function usage frequency, and form filling mode;
[0043] Emotional feedback: including mouse hover duration, page return rate, and function usage completion rate.
[0044] The model selection of user scenario complexity and resource constraints in S2-2 is:
[0045] For simple scenarios: use collaborative filtering algorithms, including user-based or item-based collaborative filtering, to analyze user preferences and generate recommendations; for medium complexity scenarios: use small neural networks, including MLP multi-layer perceptron or CNN convolutional neural network, for more accurate prediction; for high complexity scenarios, use a simplified version of the Transformer architecture, including DistilBERT, for natural language processing and more complex pattern recognition.
[0046] S2-3 specifically refers to: using the TensorFlow Lite framework to convert the model into a format suitable for the low-code environment, and deploying the model into the low-code platform through the API provided by the platform.
[0047] The embedding method in S1 can also use framework native embedding tools or visual embedding tools.
[0048] Framework native embedding tools are ReactGA or react-ga, vue-analytics or vue GoogleAnalytics plugins; visual embedding tools include Aliyun Tealeaf, GrowingIO, and Seng Data.
[0049] The machine learning model in S2 can also employ a pre-trained model API or a rules engine.
[0050] The pre-trained model API includes Google Cloud Vision API, Aliyun PAI, AWS Personalize; the rules engine includes Drools rules engine, OutSystems decision table, Mendix microflow activity.
[0051] Compared with the prior art, the present application has the following beneficial effects:
[0052] The present application promotes the development efficiency of human-computer interaction interface, specifically:
[0053] Through automatic interface generation and optimization, the repetitive work of developers in interface design and adjustment is reduced.
[0054] Real-time data collection and model updating enable interface optimization to quickly respond to changes in business requirements.
[0055] Through visual configuration and natural language interaction, business personnel can also participate in interface design and optimization.
[0056] Secondly, based on the improvement of the present application after data analysis, the user experience can be continuously optimized:
[0057] Analyze user behavior data, identify user preferences and demand patterns, and generate personalized interface design schemes.
[0058] Real-time behavior analysis and dynamic adjustment enable the interface to be optimized according to real-time feedback from users.
[0059] Optimize interface layout and interaction processes to significantly improve user operation efficiency.
[0060] Furthermore, the platform based on the present application has enhanced flexibility:
[0061] The system is based on Web Components technology, which realizes compatibility with different front-end frameworks, meaning that the low-code platform can seamlessly support components of different technology stacks such as Vue, React, and Angular, avoiding vendor lock-in problems.
[0062] Real-time behavior analysis and dynamic adjustment enable the low-code platform to adapt to changing user needs and market environment.
[0063] Through modular design, the links of data collection, model analysis, interface optimization, and effect evaluation are separated, improving the scalability and maintainability of the system. DETAILED DESCRIPTION
[0064] The application provides a user behavior-based low-code interface generation and optimization method, including the following steps:
[0065] Step one: Real-time cross-framework data collection, collecting user interaction behavior data under different front-end frameworks.
[0066] 1A, SDK development and integration: Develop a lightweight SDK for data collection, supporting Vue, React, Angular, and other mainstream front-end frameworks. The SDK encapsulates user behavior data collection functions (click, slide, page stay, etc.) through custom elements and shadow DOM technology.
[0067] 1B, User behavior data definition and collection: Define multi-dimensional user behavior data, including:
[0068] Basic attributes: user ID, device type, browser information, timestamp
[0069] Interaction behavior: click position, sliding track, page stay duration, scroll depth
[0070] Operation path: page jump sequence, function usage frequency, form filling mode
[0071] Emotional feedback: mouse hover duration, page return rate, function completion rate
[0072] 1C, Real-time data transmission and storage: The collected user behavior data is transmitted to the low-code platform backend service through a lightweight API interface. The system uses incremental data transmission strategy to reduce network request times and bandwidth consumption. Data storage uses the low-code platform's built-in database or cloud service to ensure data security and accessibility.
[0073] Step two: Lightweight machine learning model construction and deployment: The system uses lightweight machine learning models to analyze user behavior data and identify user preferences and demand patterns.
[0074] 2A, Data preprocessing and feature engineering: Clean and preprocess the collected raw user behavior data, including missing value filling, outlier processing, data standardization, etc. At the same time, perform feature engineering to extract key features related to interface optimization.
[0075] 2B, Lightweight model selection and training: The system uses ktrain and other lightweight machine learning libraries to develop models suitable for low-code environments. Model selection is based on user scenario complexity and resource constraints:
[0076] For simple scenarios, use collaborative filtering algorithms such as user-based or item-based collaborative filtering to analyze user preferences and generate recommendations
[0077] For medium complexity scenarios, use small neural networks like MLP (Multi-Layer Perceptron) or CNN (Convolutional Neural Network) for more accurate predictions
[0078] For high complexity scenarios, use a simplified version of the Transformer architecture like DistilBERT for natural language processing and more complex pattern recognition.
[0079] 2C, Model Lightweight and Low-Code Deployment: The trained model is processed by techniques such as quantization and pruning to reduce model size and computational resource consumption. For example, use TensorFlow Lite framework to convert the model into a format suitable for low-code environment. The model is deployed in the low-code platform, which can be called through the API provided by the platform.
[0080] Step three: interface dynamic generation and optimization: based on the analysis results of the machine learning model, the system realizes the dynamic optimization of the interface through the metadata configuration engine and the framework lifecycle function.
[0081] 3A, Meta-data driven interface generation: Low-code platforms usually use metadata to describe interface layout and component configuration. The system maps the analysis results of the machine learning model into these metadata, and automatically generates or adjusts the interface code through the parsing engine.
[0082] 3B, Dynamic layout rule engine: convert user behavior analysis results into specific interface parameter adjustment rules. Rule engine supports various optimization strategies, including:
[0083] Based on user preferences: preferentially display functions or content frequently used by users.
[0084] Based on operation efficiency: adjust component position and order to reduce user operation path.
[0085] Based on emotional feedback: optimize the visual effect of interface elements to improve user satisfaction.
[0086] Based on environmental adaptation: automatically adjust the layout according to the device type (such as mobile phone, tablet, PC).
[0087] 3C, Real-time dynamic adjustment implementation: through the lifecycle function (such as connectedCallback and attributeChangedCallback) of the framework, realize the real-time dynamic adjustment of the interface. The specific implementation steps include:
[0088] Define the metadata configuration of the interface components in the low-code platform.
[0089] Map the analysis results of the machine learning model to these metadata configurations.
[0090] Real-time update interface layout and component configuration through framework lifecycle functions or low-code platform event triggering mechanisms.
[0091] Ensure that the dynamically adjusted interface maintains good performance and user experience.
[0092] Step four, effect evaluation and feedback loop: Establish a real-time feedback mechanism of user behavior → analysis → interface adjustment → effect evaluation, continuously optimize the interface experience.
[0093] 4A, A / B testing and effect evaluation: Compare the dynamically optimized interface with the original interface to evaluate the optimization effect. Evaluation indicators include user satisfaction, operation efficiency, conversion rate, response speed.
[0094] 4B, feedback data collection and model update: Collect the effect data of A / B testing as feedback for model update. These data include user behavior data, interface performance indicators, user satisfaction scores, etc. The system continuously optimizes the machine learning model through incremental learning mechanism, improves the prediction accuracy and interface optimization effect.
[0095] 4C, optimization closed loop formation: Apply the results of model update to interface optimization again to form a continuous improvement closed loop. This process can be automated or adjusted by business personnel.
[0096] According to the above steps one to four of the embodiment, the approximate steps in the e-commerce application scenario mainly include the following contents:
[0097] Step one: Deploy Web Components in e-commerce applications SDK, collect user ID, device type, browser information, timestamp, product browsing duration, click position, sliding track, page dwell time, page jump sequence, search keywords, shopping cart adding mode, purchase conversion path, mouse hover duration, page return rate, product rating, collection behavior and other user behavior data.
[0098] Step two: Use collaborative filtering algorithm to analyze user behavior data and predict other products that users may be interested in. Including cleaning raw data, extracting features related to product recommendation (such as browsing duration, click frequency, rating, etc.), using ktrain library to train a collaborative filtering model based on user behavior, predicting user ratings for unvisited products, and continuously optimizing model performance through incremental learning mechanism to improve prediction accuracy.
[0099] Step three: Based on the analysis results of the model, dynamically optimize the interface of the e-commerce application through OutSystems' decision table and data binding mechanism.
[0100] Step 4: Evaluate the effectiveness of interface optimization through A / B testing, including click-through rate, conversion rate, page dwell time, and operation path length.
[0101] According to steps one through four of this embodiment, the main steps in the enterprise management system scenario include the following:
[0102] Step 1: Deploy the Web Components event tracking SDK in the enterprise management system. Collect user behavior data such as employee ID, department, position, timestamp, approval step time, form filling mode, function click frequency, approval process path, frequently used function access sequence, system response time, page load time, and operation latency.
[0103] Step 2: Use a small neural network to analyze user behavior data to identify inefficient operations and optimization opportunities.
[0104] Step 3: Based on the model analysis results, dynamically optimize the enterprise management system interface using Mendix's micro-flow activities and layout template mechanism. This includes adjusting the field order of approval forms to reduce input burden, placing frequently used functions in more prominent positions, providing clearer guidance and assistance based on user operational difficulties, and hiding redundant functions to simplify operation paths.
[0105] Step 4: Design an A / B testing plan, compare the optimized interface with the original interface, collect test data, including indicators such as approval efficiency, operation time, and user satisfaction, analyze the test results, evaluate the effectiveness of the interface optimization, feed the effect data back to the machine learning model, and then optimize the model performance and interface design strategy. Based on the test results, decide whether to release the optimized interface as a new version.
[0106] The above are merely preferred embodiments of the present invention, intended only to aid in understanding the method and core ideas of this application. The scope of protection of the present invention is not limited to the above embodiments; all technical solutions falling within the scope of the present invention's concept are within its protection. It should be noted that for those skilled in the art, any improvements and modifications made without departing from the principles of the present invention should also be considered within the scope of protection of the present invention.
[0107] This invention addresses the shortcomings of existing human-computer interaction interfaces, which are limited to basic interactive functions, lack intelligent interface adjustment and personalized services, fail to utilize machine learning for in-depth analysis of user behavior, and are unable to achieve dynamic interface adjustment and efficient performance optimization, thus affecting user experience and satisfaction. By employing cross-framework real-time tracking technology, lightweight machine learning models, and a dual-modal interaction loop, this invention achieves low-code, intelligent generation, and dynamic optimization of the interface, thereby improving user experience and development efficiency.
Claims
1. A low-code interface generation and optimization method based on user behavior, characterized in that, Includes the following steps: S1, cross-framework real-time tracking to collect user interaction behavior data across different front-end frameworks, including: S1-1, Development and integration of the event tracking SDK: The SDK encapsulates user behavior data collection functionality through custom tuples and shadow DOM technology. S1-2, Definition and collection of multi-dimensional user behavior data; S1-3, Real-time data transmission and storage: An incremental data transmission strategy is adopted to transmit the collected user behavior data to the backend service of the low-code platform in real time through a lightweight API interface. The real-time storage of the data adopts the database built into the low-code platform or cloud service to ensure the security and accessibility of the data. S2, Lightweight Machine Learning Model Construction and Deployment: Utilizing a lightweight machine learning model to perform in-depth analysis of the user behavior data transmitted and stored in S1-3, identifying user preferences and demand patterns, specifically including: S2-1, Data Preprocessing and Feature Engineering: Cleaning and preprocessing the collected raw user behavior data, including missing value imputation, outlier handling, and data standardization; at the same time, feature engineering is performed to extract key features related to interface optimization. S2-2, Lightweight Model Selection and Training: Lightweight machine learning libraries are used to develop models suitable for low-code environments. The selection of these models is based on the complexity of the user scenario and resource constraints. S2-3, Model Lightweighting and Low-Code Deployment: The trained model is lightweighted through quantization and pruning techniques to reduce model size and computational resource consumption; S3, Dynamic Interface Generation and Optimization: Based on the analysis results of machine learning models, the system dynamically optimizes the interface through a metadata configuration engine and framework lifecycle functions, specifically including: S3-1, Metadata-driven UI generation: Low-code platforms typically use metadata to describe UI layout and component configuration. The system maps the analysis results of machine learning models into this metadata and automatically generates or adjusts the UI code through the parsing engine. S3-2, Dynamic Layout Rule Engine: This engine transforms user behavior analysis results into specific interface parameter adjustment rules. It supports various optimization strategies, including: Based on user preferences: prioritize displaying frequently used functions or content; Based on operational efficiency: Adjust the position and order of components to reduce user operation paths; Based on emotional feedback: Optimize the visual effects of interface elements to improve user satisfaction; Based on environmental adaptation: Automatically adjusts the layout according to the type of equipment; S3-3, Real-time Dynamic Adjustment Implementation: The interface is dynamically adjusted in real-time using the framework's lifecycle functions. Specific implementation steps include: S3-3-1 defines the metadata configuration of UI components in a low-code platform; S3-3-2 maps the analysis results of the machine learning model to these metadata configurations; S3-3-3 updates the UI layout and component configuration in real time through the framework's lifecycle functions or the event triggering mechanism of the low-code platform; S3-3-4 ensures that the dynamically adjusted interface maintains good performance and user experience; S4, Effectiveness Evaluation and Feedback Closed Loop: Establish a real-time feedback mechanism for user behavior → analysis → interface adjustment → effectiveness evaluation to continuously optimize the interface experience, specifically including: S4-1, A / B Testing and Performance Evaluation: Compare the dynamically optimized interface with the original interface to evaluate the optimization effect. Evaluation metrics include user satisfaction, operational efficiency, conversion rate, and response speed. S4-2, Feedback Data Collection and Model Update: Collect A / B test performance data as feedback for model updates. The data includes user behavior data, interface performance indicators, and user satisfaction scores. The model update is achieved by continuously optimizing the machine learning model through an incremental learning mechanism to improve prediction accuracy and interface optimization effects. S4-3, Optimization of closed-loop formation: The updated results of the S4-2 model are applied again to interface optimization to form a continuous improvement closed loop. The improvement closed loop is automated or through review and adjustment by business personnel.
2. The low-code interface generation and optimization method based on user behavior according to claim 1, characterized in that, The user behaviors in S1-1 include clicking, swiping, and staying on the page.
3. The low-code interface generation and optimization method based on user behavior according to claim 1, characterized in that, The SDK in S1-1 supports Vue, React, and Angular front-end frameworks.
4. The low-code interface generation and optimization method based on user behavior according to claim 1, characterized in that, The user behavior data in S1-2 specifically includes: Basic attributes include user ID, device type, browser information, and timestamp; Interactive behaviors include click location, swipe trajectory, page dwell time, and scroll depth. Operation path: including page jump sequence, function usage frequency, and form filling mode; Emotional feedback includes mouse hover duration, page return rate, and function completion rate.
5. The low-code interface generation and optimization method based on user behavior according to claim 1, characterized in that, The model selection for the complexity and resource constraints of the user scenario in S2-2 is as follows: For simple scenarios: collaborative filtering algorithms, including user- or item-based collaborative filtering, are used to analyze user preferences and generate recommendations; for moderately complex scenarios: small neural networks, including MLP (Multilayer Perceptron) or CNN (Convolutional Neural Network), are used for more accurate predictions. For highly complex scenarios, simplified versions of the Transformer architecture, including DistilBERT, are used for natural language processing and more complex pattern recognition.
6. The low-code interface generation and optimization method based on user behavior according to claim 1, characterized in that, Specifically, S2-3 involves using the TensorFlow Lite framework to convert the model into a format suitable for a low-code environment, deploying the model to a low-code platform, and making API calls provided by the platform.
7. The low-code interface generation and optimization method based on user behavior according to claim 1, characterized in that, The tracking method in S1 can also use the framework's native tracking tool or a visual tracking tool.
8. The low-code interface generation and optimization method based on user behavior according to claim 7, characterized in that, The native tracking tools for the framework are ReactGA or react-ga, vue-analytics or the vue Google Analytics plugin; The visualization tracking tools include Alibaba Cloud Tealeaf, GrowingIO, and Sensors Data.
9. The low-code interface generation and optimization method based on user behavior according to claim 1, characterized in that, The machine learning model in S2 can also use a pre-trained model API or a rule engine.
10. The low-code interface generation and optimization method based on user behavior according to claim 9, characterized in that, The pre-trained model APIs include Google Cloud Vision API, Alibaba Cloud PAI, and AWS Personalize; the rule engines include Drools rule engine, OutSystems decision tables, and Mendix microflow activities.
Citation Information
Patent Citations
Self-adaptive user interface generation method and system based on user preference
CN117850786A
Application development method and system based on low-code platform, electronic equipment and medium
CN118295633A
Low-code development platform intelligent optimization system based on machine learning
CN118467854A