Personalized front-end interactive design method, system, equipment and medium

Abstract

The invention provides a personalized front-end interactive design method, system and device and a medium, and the method comprises the steps: obtaining multi-dimensional information of a target user, the multi-dimensional information comprising user basic information and operation behavior data; analyzing the multi-dimensional information based on a specified analysis algorithm, determining user characteristics of the target user, and constructing a user portrait according to the user characteristics; the user features comprise preference features and behavior features; generating an interactive design scheme according to the user portrait, and applying the interactive design scheme to a front-end interactive interface for interaction; the interactive design scheme comprises interface layout, color matching and interactive logic, and interactive experience better fitting personal preferences and habits of users is provided for the users.

Description

TECHNICAL FIELD

[0001] The present application relates to the technical field of front-end interaction design, and in particular to a personalized front-end interaction design method, system, device and medium based on artificial intelligence and big data technology. BACKGROUND

[0002] With the popularity of the Internet and mobile devices, front-end interaction design has become a key factor in user experience. However, traditional interaction design is often based on general design principles, and the interaction page generated according to the general design principles is unchangeable, which cannot be personalized designed according to the unique needs of each user, nor can it extract valuable information from a large amount of user data to guide the design, resulting in that the user interaction experience cannot be tailored to the personal preferences and habits of the user, and the user experience is poor. SUMMARY

[0003] The embodiments of the present application provide a personalized front-end interaction design method, system, device and medium to solve the problems of related technologies, and the technical solutions are as follows:

[0004] In a first aspect, the embodiments of the present application provide a personalized front-end interaction design method, comprising:

[0005] Obtaining multi-dimensional information of a target user, the multi-dimensional information including user basic information and operation behavior data;

[0006] Analyzing the multi-dimensional information based on a specified analysis algorithm to determine user characteristics of the target user, and constructing a user portrait according to the user characteristics; the user characteristics include preference characteristics and behavior characteristics;

[0007] Generating an interaction design scheme according to the user portrait, and applying the interaction design scheme to a front-end interaction interface for interaction; the interaction design scheme includes interface layout, color matching and interaction logic.

[0008] In an embodiment, obtaining multi-dimensional information of a target user includes:

[0009] Based on the API interface, an HTTP request is sent to the specified server, so that the specified server accesses the social media data of the target user according to the HTTP request, and determines the user basic information and operation behavior data according to the social media data.

[0010] In an embodiment, obtaining multi-dimensional information of a target user includes:

[0011] Accessing a specified web page or application, and executing a target code pre-embedded in the specified web page or application to collect user basic information and operation behavior data in the specified web page or application.

[0012] In an embodiment, the operation behavior data comprises browsing behavior information, purchase records, search keywords, and feedback opinions.

[0013] In an embodiment, the method further comprises:

[0014] updating data of the user operation behavior in real time based on a pre-established dynamic updating mechanism;

[0015] updating the interaction design scheme based on the updating data to obtain an updated scheme;

[0016] applying the updated scheme to the front-end interaction interface to implement interface updating.

[0017] In an embodiment, the method further comprises:

[0018] searching for relevant design elements in a design element library according to the interaction design scheme, and displaying the design elements through a design element library interface;

[0019] identifying a custom operation of the target user to obtain an adjustment instruction, combining and adjusting the selected design elements according to the adjustment instruction to obtain a new interaction design scheme, and the adjustment comprises element size adjustment, position adjustment, color adjustment, and spacing adjustment;

[0020] applying the new interaction design scheme to the front-end interaction interface to update the front-end interaction interface.

[0021] In an embodiment, the method further comprises:

[0022] obtaining a hand-drawn sketch, and determining key features in the hand-drawn sketch based on a specified tool;

[0023] searching for key elements related to the key features in a design element library according to the key features, calling or combining the key elements to generate an interaction prototype, and applying the interaction prototype to the front-end interaction interface.

[0024] In a second aspect, an embodiment of the present application provides a personalized front-end interaction design system, which executes the personalized front-end interaction design method as described above.

[0025] In a third aspect, an embodiment of the present application provides an electronic device, which comprises a memory and a processor. The memory and the processor communicate with each other through an internal connection path. The memory is configured to store instructions, and the processor is configured to execute the instructions stored in the memory. When the processor executes the instructions stored in the memory, the processor executes the method in any one of the embodiments of the aspects.

[0026] In a fourth aspect, the embodiments of the present application provide a computer readable storage medium storing a computer program, when the computer program is run on a computer, the method in any of the above aspects is executed.

[0027] The advantages or beneficial effects of the above technical solution at least include:

[0028] The present application determines the user's preferences and habits and other user characteristics by collecting the user's user basic information and operation behavior data, constructs the user's corresponding user portrait based on the user characteristics, and generates a personalized interaction design scheme using an artificial intelligence algorithm, which includes interface layout, color matching, interaction mode, etc. The generated personalized interaction design scheme will be automatically applied to the front-end interaction interface for user interaction, providing users with a more personalized interaction experience.

[0029] The above summary is merely for the purpose of the description and is not intended to limit in any way. In addition to the illustrative aspects, embodiments and features described above, further aspects, embodiments and features will become apparent to those skilled in the art upon consideration of the drawings and the following detailed description. BRIEF DESCRIPTION OF DRAWINGS

[0030] In the drawings, like reference numerals refer to same or similar functionalities throughout the several views. The drawings are not necessarily to scale. It is to be understood that these drawings only depict certain embodiments in accordance with the disclosure and should not be considered limiting the scope of the disclosure.

[0031] Figure 1 The flowchart of the personalized front-end interaction design method of the present application;

[0032] Figure 2 The flowchart of the personalized front-end interaction design continuous optimization of the present application;

[0033] Figure 3 The structural block diagram of the electronic device of an embodiment of the present application. DETAILED DESCRIPTION

[0034] In the following, only certain example embodiments are simply described. As those skilled in the art can recognize, the described embodiments can be modified in various different ways without departing from the spirit or scope of the present application. Therefore, the drawings and the description are considered to be exemplary in nature rather than limiting.

[0035] With the popularity of the Internet and mobile devices, front-end interaction design has become a key factor in user experience. However, traditional interaction design is often based on general design principles, and the interaction page generated according to the general design principles is fixed and cannot be personalized for the unique needs of each user, nor can it extract valuable information from a large amount of user data to guide the design, resulting in a user interaction experience that does not fit their personal preferences and habits, making the user experience poor.

[0036] To solve the above problems, the embodiment of the present application provides a personalized front-end interaction design method, which realizes personalized interaction design and aims to improve the user interaction experience.

[0037] As shown in the figure, the personalized front-end interaction design method specifically includes the following steps: Figure 1

[0038] Step S1: Obtain multi-dimensional information of the target user, including user basic information and operation behavior data.

[0039] Before obtaining multi-dimensional information, the data source needs to be determined and the types of data to be collected need to be clarified, such as user basic information (age, gender, region, etc.), browsing behavior (click, dwell time, scroll depth, etc.), purchase record, search keywords, feedback, etc.

[0040] After determining the data source and collecting the type of data, the multi-dimensional information of the target user is collected from the specified data source using front-end burying, log collection, API interface calling, etc. to ensure the comprehensiveness and accuracy of the data. At the same time, relevant laws and regulations are followed to ensure the legality and privacy protection of user data.

[0041] Among them, the front-end burying technology automatically collects the required data by embedding code in the webpage or application; specifically, the specified webpage or application is accessed according to the specified data source, and the target code pre-embedded in the specified webpage or application is executed to automatically collect the user basic information and operation behavior data in the specified webpage or application.

[0042] API interface calling, on the other hand, achieves data acquisition and exchange by sending HTTP requests to external services. Specifically, an HTTP request is sent to the specified server based on the API interface, so that the specified server accesses the target user's social media data according to the HTTP request. Social media data refers to data generated, collected and analyzed on social media platforms; user basic information and operation behavior data are determined based on social media data.

[0043] Log collection, on the other hand, centrally manages and processes log files from servers or applications to capture runtime operation behavior data and performance data.

[0044] ​It should be noted that the user basic information includes user age, gender, region, etc., and the operation behavior data includes browsing behavior information (click, dwell time, scroll depth, etc.), purchase record, search keyword, feedback opinion, etc.

[0045] Further, the collected raw data is cleaned to remove data noise, and repeated and invalid data is deleted, and the data is formatted, normalized, etc. Preprocessing is performed in order to facilitate subsequent analysis.

[0046] Step S2: Based on the specified analysis algorithm, the multi-dimensional information is analyzed to determine the user characteristics of the target user, and the user portrait is constructed according to the user characteristics; the user characteristics include preference characteristics and behavior characteristics.

[0047] The user basic information and operation behavior data collected are analyzed in depth by using big data analysis technology (such as clustering analysis, association rule mining, user portrait construction, etc.), and valuable information such as user preferences, habits, and behavior patterns is extracted.

[0048] The depth analysis of user data by using big data analysis technology is a whole process from data collection, preprocessing to application results. Through clustering analysis, user groups are identified, association rule mining is used to find the association between preferences and the association between behaviors, and user portraits are constructed to comprehensively describe user characteristics, and finally these insights are applied to business decisions to optimize marketing strategies, improve user experience and promote the sustainable development of enterprises.

[0049] It should be noted that the preference characteristics refer to the color preference, design style preference, etc. of the target user; and the behavior characteristics refer to the browsing time distribution, purchase frequency and amount, etc. Behavior habits.

[0050] Further, by using time series analysis, machine learning prediction model, etc. Method, predict the possible preferences and behavior changes of users in the future, based on the prediction results, adjust the front-end interaction design strategy, such as product recommendation algorithm, interface layout, etc. ; And through comparative experiments, verify the effect of intelligent analysis and prediction in improving user satisfaction and increasing user stickiness. This helps to adjust the design strategy in advance to meet the future needs of users.

[0051] Step S3: According to the user portrait, an interaction design scheme is generated, and the interaction design scheme is applied to the front-end interaction interface for interaction.

[0052] Different interaction prototypes can be designed for each user group in advance, using tools such as Sketch, Adobe XD, Figma, etc. In this embodiment, the corresponding interaction prototype is determined according to the user portrait, and then the content management system (CMS) is used to determine the interaction design scheme according to the behavior characteristics and preference characteristics of the user, the content of the interaction prototype is adjusted according to the interaction design scheme, and is applied to the front end, so as to obtain the front-end interaction interface to provide more personalized and attractive user experience.

[0053] The content of the interaction design scheme includes:

[0054] Interface layout: Different interface layouts are designed according to the browsing habits of user groups. For example, for users who like to quickly browse, a simple and clear layout can be provided; for users who like to delve into research, more detailed information and interactive elements can be provided.

[0055] Color and style matching: According to the color preferences and design style preferences of users, the color matching and overall style of the interface are adjusted, which helps to improve the visual satisfaction and immersion of users.

[0056] Interaction logic: According to the behavior habits of users, the interaction mode that is more in line with the expectations of users is designed; for example, for frequent buyers, one-click purchase, quick settlement and other convenient functions can be provided.

[0057] In addition, using collaborative filtering, content recommendation and other algorithms, according to the purchase history and browsing behavior of users, relevant products or content are recommended, which not only can improve the satisfaction of users, but also can increase the stickiness and conversion rate of users.

[0058] Further, a dynamic updating mechanism is established in advance, and the updating data of user operation behavior is captured in real time based on the pre-established dynamic updating mechanism; the interaction design scheme is automatically adjusted based on the updating data to obtain an updating scheme; the updating scheme is applied to the front-end interaction interface to realize interface updating. Among them, the automatic adjustment of the interaction design scheme includes weight adjustment, model updating and other strategies to ensure the accuracy and timeliness of the recommendation results and interface design.

[0059] It should be noted that in the recommendation algorithm, weight adjustment refers to adjusting the importance of different features or factors in the recommendation decision according to the changes in user behavior and preferences. For example, if a user has recently purchased electronic products more frequently, the recommendation algorithm will increase the weight of features related to electronic products. In the recommendation algorithm, model updating refers to regularly or real-time updating the recommendation model according to the updating data of the user to ensure the accuracy and timeliness of the recommendation results.

[0060] In the interface design process, weight adjustment is adjusting the weight of design elements in the front-end interface according to user behavior data, so that the elements most frequently interacted by users are more prominent or easily accessible; for example, according to the interaction frequency of users with interface elements, adjusting the size, color or position of buttons to improve interaction efficiency. In the interface design process, model updating is updating the machine learning model used to predict user needs and preferences, updating the interface design according to the prediction results, or regularly updating the user behavior model used to identify behavior characteristics to reflect the latest trends in user behavior, so as to adjust the interface design to adapt to these changes.

[0061] The specific implementation of the dynamic updating mechanism is as follows:

[0062] Dynamic updating is achieved through AJAX (Asynchronous JavaScript and XML), which allows JavaScript to exchange data with the server and update partial web page content without reloading the entire page. The specific implementation steps are as follows:

[0063] When the user performs an operation (such as clicking a button, entering data, etc.), JavaScript is triggered to use the XMLHttpRequest object to establish a connection with the server; and through the XMLHttpRequest object, an asynchronous request is sent to the server, requesting the required data or operation. After the server processes the request, the result is returned to the browser, at which point JavaScript parses the data returned by the server and dynamically updates the page content.

[0064] In addition, dynamic updating can also be achieved through WebSocket, which provides a channel for full-duplex communication over a single persistent connection. Unlike HTTP, WebSocket allows the server to actively push information to the client after establishing a connection without the client having to initiate another request, making WebSocket an ideal choice for implementing real-time data updates. The specific implementation is as follows:

[0065] The client and server establish a connection through the WebSocket protocol, and the server can actively push the latest data or messages to the client. After receiving the data, JavaScript is responsible for parsing the data and updating the page content.

[0066] Dynamic updating can also be achieved through Server-Sent Events (SSE) technology, which allows the server to actively send events to the client. Compared with WebSocket, SSE is simpler and more suitable for one-way communication scenarios (i.e., server to client). The specific implementation is as follows:

[0067] The client establishes an SSE connection with the server through an HTTP request, and the server can send event messages to the client at any time. After receiving the event, JavaScript is responsible for parsing the event and updating the page content.

[0068] For content that needs to be cached but may be frequently updated, a dynamic cache management strategy can be used. For example, using Service Workers for fine-grained cache control, including cache content updates, verification, and cleanup. Among them, the cache content is to cache the static resources that do not change frequently (such as images, CSS, JavaScript files, etc.) to the client. At the same time, ETag or Last-Modified and other HTTP header information can be used to verify whether the cache content is expired. If the cache content is expired or invalid, send a request to the server to get the latest content and update the cache.

[0069] In addition to WebSocket and SSE, there are also some real-time data push frameworks (such as Meteor, Firebase, etc.) that can help developers more easily implement dynamic updates of the front-end interactive interface. These frameworks usually provide rich API and tool sets, supporting multiple communication protocols and data formats.

[0070] For complex front-end applications, client-side state management libraries (such as Redux, Vuex, etc.) can be used to manage the state and data flow of the application. Client-side state management libraries allow developers to update and manage the state of the application in a predictable way, thereby achieving dynamic updates of the page.

[0071] In addition to automatically generating corresponding interaction design schemes according to user portraits, the embodiment can also further personalize settings in combination with a design element library interface, thereby improving the satisfaction and freshness of user experience.

[0072] Specifically, a rich design element library is established in advance, and the design element library includes interface components, icons, color schemes, animation effects, and other elements, so as to quickly call and combine in the design process.

[0073] The design element library is matched with a corresponding design element library interface, and the design element library interface displays:

[0074] Top navigation bar: including search box, filter (such as filtering by type, style, color), and library name / logo, to facilitate users to quickly locate the required resources.

[0075] Side bar / category directory: lists all design element categories, such as "interface components", "icon library", "color scheme", "animation effect", etc., and clicking any category can expand to display the specific elements under the category.

[0076] Main Content Area: Displays design elements under the currently selected category. Elements are arranged in a grid or list format, each accompanied by a preview image, name, tags, and a brief description.

[0077] Preview Panel: A panel that pops up next to or below the main content area when a user clicks on an element, showing a detailed preview, usage instructions, download link, or a button to use the element directly in the editor.

[0078] Search Bar: Located prominently on the interface, supports keyword search for quick location of specific design elements.

[0079] Favourites / Download / Use Buttons: Provided next to each element or in the preview panel, allowing users to favourite, download, or directly apply the element in their project.

[0080] Users can customize the content in the design element library interface according to their own needs.

[0081] The customization steps are as follows:

[0082] Clarify Design Requirements: First, clarify the specific requirements of the current design task, including the required interface components, icon types, color combinations, and animation effects, etc.

[0083] Use Search and Filtering: In the design element library interface, use the search bar to input keywords to quickly locate related elements, or use the sidebar's classification filtering function to narrow down the selection range.

[0084] Preview and Selection: Click on the element of interest to view the detailed preview and evaluate whether it meets the design requirements. After confirmation, you can choose to download the element or directly call it in the supported design tools (if the library integrates such functions).

[0085] Combination and Adjustment: Import the selected design elements into the design project and combine and adjust them according to the design requirements. This may include adjusting the size, position, color, spacing, etc. of the elements to ensure the harmony and unity of the overall design.

[0086] Testing and Feedback: After completing the design, conduct necessary tests to verify the effectiveness of the design elements in actual application. Collect feedback from users or stakeholders and make adjustments and optimizations as needed.

[0087] Update and Maintenance: As the design project progresses and the brand / product develops, regularly update the design element library, add new elements, optimize existing elements, or adjust the classification structure to maintain the freshness and practicality of design resources.

[0088] The custom operation of the user in the design element library interface is converted into a corresponding adjustment instruction, and the design element selected by the user in the design element library interface is combined and adjusted according to the adjustment instruction, so as to generate a new interactive design scheme; after the new interactive design scheme is determined, the design elements related to the new interactive design scheme are searched in the design element library, and the interactive prototype matched with the user portrait is optimized according to the design elements, the interactive prototype is applied to the front end after optimization, and the front-end interactive interface for display and interaction is formed. The embodiment combines the user portrait and the custom operation to jointly generate an interactive design scheme that meets the user's expectations and is rich in creativity, thereby improving the user experience.

[0089] Further, the designer can also quickly express the design idea through hand-drawn sketches, which can be paper or drawn by digital tools (such as Procreate or Sketchbook on iPad); the hand-drawn sketch is obtained, the key features in the hand-drawn sketch are determined based on a specified tool (such as Axure RP, Adobe XD, Sketch, Figma, etc.), the key elements related to the key features are searched from the design element library according to the key elements, the hand-drawn sketch is converted into an interactive interactive prototype according to the key elements, and the interactive prototype is applied to the front-end interactive interface for display.

[0090] Further, in order to further improve the user experience and the intelligent level of personalized front-end interaction, techniques such as generative adversarial networks (GANs), variational autoencoders (VAEs), Transformer models, and deep reinforcement learning can be combined into the personalized front-end interaction design method based on artificial intelligence and big data.

[0091] Specifically, the trained generator of the generative adversarial network (GAN) is embedded into the front-end interaction system, and image content or diversified recommendation content that meets the user's preferences is dynamically generated according to the user's behavior and preferences. The generated image can be used in application scenarios such as the background image of the personalized interface, the user avatar, or the personalized icon, while the generated recommendation content can be an article title, a product picture, etc., improving the diversity and appeal of the recommendation system.

[0092] In the multi-dimensional information collection and analysis stage of the user, the variational autoencoder (VAEs) is used to encode the user behavior data, extract latent features, and the latent features can be used to construct the user portrait, analyze the user's behavior mode and preferences, and dynamically adjust the front-end interactive interface based on the extracted latent features to display personalized content such as articles and music recommendations.

[0093] In personalized front-end interaction, the Transformer model can be used in intelligent customer service, chat robots, and other scenarios to provide natural language interaction capabilities. By embedding a pre-trained Transformer model into the front-end interaction system, it can be used to process user natural language inputs and generate personalized responses or recommendation reasons based on user inputs and preferences. It can also dynamically adjust the output of the Transformer model based on user feedback and behavior data to better meet individual user needs.

[0094] A reasonable environmental state, action space, and reward function are designed to model the front-end interaction process as a reinforcement learning problem. A deep neural network is used as the agent's decision-making network, which is trained and optimized using user interaction data. The trained agent is embedded into the front-end interaction system to optimize interface layout, color matching, and other aspects based on user interaction data, thereby improving user experience. Deep reinforcement learning can be used to train an agent that can continuously optimize recommendation strategies, improving the accuracy and personalization of the recommendation system.

[0095] Combining GANs, VAEs, Transformer models, and deep reinforcement learning algorithms into the AI and big data-based personalized front-end interaction design method can fully leverage the advantages of these algorithms in data generation, feature extraction, natural language processing, and intelligent decision-making, improving the intelligence level and user experience of the front-end interaction system. In practical applications, appropriate algorithms and combinations should be selected based on specific scenarios and needs, and continuously optimized and adjusted to adapt to user changes and needs.

[0096] As shown in Figure 2 The personalized front-end interaction design method based on big data and artificial intelligence combines big data analysis with artificial intelligence algorithms to achieve data-driven intelligent decision-making and optimization. It also builds an intelligent feedback loop mechanism to continuously learn and optimize personalized front-end interaction design by collecting user feedback and data in real time. At the same time, A / B testing and multivariate testing techniques are used to evaluate and compare different interaction design schemes to find the optimal design scheme. With the continuous advancement of technology and changes in user needs, the personalized front-end interaction design is continuously iterated and upgraded to maintain its competitiveness and innovation.

[0097] The following is an example of the personalized front-end interaction design method for an online shopping website:

[0098] For example, when a user first visits an online shopping website, the system collects basic information and operation behavior data through the front-end interface. Then, using big data analysis techniques, the system cleans, organizes, and analyzes the user's basic information and operation behavior data, extracts the user's shopping preferences, browsing habits, and other user characteristics, and builds a user profile. Next, based on the user characteristics, the system uses artificial intelligence algorithms to generate personalized interaction design schemes, such as unique product recommendation algorithms, personalized page layouts, and color combinations. Finally, these personalized interaction design schemes are automatically applied to the front-end interface, providing users with a shopping experience that better fits their personal preferences and habits.

[0099] As the user's shopping behavior on the website continues to accumulate, real-time user feedback and data are collected, and the user profile is continuously updated and optimized to ensure its accuracy and timeliness. Based on user feedback, the system continuously learns and optimizes artificial intelligence algorithms and big data analysis techniques to further improve the accuracy and efficiency of personalized interaction design.

[0100] At the same time, the actual business scenarios can be used to verify and evaluate the effectiveness of personalized front-end interaction design in improving user satisfaction, increasing user stickiness, and increasing product conversion rates. The application of artificial intelligence and big data technology is also verified. That is, in different time periods, different user groups, and different product categories, comprehensive testing of personalized front-end interaction design is conducted. Real-time monitoring of user behavior data and analysis of the performance of personalized front-end interaction design in different scenarios are conducted. Based on the data monitoring and analysis results, optimization suggestions for personalized front-end interaction design are proposed, such as adjusting recommendation algorithm parameters and optimizing interface layout.

[0101] Another embodiment of the present application provides a personalized front-end interaction design system that performs the personalized front-end interaction design method as described above.

[0102] The system collects multi-dimensional information such as user's basic information, operation behavior, feedback, etc. through the front-end interface, and uses big data analysis techniques to clean, organize, and analyze the multi-dimensional information, extracting valuable user characteristics such as user preferences and habits. Based on user characteristics, the system uses artificial intelligence algorithms to generate personalized interaction design schemes, which may include unique interface layouts, color combinations, animation effects, and interaction methods, aiming to provide users with a more personalized interaction experience. The generated personalized interaction design schemes are automatically applied to the front-end interface, and the system can dynamically adjust and optimize the interaction design schemes based on real-time changes in user data to ensure continuous optimization of user experience. At the same time, the system continuously collects user feedback and data, and uses artificial intelligence algorithms for continuous learning and optimization to improve the accuracy and efficiency of personalized interaction design.

[0103] The module functions of the system of the embodiments of the present application can refer to the corresponding descriptions in the above methods, and will not be repeated here.

[0104] Another embodiment of the present application provides an electronic device, Figure 3 A structural block diagram of an electronic device according to an embodiment of the present application is shown. As shown, the electronic device includes a memory 100 and a processor 200, and the memory 100 stores a computer program which can be run on the processor 200. The processor 200 implements the individual front-end interaction design method in the above embodiment when executing the computer program. The number of the memory 100 and the processor 200 can be one or more. Figure 3

[0105] The electronic device further includes:

[0106] A communication interface 300 for communicating with external devices and transmitting data.

[0107] If the memory 100, the processor 200 and the communication interface 300 are independently implemented, the memory 100, the processor 200 and the communication interface 300 can be connected to each other through a bus and complete the communication therebetween. The bus can be an Industry Standard Architecture (ISA) bus, a Peripheral Component Interconnect (PCI) bus or an Extended Industry Standard Architecture (EISA) bus, etc. The bus can be divided into an address bus, a data bus, a control bus, etc.

[0108] Optionally, in specific implementation, if the memory 100, the processor 200 and the communication interface 300 are integrated on a chip, the memory 100, the processor 200 and the communication interface 300 can complete the communication therebetween through an internal interface.

[0109] The embodiments of the present application provide a computer readable storage medium, which stores a computer program, and the program is executed by a processor to implement the method provided in the embodiments of the present application.

[0110] The embodiments of the present application further provide a chip, which includes a processor, is used for calling and running instructions stored in a memory, and makes a communication device installed with the chip execute the method provided in the embodiments of the present application.

[0111] ​The embodiment of the present application further provides a chip, comprising: an input interface, an output interface, a processor and a memory, the input interface, the output interface, the processor and the memory are connected through internal connection channels, the processor is used for executing the code in the memory, and when the code is executed, the processor is used for executing the method provided by the embodiment of the present application.

[0112] It should be understood that the processor described above can be a central processing unit (CPU), and can also be other general-purpose processors, digital signal processors (DSP), application specific integrated circuits (ASIC), field programmable gate arrays (FPGA) or other programmable logic devices, discrete gates or transistor logic devices, discrete hardware components, etc. The general-purpose processor can be a microprocessor or any conventional processor, etc. It should be noted that the processor can be a processor supporting an advanced RISC machine (ARM) architecture.

[0113] Further, the aforementioned memory can include a read-only memory, and a random access memory, and can further include a non-volatile random access memory. The memory can be a volatile memory or a non-volatile memory, or can include both volatile and non-volatile memory. The non-volatile memory can include a read-only memory (ROM), a programmable ROM (PROM), an erasable PROM (EPROM), an electrically EPROM (EEPROM), or a flash memory. The volatile memory can include a random access memory (RAM), which is used as an external cache. By way of example, but not limitation, a number of forms of RAM are available. For example, a static RAM (SRAM), a dynamic RAM (DRAM), a synchronous DRAM (SDRAM), a double data rate SDRAM (DDR SDRAM), an enhanced SDRAM (ESDRAM), a synchlink DRAM (SLDRAM), and a direct rambus RAM (DR RAM) can be employed.

[0114] In the above-described embodiments, all or a part can be implemented by software, hardware, firmware, or any combination thereof. When implemented as software, it can be implemented in the form of a computer program product. The computer program product includes one or more computer instructions. When the computer program instructions are loaded into and executed by a computer, all or part of the procedures or functions according to the present application are generated. The computer can be a general-purpose computer, a special-purpose computer, a computer network, or other programmable apparatus. The computer instructions can be stored in a computer-readable storage medium or transmitted from one computer-readable storage medium to another computer-readable storage medium.

[0115] In the description of the present specification, the description of the terms "one embodiment", "some embodiments", "an example", "a specific example", or "some examples" and the like means that the specific features, structures, materials or characteristics described in connection with the embodiment or example are included in at least one embodiment or example of the present application. Also, the specific features, structures, materials or characteristics described can be combined in any appropriate manner in any one or more embodiments or examples. In addition, the person skilled in the art can combine and combine the different embodiments or examples described in the specification and the features of the different embodiments or examples without contradiction.

[0116] In addition, the terms "first", "second" are only for descriptive purposes and cannot be understood as indicating or implying relative importance or implicitly indicating the number of the indicated technical features. Therefore, the features defined with "first", "second" can explicitly or implicitly include at least one of the features. In the description of the present application, the meaning of "a plurality of" is two or more, unless otherwise specifically limited.

[0117] The above is only a specific embodiment of the present application, but the protection scope of the present application is not limited thereto, and any person skilled in the art can easily think of various changes or replacements within the technical range disclosed by the present application, which should be covered within the protection scope of the present application. Therefore, the protection scope of the present application should be subject to the protection scope of the claims.

Claims

1. A method for individual front-end interaction design, characterized in that, The method comprises the following steps: acquiring multi-dimension information of a target user, the multi-dimension information comprising user basic information and operation behavior data; analyzing the multi-dimension information based on a specified analysis algorithm to determine user characteristics of the target user and to construct a user portrait according to the user characteristics; the user characteristics comprising preference characteristics and behavior characteristics; generating an interaction design scheme according to the user portrait and applying the interaction design scheme to a front-end interaction interface for interaction; the interaction design scheme comprising interface layout, color matching and interaction logic.

2. The individual front end interaction design method of claim 1, wherein, The step of acquiring multi-dimension information of a target user comprises the following steps: sending an HTTP request to a specified server based on an API interface, so that the specified server accesses social media data of the target user according to the HTTP request and determines the user basic information and the operation behavior data according to the social media data.

3. The individual front end interactive design method of claim 1, wherein, The step of acquiring multi-dimension information of a target user comprises the following steps: accessing a specified webpage or application and executing a target code pre-embedded in the specified webpage or application to collect the user basic information and the operation behavior data in the specified webpage or application.

4. The personalized front-end interaction design method of claim 1, wherein, The operation behavior data comprises browsing behavior information, purchase records, search keywords and feedback opinions.

5. The personalized front-end interaction design method of claim 1, wherein, The method further comprises the following steps: real-time capturing of update data of user operation behavior based on a pre-established dynamic update mechanism; updating the interaction design scheme based on the update data to obtain an update scheme; applying the update scheme to the front-end interaction interface to realize interface update.

6. The personalized front-end interaction design method of claim 1, wherein, The method further comprises the following steps: searching for relevant design elements in a design element library according to the interaction design scheme and displaying the design elements through a design element library interface; identifying a custom operation of the target user to obtain an adjustment instruction, combining and adjusting the selected design elements according to the adjustment instruction, obtaining a new interaction design scheme and applying the new interaction design scheme to the front-end interaction interface; the adjustment comprises element size adjustment, position adjustment, color adjustment and spacing adjustment.

7. The personalized front-end interaction design method of claim 1, wherein, The method further comprises the following steps: acquiring a hand-drawn sketch and determining key characteristics in the hand-drawn sketch based on a specified tool; searching for key elements related to the key characteristics in a design element library according to the key characteristics, calling or combining the key elements to generate an interaction prototype and applying the interaction prototype to the front-end interaction interface.

8. A personalized front-end interaction design system, characterized by, The method of personalized front-end interaction design according to any one of claims 1-7.

9. An electronic device, comprising: The method comprises the following steps: a processor and a memory, the memory storing instructions, the instructions being loaded and executed by the processor to implement the method of personalized front-end interaction design according to any one of claims 1-7.

10. A computer-readable storage medium, characterized in that, The computer readable storage medium stores a computer program, and the computer program is executed by the processor to implement the method of personalized front-end interaction design according to any one of claims 1-7.

Images