Interaction method based on image-text, template generation method, product, equipment and medium

By using a text-based interactive method, product information and interactive components are bound together at the data structure level. Combined with dynamic tag classification and animation parameter mapping, the problem of the single interactive method in online voting systems is solved, achieving instant and vivid visual feedback and a seamless user experience, thereby improving user participation and interaction efficiency.

CN121904221APending Publication Date: 2026-04-21SHANGHAI SHIZHUANG INFORMATION TECHNOLOGY CO LTD
View PDF 0 Cites 0 Cited by

Patent Information

Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
SHANGHAI SHIZHUANG INFORMATION TECHNOLOGY CO LTD
Filing Date
2025-12-30
Publication Date
2026-04-21

AI Technical Summary

Technical Problem

Existing online voting systems have limited interaction methods and are difficult to connect with relevant information, resulting in a poor user experience.

Method used

By adopting a text-based interactive method, interactive text and image instances are obtained, and the product information to be interacted with and the interactive components are bound into an inseparable whole at the data structure level. The dynamic effects triggered by user operations are limited to display within specific partitions. Combined with dynamic tag classification and a pre-trained animation parameter mapping model, it provides instant and vivid visual feedback.

Benefits of technology

It enhances user engagement and control, increases the confidence and fun of interactive operations, achieves a seamless and consistent user experience, and improves the attractiveness of content and the efficiency of interaction.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN121904221A_ABST
    Figure CN121904221A_ABST
Patent Text Reader

Abstract

The invention provides an image-text-based interaction method, a program product, an electronic device and a storage medium, the method comprising: obtaining an interactive image-text instance, the interactive image-text instance comprising at least two partitions, each partition comprising to-be-interacted commodity information and an interaction component; wherein the interaction component is used for receiving an interaction operation and triggering an associated interaction logic; analyzing the interactive image-text instance through a rendering engine, and drawing a graphical interface containing to-be-interacted commodity information and an interaction component; monitoring an interactive operation of a user on the commodity based on an interactive component in the graphical interface; and in response to the monitored interaction operation, executing interaction logic corresponding to the interaction operation, and displaying a dynamic effect corresponding to the interaction operation in the partition to which the interaction component belongs. When a user triggers interaction components such as voting on the interface, associated dynamic visual feedback can be provided in the area corresponding to the image-text content, and a brand new content interaction mode based on interactive images and texts is realized.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] This application relates to the field of computer technology, and more specifically, to a text-based interactive method, a template generation method, a product, a device, and a medium. Background Technology

[0002] With the increasing openness and progress of society and the rapid development of the economy, polls, public selections, and opinion gathering have played an increasingly important role in social life. The widespread adoption of the internet, with its convenience and interactivity, has spurred the development of numerous online voting systems and various interactive websites, improving upon the shortcomings of traditional offline voting. However, current interactive methods are relatively simplistic and struggle to connect with relevant information, resulting in a poor user experience. Summary of the Invention

[0003] The purpose of this application is to provide a text-based interactive method, template generation method, product, device, and medium to improve the above-mentioned problems.

[0004] In a first aspect, embodiments of this application provide a text-based interactive method, comprising: obtaining an interactive text-image instance, the interactive text-image instance including at least two partitions, each partition including product information to be interacted with and an interactive component; wherein the interactive component is used to receive interactive operations and trigger associated interactive logic; parsing the interactive text-image instance through a rendering engine to draw a graphical interface containing the product information to be interacted with and the interactive component; listening to user interactive operations on the product based on the interactive component in the graphical interface; and in response to the detected interactive operation, executing the interactive logic corresponding to the interactive operation, and displaying dynamic effects corresponding to the interactive operation within the partition to which the interactive component belongs.

[0005] In the aforementioned implementation process, the novel content interaction mode based on interactive graphics and text is completely different from traditional static images or linear videos. In this solution, the "graphics and text" is a dynamic application with embedded complete interactive logic and animation capabilities. When a user triggers interactive components such as voting on the interface, it provides immediate, vivid, and dynamic visual feedback bound to the operation logic in the area corresponding to the graphic and text content. This responsive experience, unlike the one-way playback of video content or the display of static content, greatly enhances the user's sense of participation and control. Simultaneously, because the dynamic effects are precisely constrained within the specific area where the operation occurs, the interactive feedback has a clear target and direction, effectively guiding the user's attention, increasing the confidence and fun of the interactive operation, thereby strengthening the overall attractiveness of the interactive graphic and text content and improving the user experience.

[0006] Optionally, in this embodiment of the application, before obtaining the interactive graphic and text instance, the method further includes: receiving a publishing instruction sent by a user, the publishing instruction including at least one product information; wherein, the triggering method of the publishing instruction includes: the user selecting a product and triggering it on the publisher interface, or the user selecting a product and triggering it on the product details page; in response to the publishing instruction, obtaining a template file for generating the interactive graphic and text instance; the template file includes at least one replaceable graphic and text element and at least one interactive behavior marker; binding corresponding interactive logic to the template according to the interactive behavior marker in the template file, the interactive logic including at least voting logic; filling the replaceable graphic and text element in the template file with product information to generate the interactive graphic and text instance.

[0007] In the above implementation process, a template matching mechanism ensures that each product can find the most suitable display format for its characteristics, enhancing the expressiveness of the content. The resulting interactive graphic and text instances upgrade static product displays into interactive graphic and text elements that allow users to participate. Users not only receive information but also actively engage in the dynamic effects of the graphic and text through interactive operations such as voting. Automated processes improve the efficiency of instance generation.

[0008] Optionally, in this embodiment, the interactive operation includes a voting operation; the interactive behavior marker is stored in the layer marker information associated with the interactive component in JSON data format, and the layer marker information includes the behavior event type; in response to listening to the interactive operation, the interactive logic corresponding to the interactive operation is executed, and the dynamic effect corresponding to the interactive operation is displayed in the partition to which the interactive component belongs, including: according to the behavior event type in the layer marker information associated with the interactive component that triggered the voting operation, the voting logic corresponding to the voting logic is executed, so that the dynamic effect corresponding to the interactive operation is displayed in the partition to which the interactive component belongs.

[0009] In the aforementioned implementation process, the system provides real-time and visually rich dynamic feedback to users' voting actions, transforming traditional static content into an interactive participation mode. By presenting animation effects bound to the operation logic within specific sections—that is, displaying dynamic effects for the section whose products are voted for—the system enhances users' sense of certainty and engagement. The entire interaction process is smooth and coherent, improving the user experience during content interaction.

[0010] Optionally, in this embodiment of the application, the partitions in the interactive graphic instance are determined by dynamic tag classification technology based on the category tags of the product information; wherein, the dynamic tag classification technology is used to dynamically generate category tags for the product based on at least one of the product's function, appearance, sales volume and / or price attributes, and determine the partition affiliation of the product in the interactive graphic instance based on the category tags.

[0011] In the aforementioned implementation process, the dynamic tag classification and partitioning mechanism automatically identifies the core features of products and user concerns, and generates the most comparative and interactive partitioning layout accordingly, enhancing the relevance and expressiveness of the content. Tag-based classification and partitioning allows users to more intuitively understand the differences and unique advantages between products.

[0012] Optionally, in this embodiment, the interactive operation includes a voting operation; displaying the dynamic effect corresponding to the interactive operation includes: acquiring statistical feature data of the current voting event in real time, the data including at least the total number of votes, voting rate, or the difference in votes between options; inputting the statistical feature data into a pre-trained animation parameter mapping model to generate dynamic animation control parameters, the dynamic animation control parameters being used to control at least one of the dynamic effect graphics, particle effect density, camera shake amplitude, or color saturation; and rendering and playing the dynamic effect matching the statistical feature data in real time based on the dynamic animation control parameters.

[0013] In the above implementation process, statistical feature data is input into a pre-trained animation parameter mapping model to generate dynamic animation control parameters. This transforms abstract voting data into intuitive and expressive visual information, allowing users to directly perceive the overall situation and dynamic changes of the voting activity. The model obtains parameter mapping relationships, ensuring that the intensity of visual feedback corresponds to the fervor of the voting activity. The real-time distribution of votes can be discerned through the dynamic effects.

[0014] Optionally, in this embodiment of the application, the rendering engine parses the interactive graphic and text instance and draws a graphical interface containing interactive product information and interactive components, including: the rendering engine reads a template file exported by the film and television special effects software in the interactive graphic and text instance; the template file includes binary encoding of keyframe data; the rendering engine decodes the binary encoding and executes the keyframe data to draw a graphical interface containing interactive product information and interactive components.

[0015] In the above implementation process, the compact encoding format of the template file ensures fast loading and parsing of resources, and the rendering engine accurately restores the keyframe data, improving the smooth transition and visual consistency of animation effects.

[0016] Optionally, in this embodiment of the application, after displaying the dynamic effect corresponding to the interactive operation within the partition to which the interactive component belongs, the method further includes: sending the user's voting operation to the server; receiving the current voting statistics result from the server; displaying the voting statistics result on the graphical interface; generating a global heatmap layer based on the voting statistics result; and dynamically mapping the real-time vote density of each partition with different color depths in the heatmap layer.

[0017] In the above implementation process, the real-time display of statistical results allows users to clearly perceive the overall voting situation, and the statistical information is visualized through dynamic heat map layers, making the information more clearly displayed.

[0018] Secondly, embodiments of this application also provide a method for generating interactive graphic templates, applied to an electronic device configured with film and television special effects software, comprising: responding to a design operation triggered by a user based on the electronic device, creating an animation template project file in the graphical user interface of the film and television special effects software, comprising at least one replaceable graphic element and at least one interactive behavior mark; wherein the interactive behavior mark is associated with a specified animation layer, and the interactive behavior mark is used to define the interaction logic of the animation layer; performing structured export processing on the animation template project file to generate a corresponding template file.

[0019] In the aforementioned implementation process, by combining the powerful animation production capabilities of professional film and television special effects software with the technical requirements of interactive content, an efficient template production process is achieved. This allows animation effects to be easily converted into basic templates for interactive content, improving the production efficiency and quality of interactive content while reducing the difficulty of operation for users.

[0020] Thirdly, embodiments of this application also provide a computer program product, including computer program instructions, which are executed by a processor to perform the method provided in the first aspect or any implementation thereof.

[0021] Fourthly, embodiments of this application also provide an electronic device, including: a processor and a memory, the memory storing computer program instructions, which are executed by the processor to perform the method provided in the first aspect or any implementation thereof.

[0022] Fifthly, embodiments of this application also provide a computer-readable storage medium storing computer program instructions, which, when executed by a processor, perform the method provided in the first aspect or any implementation thereof.

[0023] This application utilizes a text-based interactive method, template generation method, program product, electronic device, and storage medium to achieve a novel content interaction mode based on interactive text and images, completely different from traditional static images or linear videos. In this solution, the "text and images" are a dynamic application with embedded complete interactive logic and animation capabilities. When a user triggers interactive components such as voting on the interface, immediate, vivid, and dynamic visual feedback bound to the operation logic is provided in the area corresponding to the text and image content. This responsive experience, unlike one-way playback of video content or static content display, greatly enhances the user's sense of participation and control. Simultaneously, because the dynamic effects are precisely constrained within the specific area where the operation occurs, the interactive feedback is targeted and clear, effectively guiding the user's attention, increasing the confidence and fun of the interactive operation, thereby enhancing the overall attractiveness of the interactive text and image content and improving the user experience. Attached Figure Description

[0024] To more clearly illustrate the technical solutions of the embodiments of this application, the accompanying drawings used in the embodiments of this application will be briefly introduced below. It should be understood that the following drawings only show some embodiments of this application and should not be regarded as a limitation of the scope. For those skilled in the art, other related drawings can be obtained based on these drawings without creative effort.

[0025] Figure 1 A flowchart illustrating a text-image interaction method provided in an embodiment of this application; Figure 2 A schematic diagram of a graphical interface provided in an embodiment of this application; Figure 3 A schematic diagram illustrating the dynamic effect corresponding to an interactive operation provided in an embodiment of this application; Figure 4 This is a schematic diagram of the structure of an electronic device provided in an embodiment of this application. Detailed Implementation

[0026] The embodiments of the technical solution of this application will now be described in detail with reference to the accompanying drawings. These embodiments are only used to more clearly illustrate the technical solution of this application and are therefore merely examples, and should not be used to limit the scope of protection of this application.

[0027] Unless otherwise defined, all technical and scientific terms used herein have the same meaning as commonly understood by one of ordinary skill in the art to which this application belongs; the terminology used herein is for the purpose of describing particular embodiments only and is not intended to limit this application.

[0028] In the description of the embodiments of this application, technical terms such as "first" and "second" are used only to distinguish different objects and should not be construed as indicating or implying relative importance or implicitly specifying the number, specific order, or primary and secondary relationship of the indicated technical features. In the description of the embodiments of this application, "multiple" means two or more, unless otherwise explicitly defined.

[0029] Common interactive voting implementations currently include linear sequential designs and external link-based designs. For linear sequential designs: the voting options (such as the product description in the image and text) are completely separated from the final voting button. Users first read the product information (image and text), which is static and cannot be interacted with. They then need to manually scroll to the bottom of the page or another fixed area to find the unified voting component to interact with.

[0030] For external link redirection designs: Products are displayed in the form of images and text on the homepage or list page, but after the user clicks "vote" or "like", the system will redirect to a brand new, specialized H5 page or mini-program page to complete the interaction, resulting in a break in the user experience.

[0031] Whether it's a button that requires scrolling to find or an external link that triggers a page redirect, both forcibly interrupt the user's immersive browsing process, disrupting the integrity of the content itself and turning interactive operations into an extra, cumbersome step rather than a natural extension of the text and images. Furthermore, after a user completes a vote, traditional technology typically only displays "Vote Successful" on the vote button or refreshes the entire page to update the vote count. This feedback method is extremely rigid and fails to intuitively and vividly convey the most important dynamic information—the voting results—to the user. Users cannot immediately see changes on the product images and text they are interested in; they may need to return from the voting page to the image and text page to find the corresponding images and text for each vote, causing significant inconvenience.

[0032] This application provides a text-based interactive experience. First, an interactive text-image instance is obtained, which binds the product information to be interacted with and the interactive components into an inseparable whole at the data structure level. When a user interacts, the response logic is triggered, but the resulting dynamic effects are strictly limited to the "section to which the interactive component belongs." For example, after a user clicks the voting button on a product's text-image page, the product's votes will immediately display corresponding dynamic effects in multiple sections corresponding to that product, without requiring navigation or a global refresh. This achieves a seamless and consistent user experience and, more importantly, modularizes the interaction from the underlying technology level.

[0033] Please see Figure 1The illustration shows a flowchart of a text-image interaction method provided in an embodiment of this application. The text-image interaction method provided in this application can be applied to electronic devices, which may include physical devices such as servers, PCs, tablets, or smartphones, or virtual devices such as virtual machines or containers. The electronic device can be a single device, a combination of multiple devices, or a cluster of a large number of devices. The text-image interaction method may include: Step S110: Obtain an interactive graphic instance. The interactive graphic instance includes at least two partitions, each of which includes product information to be interacted with and an interactive component. The interactive component is used to receive interactive operations and trigger associated interactive logic.

[0034] Step S120: Analyze the interactive graphic and text instances through the rendering engine and draw a graphical interface containing the product information to be interacted with and interactive components.

[0035] Step S130: Listen for user interaction with products based on interactive components in the graphical interface.

[0036] Step S140: In response to the detected interaction operation, execute the interaction logic corresponding to the interaction operation, and display the dynamic effect corresponding to the interaction operation within the partition to which the interaction component belongs.

[0037] In step S110, the interactive graphic instance is a structured data object generated by the publishing end and stored on the server. For example, a user initiates an HTTPS request with a unique instance identifier to the content delivery network through a client. After verifying the request permissions, the server returns a packaged file containing template files, business data, and interaction configurations. This file uses a highly compressed binary encoding format.

[0038] In interactive graphic instances, "partitions" are represented as independent container units in the data structure. Each partition can represent a corresponding product. For example, if voting or other interactions are required between two products, the interactive graphic instance contains two partitions, corresponding to the two products respectively. Each partition contains complete metadata definitions: the product information field stores core data such as product identifiers, image resource addresses, and descriptive text; interactive components are described using predefined JSON Schema, specifying their type, location coordinates, event response rules, and other attributes. These partitions are logically mapped using a hash table and physically stored as contiguous memory blocks, enabling the rendering engine to quickly index and access them. The entire acquisition process also includes a data integrity verification mechanism, using cyclic redundancy check codes to ensure that instance data is not damaged or tampered with during transmission.

[0039] Interactive components are set as a hitable region in the rendering engine. The rendering engine continuously listens for user input events (such as touches and clicks). When the coordinates of an input event fall within the bounding box of this region, it means the interactive component has received the interaction. Interactive components include voting components, add-to-cart components, etc., and correspondingly, interactive operations include voting operations, add-to-cart operations, etc.

[0040] In step S120, parsing the interactive graphic instance through the rendering engine is a real-time graphics processing flow. The rendering engine is the core component of the client. First, it deserializes the acquired binary instance data, converting it into an object tree structure in memory. The rendering engine then executes the resource loading phase, asynchronously loading the required static resources such as images and fonts into the texture memory according to the resource identifiers referenced in the interactive graphic instance.

[0041] During the layout calculation phase, the engine performs box model calculations based on the constraints defined by the partitions (including size, position, and hierarchical relationships) to determine the final coordinates and clipping area of ​​each visual element. The rendering phase can be implemented through a graphical interface: for product information display, the rendering engine uploads image resources to the GPU texture unit and generates the corresponding graphics for the product in the frame buffer using quadrilateral meshes and texture mapping operations; for interactive components, the engine uses a vector graphics instruction set to draw basic geometric shapes and renders text labels using a font engine. The entire rendering process adopts a layered rendering architecture. First, background elements are drawn to the off-screen buffer, then product layers, interactive component layers, and effects layers are layered sequentially. Finally, the compositor blends all layers and outputs them to the target surface of the graphical interface, generating a graphical interface containing the interactive product information and the interactive components.

[0042] As one implementation method, the rendering engine can also achieve incremental rendering based on rectangular interactive components, redrawing only the screen areas where the content has changed to reduce GPU load.

[0043] In step S130, the system monitors user interactions with products based on interactive components in the graphical interface. For example, the client registers as an input event listener at the operating system level, establishing a channel for collecting raw input data (such as touch coordinates and key codes). When a hardware input device generates a signal, the raw input data is packaged into an input event and transmitted to the application via a message queue.

[0044] The application's event handling module first transforms the input events, converting physical screen coordinates into a logical coordinate system based on the graphical interface. Then, it traverses the graphical interface maintained by the rendering engine using a hit detection algorithm, employing boundary collision detection or a more refined triangular mesh test to determine the trigger state of the interactive components. For touch input, the system tracks the complete lifecycle of the touch point (including press, move, release, etc.) and distinguishes different interaction intentions such as single click, long press, and swipe using a gesture recognizer. Listening can be based on a bubbling mechanism, allowing interactive events to propagate upwards along the component, while also providing an event capture phase that allows the parent container to intercept and process events preferentially. To improve response performance, the listening pipeline can employ techniques such as lock-free queues and event debouncing to optimize processing efficiency in high-frequency input scenarios.

[0045] In step S140, after confirming that the interactive operation has hit the interactive component, the interaction processing function associated with the interactive component is first located and called through reflection. The interaction processing function is used to execute the interaction logic. Different interactive components can be bound to corresponding interaction logic. The execution of the interaction logic can include the following actions: For data submission type interaction actions, a data packet containing fields such as operation type, target identifier, and timestamp can be constructed and sent to the business server through an asynchronous Socket connection; for local state update type interactions, the relevant components are notified to update their internal state machines through a publish-subscribe pattern.

[0046] In terms of dynamic effects, dynamic effects are bound to interactive behavior tags. An independent animation timeline can be launched, interpolating and calculating intermediate values ​​of visual attributes—including continuous changes in parameters such as position, rotation, scaling, and transparency—based on a predefined keyframe sequence. All these visual changes are reflected on the graphical interface through the rendering engine's real-time redraw mechanism, forming smooth dynamic feedback.

[0047] As one implementation method, a priority management mechanism can also be implemented, which allows high-priority interactions to interrupt or override ongoing low-priority animations, and automatically degrades visual effects to ensure the responsiveness of core interactions when system resources are scarce.

[0048] For example, when the rendering engine's listening module confirms a valid voting operation (such as a click) has occurred on a voting button in a certain section, it immediately triggers a multi-threaded response pipeline. In one thread, the interaction logic execution unit parses the interaction behavior marker associated with the button, extracts the voting target (such as "product A"), and then constructs a data packet containing the user's anonymous identifier and product ID. This data packet is then sent to the server's vote counting interface via an asynchronous network request, completing the storage of the voting data.

[0049] In another thread, the dynamic effects rendering unit is activated. Based on the predefined motion effect identifiers in the tags, it finds the corresponding animation sequence from the decoded template file. The rendering engine then interrupts the current static or standby animation of that section and immediately schedules and plays the specified dynamic effect. The entire process ensures that user actions receive immediate visual and logical feedback, and all effects are confined within the boundaries of the section that triggered the action, without interfering with the content of other sections, creating a clear, precise, and engaging interactive experience.

[0050] In the implementation of the above embodiments, a novel content interaction mode based on interactive graphics and text is achieved, completely different from traditional static images or linear videos. The "graphics and text" in this solution is a dynamic application with embedded complete interactive logic and animation capabilities. When a user triggers interactive components such as voting on the interface, immediate, vivid, and dynamic visual feedback bound to the operation logic is provided in the area corresponding to the graphic and text content. This responsive experience, unlike the one-way playback of video content or the display of static content, greatly enhances the user's sense of participation and control. Simultaneously, because the dynamic effects are precisely constrained within the specific area where the operation occurs, the interactive feedback has a clear target and direction, effectively guiding the user's attention, increasing the confidence and fun of the interactive operation, thereby strengthening the overall attractiveness of the interactive graphic and text content and improving the user experience.

[0051] Optionally, in this embodiment, before obtaining an interactive graphic and text instance, the publishing end needs to publish the interactive graphic and text instance. The publishing end and the interactive end are not two independent client applications in physical terms, but rather two different functional modes presented within the same client application according to different user intentions. Any user can either create and upload an interactive graphic and text instance by calling the publishing function module through the client's publishing entry point, or by calling the content acquisition and rendering module through the client's consumption entry point to retrieve interactive graphic and text instances published by other users from the server and perform interactive operations such as voting. The client is a unified functional platform, and user identities can flexibly switch between content producers and consumers.

[0052] The method for publishing interactive graphic and text examples includes the following steps: The system receives a publishing instruction sent by a user, which includes at least one product information. The publishing instruction can be triggered by either the user selecting a product on the publisher interface or by the user selecting a product on the product details page.

[0053] The publish command is a structured request object generated by the front-end application layer after the user completes the product selection and confirmation operation on the client interface. When the user performs a product selection operation on the publisher interface or product details page, the interface interaction module captures the selection event and encapsulates the selected product information into a temporary data structure. When the user finally triggers the publish confirmation button, the front-end SDK constructs an HTTP POST request. The message body of this request includes: user session token, publish timestamp, and an array of product information fields. Each product information object contains key attributes such as the product unique identifier SKU, product main image URL, product title text, and product price.

[0054] In scenarios triggered by product detail pages, the system will also automatically carry the context information of the source product detail page, using the context information as part of the publishing instruction to avoid users uploading information repeatedly. After that, the valid publishing instruction will be delivered to the message queue, waiting for subsequent processing module services to consume it.

[0055] In response to the release command, a template file for generating interactive graphic and text instances is obtained; the template file includes at least one replaceable graphic and text element and at least one interactive behavior tag.

[0056] Once a command is consumed by the template processing service via the message queue, the first step is to extract the product information feature vector from the command. This feature vector can include multiple dimensions such as product category, price range, main color scheme, and style tags. Then, a template retrieval algorithm is executed: first, an initial screening is performed based on the product category; then, the cosine similarity between the feature description vector of each template and the product feature vector is calculated in the candidate template pool; and finally, a weighted score is applied, considering the template's recent usage popularity and novelty. The template file with the highest score is selected as the target template.

[0057] During the acquisition process, the system reads the binary data packet of the target template from distributed file storage. The data packet includes template metadata, layer structure information, animation timeline data, and replaceable graphic elements and interactive behavior tags. The file can use differential compression technology to compress and store the differences between similar frames to optimize storage space and network transmission efficiency. After the template file is fully loaded into the server memory, the system performs integrity verification to ensure that interactive components and resource references are valid and usable.

[0058] Based on the interactive behavior tags in the template file, corresponding interactive logic is bound to the template. This interactive logic includes at least voting logic. First, the template file package is unpacked to extract the embedded set of interactive behavior tags. For example, the interactive behavior tag with the tag type "vote" is parsed. Then, based on the tag's configuration parameters, specific event handling functions are dynamically bound to the template instance. For the voting logic, the following steps are completed: establishing the call relationship between the front-end voting button and the back-end voting API; configuring the reporting format of voting data; and associating the dynamic effects to be triggered after the voting operation.

[0059] The product information is populated into the replaceable graphic elements in the template file to generate an interactive graphic instance. This involves filling specific product data (such as product image URLs and title text) into the pre-defined replaceable graphic elements in the template, which serve as placeholders. Once completed, an interactive graphic instance containing specific product information, complete interactive logic, and animation data, ready to be directly distributed to consumers, is generated.

[0060] In the implementation of the above embodiments: through a template matching mechanism, each product can find the most suitable display format for its characteristics, enhancing the expressiveness of the content. The final generated interactive graphic and text instance upgrades the static product display into an interactive graphic and text that allows users to participate. Users not only receive information but also actively participate in the dynamic effects of the graphic and text through interactive operations such as voting. Automated processes improve the efficiency of instance generation.

[0061] Optionally, in this embodiment, the interactive operation includes a voting operation; the interactive behavior marker is stored in the layer marker information associated with the interactive component in JSON data format, and the layer marker information includes the behavior event type. The interactive behavior marker is the configuration data for implementing the interactive logic, and is defined and stored using a lightweight JSON data format.

[0062] This JSON data format is embedded in the associated layer marker information of the visual effects software project file, forming a strong association with the corresponding interactive component visual elements. This JSON data structure includes a behavior event type field, which specifies the interaction type represented by the associated layer; the JSON data structure may also include interaction-related parameters. When the template file is exported in a structured manner, this marker information is fully preserved and encoded, ultimately for parsing and use by the client rendering engine, thereby transforming static visual layers into dynamic components with clearly defined interactive functions.

[0063] In response to a detected interaction, the corresponding interaction logic is executed, and dynamic effects corresponding to the interaction are displayed within the partition of the interactive component, including: Based on the behavior event type in the layer marker information associated with the interactive component that triggered the voting operation, the voting logic corresponding to the voting logic is executed so that the dynamic effect corresponding to the interactive operation is displayed in the partition to which the interactive component belongs.

[0064] Once the system detects a valid voting operation, it quickly locates the triggered interactive component in the scene graph maintained by the rendering engine and retrieves its associated layer marker information. It then extracts the interactive behavior markers in JSON format stored in the marker information, deserializes them into an in-memory data structure using a JSON parser, and reads the core behavior event type field.

[0065] If the event type is determined to be a vote, an update operation will be performed based on the parameters defined in the JSON data (such as specific voting options, voting identifiers, etc.): This includes constructing a data packet conforming to the interface specification (containing user anonymity identifiers, voting targets, timestamps, etc.), sending it to the server's voting processing interface via an asynchronous network request, and displaying dynamic effects. For example, based on the configuration in the interactive behavior tag, the dynamic effect resource corresponding to this voting operation can be located and instantiated from the loaded template file, displaying the dynamic effect corresponding to the interactive operation.

[0066] In the implementation of the above embodiments: Real-time and visually rich dynamic feedback can be provided to users' voting operations, transforming traditional static content into an interactive participation mode. By presenting animation effects bound to the operation logic within specific sections—that is, displaying dynamic effects for the section whose product is being voted for—the user's sense of certainty and participation is enhanced. The entire interaction process is smooth and coherent, improving the user's experience during content interaction.

[0067] Optionally, in this embodiment of the application, the partitions in the interactive graphic instance are determined by dynamic tag classification technology based on the classification tags of the product information; wherein, the dynamic tag classification technology is used to dynamically generate classification tags for the product based on at least one of the product's function, appearance, sales volume and / or price attributes, and determine the partition affiliation of the product in the interactive graphic instance based on the classification tags.

[0068] For example, feature attribute vectors can be extracted from raw product data. These vectors include the product's functional characteristics (obtained by parsing product description text using natural language processing), appearance features (visual features such as color and texture extracted from the product's main image using computer vision algorithms), sales data (real-time or recent sales indicators obtained from a transaction database), and price range (a classification indicator calculated based on product pricing and market positioning). Subsequently, a dynamic label classifier uses a pre-trained machine learning model, such as a support vector machine or deep learning network, to classify these feature attribute vectors and determine the category label for each product. Finally, based on these category labels, the products are intelligently assigned to predefined partition slots in the template, forming the final partition layout structure.

[0069] The following describes how a single product image can be divided into multiple partitions. For example, using a voting process for different logo placements within a product image, a neural network for object detection first identifies the bounding box coordinates of all logos in the image. Each detected logo region is assigned a unique location identifier (e.g., top-left logo, bottom-right logo). These location identifiers serve as partitions for the logo. Users then vote on the logos within each partition, selecting their desired logo placement. This allows businesses to survey customer acceptance of different logo placements.

[0070] Taking user voting on reasons for purchase as an example, key purchase motivation features such as "price advantage" and "functional innovation" are extracted from product information through text mining technology. Different category tags are set up in separate sections for users to vote on.

[0071] When the system detects that the input consists of multiple independent products, the dynamic label classification technology will generate a complete set of descriptive labels for each product, but the partition mapping engine will use an allocation strategy to completely assign each product to an independent partition.

[0072] In the implementation of the above embodiments: through a dynamic tag classification and partitioning generation mechanism, the core features of products and user concerns can be automatically identified, and a partitioning layout with the highest comparative value and interactive significance can be generated accordingly, improving the relevance and expressiveness of the content. Tag-based classification and partitioning allows users to more intuitively understand the differences and unique advantages between products.

[0073] As another implementation method, the number, position, and visual style of the sections can be pre-planned in the template file, providing a stable and aesthetically pleasing framework for the content. For clear comparison scenarios (such as choosing between two options), a fixed two-section layout of the template can be directly adopted; for more complex scenarios, the optimal placement of product tags in the template layout can be dynamically determined based on the product tags, achieving personalized content adaptation.

[0074] Optionally, in this embodiment, the interactive operation includes a voting operation; displaying dynamic effects corresponding to the interactive operation includes: The system acquires real-time statistical data of the current voting event, including at least the total number of votes, voting rate, or the difference in votes between options. Each time a user votes, a timestamped voting event is immediately sent to the server. The server maintains a distributed counter in memory to track the total number of votes. The voting rate can be implemented using a sliding window algorithm, such as counting the number of received voting events within each time window (e.g., per second), or by using an exponentially weighted moving average to eliminate interference from sudden traffic spikes. The difference in votes between options can be calculated in real-time using a global voting distribution table and streaming aggregation technology.

[0075] Statistical feature data is input into a pre-trained animation parameter mapping model to generate dynamic animation control parameters. These parameters are used to control at least one of the following: dynamic effect graphics, particle effect density, camera shake amplitude, or color saturation.

[0076] The animation parameter mapping model is a multi-layer neural network trained using supervised learning. The training phase first requires collecting a large amount of historical voting data and its corresponding manually designed animation parameters as training samples. The network weights are then optimized using a backpropagation algorithm to obtain the trained animation parameter mapping model. Statistical feature data is input into the pre-trained animation parameter mapping model, and preliminary output results are obtained through forward propagation. These output results can be denoised and range-adjusted to ultimately generate dynamic animation control parameters that can be directly used by the rendering engine. These dynamic animation control parameters include floating-point values ​​controlling the complexity of special effects graphics, integer values ​​adjusting the emission density of the particle system, three-dimensional vectors determining the amplitude of virtual camera shake, and scaling factors adjusting the saturation of color filters.

[0077] Based on dynamic animation control parameters, dynamic effects that match statistical feature data are rendered and played in real time. These animation control parameters can be synchronized from the logic thread to the rendering thread via a parameter passing channel, enabling the rendering engine to render and play dynamic effects that match the statistical feature data in real time based on these parameters.

[0078] In the implementation of the above embodiments: by inputting statistical feature data into a pre-trained animation parameter mapping model, dynamic animation control parameters are generated, transforming abstract voting data into intuitive and expressive visual information, enabling users to directly perceive the overall situation and dynamic changes of the voting activity. The parameter mapping relationship is obtained through the model, making the intensity of visual feedback correspond to the intensity of the voting activity; the real-time distribution of votes can be understood through the dynamic effects.

[0079] Optionally, in this embodiment of the application, the interactive graphic and text instance is parsed by the rendering engine, and a graphical interface containing the product information to be interacted with and interactive components is drawn, including: The rendering engine reads template files, structured and exported by visual effects software, contained within interactive graphic instances. These template files include binary encoding of keyframe data. The template file is a serialized data structure package, where keyframe data is stored in a highly compressed binary encoding format. The rendering engine loads the template file into the application's address space using memory mapping technology, establishing a direct file access channel. Following predefined file structure specifications, the rendering engine locates the binary data block storing the keyframe data. This data block contains continuous sample values ​​of animation elements along the timeline, such as layer transformation attributes, opacity states, and filter parameters.

[0080] The rendering engine decodes binary code and executes keyframe data to draw a graphical interface containing interactive product information and components. Based on the current time point, the engine iterates through the keyframe sequence of all layers, using interpolation algorithms to calculate the precise state value of each layer at that moment, including visual attributes such as position coordinates, rotation angle, scaling, and transparency. Finally, the engine calls the underlying graphics API to apply these calculated visual attributes to the corresponding product information layer and interactive component layer, generating a graphical interface containing complete product display and interactive elements, which is then output to the display device.

[0081] In the implementation of the above embodiments: the compact encoding format of the template file ensures fast loading and parsing of resources, and the rendering engine accurately restores the keyframe data, improving the smooth transition and visual consistency of the animation effect.

[0082] Optionally, in this embodiment of the application, after displaying the dynamic effect corresponding to the interactive operation within the partition to which the interactive component belongs, the method further includes: The client sends the user's vote to the server. The client serializes the vote data into JSON format and asynchronously transmits it to the server's voting processing interface. Upon receiving the data, the server immediately returns an acknowledgment response to ensure reliable delivery of the vote data.

[0083] Receive the current voting statistics from the server. The server's real-time computing engine continuously aggregates the voting data for each option. When the statistics are updated, a data packet containing the number of votes for each option, the percentage of votes received, and the total number of votes is pushed to the client through the established communication channel. The client's parser converts this data into an internal data structure for subsequent use.

[0084] The voting statistics are displayed on the graphical interface. Based on the received statistical data, the rendering engine adjusts the attributes of the visual elements associated with each option in real time: updates the width of the progress bar to reflect the proportion of votes, modifies the text content of the number labels to display the specific number of votes, and changes the color intensity of the elements through a color gradient algorithm to enhance data perception.

[0085] Based on the voting statistics, a global heatmap layer is generated. The heatmap layer dynamically maps the real-time vote density of each zone with different color depths. The heatmap generation algorithm calculates the color mapping value based on the real-time vote density of each zone: areas with zero votes remain completely transparent, and as the vote count increases, the color gradually changes from cool to warm tones. The color depth is non-linearly positively correlated with the vote density.

[0086] As one implementation method, to achieve a smooth visual transition, a bilinear interpolation algorithm can be used to fill the processed vote distribution matrix with pixel-level color, and a Gaussian blur effect can be added to the edge areas to eliminate obvious boundaries. This heatmap layer is composited with the underlying content using the graphics processor's hybrid rendering mode, clearly presenting the voting distribution without completely obscuring the original interface content. The layer update mechanism employs an incremental rendering strategy to optimize rendering performance and ensure smooth animation.

[0087] In the implementation of the above embodiments: the real-time display of statistical results allows users to clearly perceive the overall voting situation, and the statistical information is visualized through dynamic heat map layers, making the information more clearly displayed.

[0088] Please see Figure 2 The diagram shown is a schematic representation of a graphical interface provided in an embodiment of this application.

[0089] In one optional embodiment, the graphical interface includes interactive product information and interactive components. For example... Figure 2 Users can see an interactive graphic example in the community called "Running Shoes: Ultimate Choice". The graphical interface displays two running shoes side by side, with each shoe corresponding to a section. Each section includes a photo of a running shoe and a "Choose TA" voting button for that shoe. In other words, there is a clear "Choose TA" voting button below each shoe.

[0090] Please see Figure 3 The diagram shown is a schematic representation of the dynamic effect corresponding to an interactive operation provided in an embodiment of this application.

[0091] When a user clicks the button below the running shoes on the left, the interaction logic is immediately triggered. The left-hand section instantly plays a smooth confirmation animation: a checkmark icon may appear on the button with a zoom-in fade-in effect; simultaneously, the border of the section may be surrounded by a highlighted halo, and the product images and text in that section will be enlarged, providing the user with strong feedback. After the voting data is submitted in real time, the interface quickly switches to the results display view. For example... Figure 3 As shown, the original buttons have been replaced by clear percentage progress bars. The left side, below the running shoe, displays "Selected: 80%", while the right side displays "20%". This real-time, visual voting result confirms the user's actions, strongly linking user actions with text and images, and improving the effectiveness of voting feedback.

[0092] This application also provides a method for generating interactive graphic templates, applicable to electronic devices equipped with video effects software (specifically Adobe After Effects), a professional motion graphics production tool based on layer and keyframe animation principles. Video effects software organizes content through a three-tiered architecture of compositing, layers, and attributes: compositing acts as an animation container, layers hold visual elements (such as images, text, and shapes), and attributes control layer transformations, appearance, and other parameters. The core mechanism of the software is a keyframe animation system, which automatically generates intermediate frames using interpolation algorithms by marking attribute state points on the timeline, achieving smooth animation effects. The method for generating interactive graphic templates includes the following steps: In response to a user's design operation triggered by an electronic device, an animation template project file is created in the graphical user interface of the visual effects software. The file contains at least one replaceable graphic element and at least one interactive behavior tag. The interactive behavior tag is associated with a specified animation layer and is used to define the interaction logic of the animation layer.

[0093] Complete animation effects are constructed by performing operations such as layer creation, attribute setting, and keyframe definition within the software interface. Replaceable text and image elements are achieved by adding special naming prefixes or custom metadata identifiers to specific layers, recognizing these layers as content placeholders for users to fill in text and image information for voting. Interactive behavior markers are implemented through the software's extended scripting function, embedding structured data at marker points on specified layers. This data includes information such as interaction type, trigger conditions, and parameter configurations. Each marker is associated with a specific animation layer, forming a binding relationship between visual elements and interactive logic.

[0094] The animation template project file undergoes structured export processing to generate corresponding template files. An export plugin performs deep analysis on the original project file, extracting information such as layer hierarchy, keyframe data, effect parameters, and embedded interactive behavior markers. The extracted information is converted into a compact binary format, preserving the core animation data while reducing file size. All interactive behavior markers, along with their corresponding layer references, are packaged into the final output template file, forming a complete template data package.

[0095] In the implementation of the above embodiments: by combining the powerful animation production capabilities of professional film and television special effects software with the technical requirements of interactive content, an efficient template production process is achieved. This allows animation effects to be easily converted into basic templates for interactive content, improving the production efficiency and quality of interactive content while reducing the difficulty of operation for users.

[0096] Please see Figure 4 The diagram shows a structural schematic of an electronic device provided in an embodiment of this application. An electronic device 300 provided in this application includes a processor 310 and a memory 320. The memory 320 stores machine-readable instructions executable by the processor 310. When the machine-readable instructions are executed by the processor 310, the method described above is performed.

[0097] Figure 4 The components shown can be implemented using hardware, software, or a combination thereof. Electronic device 300 may be a physical device, such as a server or PC, or a virtual device, such as a virtual machine or virtualization container. Furthermore, electronic device 300 is not limited to a single device; it can also be a combination of multiple devices or a cluster of numerous devices.

[0098] This application also provides a storage medium storing a computer program, which is executed by a processor to perform the above-described method.

[0099] The storage medium can be implemented by any type of volatile or non-volatile storage device or a combination thereof, such as Static Random Access Memory (SRAM), Electrically Erasable Programmable Read-Only Memory (EEPROM), Erasable Programmable Read Only Memory (EPROM), Programmable Red-Only Memory (PROM), Read-Only Memory (ROM), magnetic storage, flash memory, magnetic disk, or optical disk.

[0100] This application also provides a computer program product, including computer program instructions, which are executed by a processor to perform the method described above.

[0101] It should be understood that the disclosed apparatus and methods can also be implemented in other ways, given the several embodiments provided in this application. The apparatus embodiments described above are merely illustrative. For example, the flowcharts and block diagrams in the accompanying drawings illustrate the architecture, functionality, and operation of possible implementations of apparatus, methods, and computer program products according to various embodiments of this application. In this regard, each block in a flowchart or block diagram may represent a module, segment, or portion of code, which contains one or more executable instructions for implementing a specified logical function. It should also be noted that in some alternative implementations, the functions marked in the blocks may occur in a different order than those marked in the drawings. For example, two consecutive blocks may actually be executed substantially in parallel, or they may sometimes be executed in reverse order, depending on the functions involved. It should also be noted that each block in a block diagram and / or flowchart, and combinations of blocks in block diagrams and / or flowcharts, can be implemented using a dedicated hardware-based system that performs the specified function or action, or using a combination of dedicated hardware and computer instructions.

[0102] In addition, the functional modules in the various embodiments of this application can be integrated together to form an independent part, or each module can exist independently, or two or more modules can be integrated to form an independent part.

[0103] The above description is only an optional implementation of the embodiments of this application, but the protection scope of the embodiments of this application is not limited thereto. Any changes or substitutions that can be easily conceived by those skilled in the art within the technical scope disclosed in the embodiments of this application should be covered within the protection scope of the embodiments of this application.

Claims

1. A text-based interactive method, characterized in that, include: Obtain an interactive graphic and text instance, wherein the interactive graphic and text instance includes at least two partitions, each partition including product information to be interacted with and interactive components; The interactive component is used to receive interactive operations and trigger associated interactive logic. The interactive graphic instance is analyzed by the rendering engine, and a graphical interface containing the product information to be interacted with and the interactive components is drawn. Monitor user interactions with products based on interactive components in the graphical interface; In response to a detected interaction, the corresponding interaction logic is executed, and the dynamic effect corresponding to the interaction is displayed within the partition to which the interaction component belongs.

2. The method according to claim 1, characterized in that, Before obtaining an interactive graphic instance, the method further includes: The system receives a publishing instruction sent by a user, the publishing instruction including at least one product information; wherein the publishing instruction is triggered by the user selecting a product and triggering it on the publisher interface, or by the user selecting a product and triggering it on the product details page; In response to the release command, a template file for generating interactive graphic and text instances is obtained; the template file includes at least one replaceable graphic and text element and at least one interactive behavior tag; Based on the interactive behavior tags in the template file, bind the corresponding interactive logic to the template, and the interactive logic includes at least voting logic; The product information is populated into the replaceable graphic elements in the template file to generate an interactive graphic instance.

3. The method according to claim 2, characterized in that, in, The interactive operation includes a voting operation; the interactive behavior marker is stored in the layer marker information associated with the interactive component in JSON data format, and the layer marker information includes the behavior event type; The response to a detected interaction operation involves executing the interaction logic corresponding to the interaction operation and displaying a dynamic effect corresponding to the interaction operation within the partition to which the interaction component belongs, including: Based on the behavior event type in the layer marker information associated with the interactive component that triggered the voting operation, the voting logic corresponding to the voting logic is executed so that the dynamic effect corresponding to the interactive operation is displayed in the partition to which the interactive component belongs.

4. The method according to claim 1, characterized in that, in, The partitions in the interactive graphic instance are determined by dynamic tag classification technology based on the category tags of the product information; wherein, the dynamic tag classification technology is used to dynamically generate category tags for the product based on at least one of the product's function, appearance, sales volume and / or price attributes, and determine the partition affiliation of the product in the interactive graphic instance based on the category tags.

5. The method according to claim 1, characterized in that, The interactive operation includes a voting operation; the display of dynamic effects corresponding to the interactive operation includes: Real-time acquisition of statistical characteristic data of the current voting event, including at least the total number of votes, voting rate, or difference in votes between options; The statistical feature data is input into a pre-trained animation parameter mapping model to generate dynamic animation control parameters. The dynamic animation control parameters are used to control at least one of the following: dynamic effect graphics, particle effect density, camera shake amplitude, or color saturation. Based on the dynamic animation control parameters, dynamic effects that match the statistical feature data are rendered and played in real time.

6. The method according to claim 1, characterized in that, The step of parsing the interactive graphic instance using a rendering engine and drawing a graphical interface containing the interactive product information and the interactive components includes: The rendering engine reads the template file, which is structured and exported by film and television special effects software, contained in the interactive graphic instance; the template file includes the binary encoding of keyframe data. The rendering engine decodes the binary code and executes the keyframe data to draw a graphical interface containing the product information to be interacted with and the interactive components.

7. The method according to claim 1, characterized in that, include: After displaying the dynamic effect corresponding to the interactive operation within the partition to which the interactive component belongs, the method further includes: Send the user's voting action to the server; Receive the current voting statistics from the server; The voting statistics are displayed on the graphical interface. Based on the voting statistics, a global heatmap layer is generated; the heatmap layer dynamically maps the real-time vote density of each partition with different color depths.

8. A method for generating interactive graphic templates, characterized in that, The method, applied to an electronic device equipped with video special effects software, includes: In response to a user-triggered design operation based on the electronic device, an animation template project file containing at least one replaceable graphic element and at least one interactive behavior marker is created in the graphical user interface of the video effects software; wherein, the interactive behavior marker is associated with a specified animation layer, and the interactive behavior marker is used to define the interaction logic of the animation layer; The animation template project file is exported in a structured manner to generate the corresponding template file.

9. A computer program product, characterized in that, It includes computer program instructions that, when executed by a processor, perform the method as described in any one of claims 1 to 8.

10. An electronic device, characterized in that, include: A processor and a memory, the memory storing computer program instructions that, when executed by the processor, perform the method as described in any one of claims 1 to 8.

11. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores computer program instructions that, when executed by a processor, perform the method as described in any one of claims 1 to 8.