Education interaction message system and method based on bullet screen technology

Abstract

The invention relates to the technical field of education informatization, and discloses a bullet screen technology-based education interaction message system, which comprises a real-time communication module; the bullet screen display module is used for receiving the message from the real-time communication module at a student end, and controlling the message to be displayed in a display interface in a scrolling manner in a bullet screen form through CSS3 animation and DOM technologies; the state synchronization module is used for tracking sending, receiving, confirming and replying states of messages in real time; wherein the student terminal is configured to generate and send state confirmation information or reply information to the state synchronization module in response to a triggering operation on a bullet screen message which is displayed in a rolling manner; a multimedia processing module; a data persistence module; and a cross-platform adaptation module. Compared with the prior art, the system has the advantages that classroom interactivity and student participation degree are improved; real-time tracking and feedback of a message state are realized; seamless transmission and sharing of multimedia contents are supported; and the method has good cross-platform compatibility and history playback capability.

Description

Technical Field

[0001] This invention relates to the field of educational informatization technology, specifically to an educational interactive messaging system and method based on bullet screen technology. Background Technology

[0002] With the rapid development of educational informatization, various online teaching platforms and instant messaging tools are widely used in teaching scenarios, such as DingTalk, Tencent Meeting, and ClassIn. These systems typically implement message passing based on HTTP polling or simple WebSocket, and combine WebRTC technology to implement audio and video conferencing functions.

[0003] However, existing interactive educational systems have the following shortcomings:

[0004] 1. The message display method is monotonous and lacks interactive forms that attract students' attention;

[0005] 2. Poor real-time performance, especially with high latency in HTTP polling-based solutions;

[0006] 3. The lack of an accurate message read status tracking and feedback mechanism makes it difficult for teachers to grasp students' reception status;

[0007] 4. Inadequate support for multimedia content such as voice and screen sharing;

[0008] 5. Poor cross-platform compatibility; most systems only support specific terminals or operating systems.

[0009] Therefore, there is an urgent need for a new type of educational interactive system that can integrate real-time messaging, bullet screen display, status tracking and multimedia interaction to improve classroom interaction efficiency and teaching experience. Summary of the Invention

[0010] The technical problem to be solved by the present invention is to overcome the above-mentioned technical difficulties and provide an educational interactive message system and method based on bullet screen technology, so as to solve the problems of single message display, poor real-time performance and inaccurate status tracking in existing educational interactive systems.

[0011] To solve the above-mentioned technical problems, the technical solution provided by the present invention is as follows:

[0012] An interactive educational messaging system based on bullet screen technology includes:

[0013] The real-time communication module is used to establish a low-latency bidirectional communication channel between the teacher and student terminals based on a WebSocket long connection for message broadcasting;

[0014] The bullet screen display module is used to receive messages from the real-time communication module on the student's end, and control the messages to be scrolled and displayed in the form of bullet screens on the display interface through CSS3 animation and DOM technology;

[0015] The status synchronization module is used to track the sending, receiving, confirmation, and reply status of messages in real time; wherein, the student terminal is configured to generate and send status confirmation information or reply information to the status synchronization module in response to the trigger operation of scrolling bullet screen messages;

[0016] A multimedia processing module is used to integrate WebRTC technology to support voice transmission and screen sharing between the teacher's end and the student's end;

[0017] The data persistence module is used to store user information, message history, and classroom recordings using a non-relational database;

[0018] A cross-platform adaptation module is used to encapsulate desktop applications based on the Electron framework while maintaining compatibility with the web platform.

[0019] Furthermore, the real-time communication module is specifically used for:

[0020] During the connection establishment phase, the user's identity is verified and a corresponding virtual room is assigned to the user;

[0021] During the message sending phase, a unique message ID and timestamp are generated for the message input by the teacher, and the message is broadcast to the virtual room corresponding to the target class through the WebSocket long connection.

[0022] Furthermore, the bullet screen display module is specifically used for:

[0023] After receiving message data, the student end uses the bullet screen engine to calculate the display track and animation parameters for each message;

[0024] Use CSS3 animations to drive messages to scroll along a specified track.

[0025] Furthermore, the state synchronization module is specifically used for:

[0026] In response to the student's click on the bullet screen message, generate and send a message read confirmation message to the server;

[0027] In response to a long press on a bullet screen message by a student, the text reply function is triggered, and a reply message is generated and sent to the server.

[0028] The server updates the status of the corresponding message and sends the status update notification to the teacher's end.

[0029] Furthermore, the multimedia processing module is specifically used for:

[0030] Establish a WebRTCP2P connection between the teacher's and student's devices;

[0031] Real-time encoding and transmission of audio data;

[0032] Implement screen sharing functionality using the media streaming API.

[0033] Furthermore, the data persistence module is also used to store classroom recordings to support the playback of historical classroom interactions.

[0034] The educational interactive message method based on bullet screen technology, the method includes:

[0035] Connection establishment steps: A two-way communication channel is established between the teacher's and student's ends through a WebSocket long connection, and user identity is verified and virtual rooms are assigned;

[0036] Message sending and broadcasting steps: Receive the message content input by the teacher, generate a unique message ID and timestamp, and broadcast the message to the target student through the bidirectional communication channel;

[0037] The steps for displaying bullet comments are as follows: Message data is received on the student's end, the display track and animation parameters are calculated through the bullet comment engine, and CSS3 animation is used to drive the message to scroll and be displayed in the form of bullet comments.

[0038] Status feedback steps: In response to the student's trigger operation on the bullet screen message, generate status confirmation information or reply information and send it to the server, and the server updates the message status and notifies the teacher's end;

[0039] Multimedia transmission steps: When audio and video interaction is required, establish a WebRTCP2P connection between the teacher's end and the student's end to perform real-time encoded transmission of audio data and screen sharing.

[0040] Furthermore, the state feedback step includes:

[0041] In response to the student's click on the bullet screen message, a message read confirmation message is generated;

[0042] In response to a long press on a bullet screen message by a student, a text reply interface is triggered, and a reply message is generated and sent.

[0043] Furthermore, the method also includes data persistence and playback steps:

[0044] Store message history and classroom recordings in a non-relational database;

[0045] In response to a playback request, stored data is retrieved to replay the interactive process in the history classroom.

[0046] The advantages of this invention compared to the prior art are:

[0047] 1. This invention transforms the traditional static chat list into a dynamic scrolling bullet screen, which is novel in form and can effectively attract students' attention, stimulate their enthusiasm for participating in classroom discussions, and transform one-way knowledge transmission into a two-way, active, and interactive classroom.

[0048] 2. This invention not only enables real-time message push but also provides status tracking capabilities for each bullet screen message through a unique "click to confirm" and "long press to reply" mechanism. Teachers can accurately track which students have received key information and which students have questions, achieving refined management and quantitative evaluation of the teaching feedback process. This solves the blind spot problem in traditional classrooms where "teachers ask questions but no one answers" or whether students have actually read the messages.

[0049] 3. This invention employs a hybrid communication architecture, using WebSocket for efficient broadcasting of text-based interactive messages (high concurrency, small data volume); and employing WebRTC for point-to-point transmission of audio / video streams and screen sharing (large data volume, low latency requirements). This division of labor avoids the limitations of a single technical solution, optimizing server load and network resource consumption while ensuring the real-time performance of the overall system.

[0050] 4. This invention organically integrates functions such as real-time bullet comments, status tracking, voice interaction, screen sharing, classroom recording and playback into one platform, forming a complete "live-streaming" interactive teaching solution that can meet the needs of various teaching stages such as lecturing, Q&A, demonstration, and review. Detailed Implementation

[0051] In the description of this invention, unless otherwise stated, "a plurality of" means two or more. Furthermore, the term "comprising" and any variations thereof are intended to cover non-exclusive inclusion.

[0052] The present invention will now be described in further detail with reference to the embodiments.

[0053] An interactive educational messaging system based on bullet screen technology includes:

[0054] Real-time communication module: Once the teacher's client (Web or Electron application) and student's client are started, a WebSocket long connection will be established with the server. When the connection is established, the system will verify the user's identity (such as teacher ID, student ID, and class) and assign them to the corresponding virtual room (e.g., "Class 1, 2024"). When the teacher sends a message (e.g., "Please think about this question..."), the server will generate a globally unique ID (e.g., UUID) and a server timestamp for the message, and then broadcast the message packet (containing ID, timestamp, content, and sender) to all student clients within the same virtual room.

[0055] The bullet screen display module: When the student's WebSocket client receives a new message, it is handed over to a bullet screen rendering engine for processing. This engine first dynamically calculates a suitable display track based on the number, position, speed, and length of existing bullet screen comments using algorithms (such as track priority algorithms), and determines its animation parameters (such as scrolling speed, font size, color, and entry delay). Then, CSS3 is used to create a translation animation, injecting the message DOM element into the specified track to achieve a smooth scrolling effect from right to left. This method fully utilizes the hardware acceleration capabilities of modern browsers, ensuring smoothness even when a large number of bullet screen comments scroll simultaneously.

[0056] State synchronization module: This module is key to achieving precise interaction. The student client will bind click and long-press event listeners to each scrolling bullet screen message.

[0057] Click to confirm: When a student clicks on a comment, the client immediately generates a "read confirmation" message, which contains the unique ID of the clicked message and the student's ID, and sends it to the server via WebSocket. Upon receiving the message, the server updates the message's status record in the database, marks the student as having read it, and pushes this status update to the teacher's interface in real time (for example, the "number of people who have read" counter for the message is incremented by 1 next to the message list on the teacher's end).

[0058] Long press to reply: When a student long-presses a comment, a simple text input box will pop up on the client. After the student enters their reply (e.g., "Teacher, I didn't understand this part") and confirms, the client will generate a "reply" message containing the original message ID, the reply content, and the student ID, and send it to the server. The server will not only store the reply but also broadcast it as a new comment to the teacher and (optionally) the entire class, thus forming a discussion thread around the issue.

[0059] Multimedia Processing Module: When audio explanations or screen sharing are required, the teacher's end calls the WebRTC API. The system first exchanges candidates through a signaling server (usually shared with a WebSocket server) to establish a P2P connection between the teacher's end and one or more student ends. The audio stream is compressed by an encoder and transmitted in real time. Screen sharing obtains the teacher's screen media stream through the media streaming API and transmits it to the student end through the same WebRTC connection, allowing the student end to watch the teacher's demonstration in real time.

[0060] Data persistence module: All user information, message history (including content, status, and reply relationships), and classroom audio and video streams recorded via the media streaming API are stored in the database. Each message is stored as a document for easy subsequent complex queries and aggregation analysis.

[0061] Cross-platform adaptation module: Electron is used to package the teacher and student applications built with the above web technologies into independent desktop applications. Through Electron's main process and rendering process architecture, some native system APIs (such as notifications and file systems) can be called, while maintaining a high degree of consistency with the pure web version in core business logic, realizing "develop once, deploy on multiple platforms".

[0062] Educational interactive messaging methods based on bullet screen technology include:

[0063] Connection establishment step S101: Teachers and students launch client applications and connect to the central server. After the server completes identity authentication, it adds the user to their respective class virtual room, establishing a two-way communication channel.

[0064] Message sending and broadcasting step S102: The teacher enters a message in the interface and sends it. The system generates a message ID and timestamp, and broadcasts it to the target room via WebSocket.

[0065] Step S103 for displaying bullet comments: The student receives the message, the bullet comment engine calculates the track and animation parameters, and calls CSS3 animation to drive the message to scroll and display in the form of bullet comments above the video content or courseware.

[0066] Status feedback step S104: The system monitors the student's interactive behavior. If a click operation is detected (S1041), the read confirmation process is triggered (S1042); if a long press operation is detected (S1043), the reply input and sending process is triggered (S1044). The server updates the status and notifies the teacher (S1045).

[0067] Multimedia transmission step S105: When needed, the teacher initiates a voice or screen sharing request, establishes a P2P connection through WebRTC, and realizes low-latency multimedia interaction.

[0068] Data persistence and playback steps: Throughout the interaction, all messages and optional recorded classroom content are asynchronously saved to the database. After class, teachers or students can select the historical lesson through the playback interface. The system will retrieve message records and video files from the database and recreate the entire interaction process in a timeline-synchronized manner.

[0069] The present invention and its embodiments have been described above, and this description is not restrictive. If those skilled in the art are inspired by this description and design similar embodiments without departing from the spirit of the invention, such embodiments should fall within the protection scope of the present invention.

Claims

1. An educational interactive messaging system based on bullet screen technology, characterized in that: include: The real-time communication module is used to establish a low-latency bidirectional communication channel between the teacher and student terminals based on a WebSocket long connection for message broadcasting; The bullet screen display module is used to receive messages from the real-time communication module on the student's end, and control the messages to be scrolled and displayed in the form of bullet screens on the display interface through CSS3 animation and DOM technology; The status synchronization module is used to track the sending, receiving, confirmation, and reply status of messages in real time; wherein, the student terminal is configured to generate and send status confirmation information or reply information to the status synchronization module in response to the trigger operation of scrolling bullet screen messages; A multimedia processing module is used to integrate WebRTC technology to support voice transmission and screen sharing between the teacher's end and the student's end; The data persistence module is used to store user information, message history, and classroom recordings using a non-relational database; A cross-platform adaptation module is used to encapsulate desktop applications based on the Electron framework while maintaining compatibility with the web platform.

2. The educational interactive messaging system based on bullet screen technology according to claim 1, characterized in that, The real-time communication module is specifically used for: During the connection establishment phase, the user's identity is verified and a corresponding virtual room is assigned to the user; During the message sending phase, a unique message ID and timestamp are generated for the message input by the teacher, and the message is broadcast to the virtual room corresponding to the target class through the WebSocket long connection.

3. The educational interactive messaging system based on bullet screen technology according to claim 1, characterized in that, The bullet screen display module is specifically used for: After receiving message data, the student end uses the bullet screen engine to calculate the display track and animation parameters for each message; Use CSS3 animations to drive messages to scroll along a specified track.

4. The educational interactive messaging system based on bullet screen technology according to claim 1, characterized in that, The state synchronization module is specifically used for: In response to the student's click on the bullet screen message, generate and send a message read confirmation message to the server; In response to a long press on a bullet screen message by a student, the text reply function is triggered, and a reply message is generated and sent to the server. The server updates the status of the corresponding message and sends the status update notification to the teacher's end.

5. The educational interactive messaging system based on bullet screen technology according to claim 1, characterized in that, The multimedia processing module is specifically used for: Establish a WebRTCP2P connection between the teacher's and student's devices; Real-time encoding and transmission of audio data; Implement screen sharing functionality using the media streaming API.

6. The educational interactive messaging system based on bullet screen technology according to claim 1, characterized in that: The data persistence module is also used to store classroom recordings to support the playback of historical classroom interactions.

7. The educational interactive message method based on bullet screen technology according to any one of claims 1 to 6, characterized in that, The method includes: Connection establishment steps: A two-way communication channel is established between the teacher's and student's ends through a WebSocket long connection, and user identity is verified and virtual rooms are assigned; Message sending and broadcasting steps: Receive the message content input by the teacher, generate a unique message ID and timestamp, and broadcast the message to the target student through the bidirectional communication channel; The steps for displaying bullet comments are as follows: Message data is received on the student's end, the display track and animation parameters are calculated through the bullet comment engine, and CSS3 animation is used to drive the message to scroll and be displayed in the form of bullet comments. Status feedback steps: In response to the student's trigger operation on the bullet screen message, generate status confirmation information or reply information and send it to the server, and the server updates the message status and notifies the teacher's end; Multimedia transmission steps: When audio and video interaction is required, establish a WebRTCP2P connection between the teacher's end and the student's end to perform real-time encoded transmission of audio data and screen sharing.

8. The educational interactive message method based on bullet screen technology according to claim 7, characterized in that, The status feedback step includes: In response to the student's click on the bullet screen message, a message read confirmation message is generated; In response to a long press on a bullet screen message by a student, a text reply interface is triggered, and a reply message is generated and sent.

9. The educational interactive message method based on bullet screen technology according to claim 7, characterized in that, The method also includes data persistence and playback steps: Store message history and classroom recordings in a non-relational database; In response to a playback request, stored data is retrieved to replay the interactive process in the history classroom.