Online education video recording and editing method and system

Abstract

The invention provides an online education video recording and editing method and system, and relates to the technical field of data processing, and the method can respond to a recording starting operation of a webpage client for a to-be-recorded target PPT courseware, and carries out the equipment detection of a recording function of user equipment to which the webpage client belongs; after the device detection is passed, activating a camera and a microphone of the user device, and controlling the webpage client to enter a courseware recording interface; in response to a user recording operation for the courseware recording interface, recording and real-time storage of video courseware are carried out, and recorded initial video courseware is obtained; and in response to a user editing operation for the initial video courseware, editing the initial video courseware to obtain a target video courseware. Therefore, the manufacturing process of the video courseware is simplified, the workload of a lecturer is reduced, and the teaching efficiency and quality are improved.

Description

Technical Field

[0001] The present invention relates to the technical field of data processing, and in particular to a method and system for recording and editing online educational videos. Background Art

[0002] With the continuous development of the Internet, online education and distance learning have become an important part of the education field. In the existing online education program, the lecturer will give priority to making PPT, and then give voice explanations or graphic annotations on the knowledge points in the PPT during the course. Usually after class, in order to facilitate students to consolidate and review the course content, the lecturer will make video courseware through after-class video playback.

[0003] However, the teaching mode using PPT lacks interactivity and liveliness, and it is difficult to attract students' attention. Recording and editing video resources for post-class playback requires extra time and learning costs for lecturers, increasing their workload. The high time and learning costs lead to rising teaching costs and difficulty in ensuring the quality of teaching. Summary of the invention

[0004] The purpose of the present invention is to provide an online education video recording and editing method and system to simplify the video courseware production process, reduce the lecturer's workload, and thus improve teaching efficiency and quality.

[0005] In a first aspect, the present invention provides a method for recording and editing online educational videos, comprising: In response to a start recording operation of a target PPT courseware to be recorded by the web client, a device detection of a recording function is performed on a user device to which the web client belongs; After the device detection is passed, the camera and microphone of the user device are activated, and the web client is controlled to enter the courseware recording interface; the courseware recording interface includes a recording interface and a track interface that are displayed simultaneously. The courseware recording interface is used to display a real-time preview screen during the recording process. The real-time preview screen includes a target PPT page automatically generated based on the target PPT courseware and an image captured by the camera in real time; In response to a user recording operation on a courseware recording interface, the video courseware is recorded and stored in real time to obtain an initial video courseware that has been recorded; In response to the user's editing operation on the initial video courseware, the initial video courseware is edited to obtain the target video courseware.

[0006] Furthermore, before performing a device detection of a recording function on a user device to which the web client belongs in response to a start recording operation of the web client for the target PPT courseware to be recorded, the method further includes: Get the target PPT courseware sent by the web client; Conduct security checks on the target PPT courseware, including file format verification and file integrity verification; After the security check is passed, the target PPT courseware is uploaded to the back-end server, the parsed data corresponding to the target PPT courseware returned by the back-end server is obtained, and the target PPT page that matches the layout and content of the target PPT courseware is dynamically generated based on the parsed data using Html and JavaScript technology; Display the target PPT page on the web client.

[0007] Furthermore, in response to the user recording operation on the courseware recording interface, the video courseware is recorded and stored in real time to obtain the recorded initial video courseware, including: In response to the screen sharing operation on the courseware recording interface, the current screen content is recorded; wherein the current screen content includes the current PPT page or additional teaching materials currently being demonstrated; In response to the recording control operation on the courseware recording interface, the recording control of the video courseware is performed; wherein the recording control operation includes a start control operation, a pause control operation, a continue control operation, an end recording operation, an on / off camera operation, an on / off microphone operation, an on / off screen sharing operation, and a recording next page PPT operation. During the recording process, the courseware recording interface displays a real-time preview screen; During the recording process, the video data recorded in the current period is periodically obtained, and the video data corresponding to the current period is stored in the browser cache and the back-end server respectively, until the recording operation is ended in response, all the stored video data is used as the initial video courseware, and the web client is controlled to enter the video editing interface.

[0008] Further, in response to the user editing operation on the initial video courseware, the initial video courseware is edited to obtain the target video courseware, including: Get the initial video courseware from the browser cache and display it in the video editing interface; In response to a user editing operation on an initial video courseware in a video editing interface, recording video editing steps; In response to the completion of the editing operation for the initial video courseware, the video editing steps are sent to the back-end server, so that the back-end server performs the editing operation and rendering on the initial video courseware according to the video editing steps to obtain the edited video courseware; Determine the target video courseware based on the edited video courseware.

[0009] Further, according to the edited video courseware, the target video courseware is determined, including: The edited video courseware is format converted and optimized to obtain a target video courseware in a target video format; wherein the target video format includes MP4 or WebM, and the file optimization includes compression processing.

[0010] Furthermore, in response to the user editing operation on the initial video courseware, after editing the initial video courseware to obtain the target video courseware, the above method further includes: Back up the target video courseware.

[0011] Furthermore, in response to the user editing operation on the initial video courseware, after editing the initial video courseware to obtain the target video courseware, the above method further includes: Send the target video courseware to the preset student client or upload it to the preset online education platform.

[0012] In a second aspect, the present invention further provides an online education video recording and editing system, comprising: The device detection module is used to respond to the start recording operation of the web client for the target PPT courseware to be recorded, and perform device detection of the recording function on the user device to which the web client belongs; The device activation module is used to activate the camera and microphone of the user device after the device detection is passed, and control the web client to enter the courseware recording interface; wherein the courseware recording interface includes a recording interface and a track interface displayed simultaneously, and the courseware recording interface is used to display a real-time preview screen during the recording process, and the real-time preview screen includes a target PPT page automatically generated based on the target PPT courseware and an image captured by the camera in real time; The video recording module is used to record and store the video courseware in real time in response to the user's recording operation on the courseware recording interface, and obtain the recorded initial video courseware; The video editing module is used to edit the initial video courseware in response to the user's editing operation on the initial video courseware to obtain the target video courseware.

[0013] In a third aspect, the present invention further provides a front-end server device, including a memory and a processor, wherein the memory stores a computer program that can be run on the processor, and when the processor executes the computer program, the online education video recording and editing method of the first aspect is implemented.

[0014] In a fourth aspect, the present invention further provides a computer-readable storage medium having a computer program stored thereon, and when the computer program is executed by a processor, the online education video recording and editing method of the first aspect is executed.

[0015] The online education video recording and editing method and system provided by the present invention can respond to the start recording operation of the web client for the target PPT courseware to be recorded, and perform device detection of the recording function on the user device to which the web client belongs; after the device detection is passed, the camera and microphone of the user device are activated, and the web client is controlled to enter the courseware recording interface; wherein the courseware recording interface includes a recording interface and a track interface displayed simultaneously, and the courseware recording interface is used to display a real-time preview screen during the recording process, and the real-time preview screen includes a target PPT page automatically generated based on the target PPT courseware and an image captured in real time by the camera; in response to the user recording operation on the courseware recording interface, the video courseware is recorded and stored in real time to obtain the recorded initial video courseware; in response to the user editing operation on the initial video courseware, the initial video courseware is edited to obtain the target video courseware. In this way, there is no need to install client software, and video recording and editing can be completed using the web client, which improves the usability and convenience of the system, allowing users to complete video production on any device that supports a browser; the recording function of the user's device is automatically detected before recording, which can ensure the stability and reliability of the recording function and prevent recording failures, thereby improving video production efficiency and optimizing the user experience; the automatic generation of target PPT pages and the integrated video recording and editing functions greatly reduce the time investment of lecturers in courseware production and significantly improve the production efficiency of teaching content; the real-time preview screen displayed during video recording can provide users with intuitive operation feedback and improve the user experience; the real-time storage of video courseware during video recording can shorten the time consumed for data storage, thereby improving the efficiency of video production and optimizing the user experience. In summary, the online education video recording and editing method and system provided by the present invention simplifies the production process of video courseware, reduces the workload of lecturers, and thus improves teaching efficiency and quality. BRIEF DESCRIPTION OF THE DRAWINGS

[0016] In order to more clearly illustrate the specific implementation methods of the present invention or the technical solutions in the prior art, the drawings required for use in the specific implementation methods or the description of the prior art will be briefly introduced below. Obviously, the drawings described below are some implementation methods of the present invention. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying creative work.

[0017] Figure 1 A schematic diagram of an application scenario provided by an embodiment of the present invention; Figure 2 A flowchart of an online education video recording and editing method provided by an embodiment of the present invention; Figure 3 A schematic diagram of a courseware recording interface provided by an embodiment of the present invention; Figure 4 A schematic diagram of the structure of an online education video recording and editing system provided by an embodiment of the present invention; Figure 5 A schematic diagram of a process for generating online education video courseware provided by an embodiment of the present invention; Figure 6 A schematic diagram of the structure of a front-end server device provided in an embodiment of the present invention. DETAILED DESCRIPTION

[0018] The technical solution of the present invention will be clearly and completely described below in conjunction with the embodiments. Obviously, the described embodiments are part of the embodiments of the present invention, rather than all of the embodiments. Based on the embodiments of the present invention, all other embodiments obtained by ordinary technicians in this field without creative work are within the scope of protection of the present invention.

[0019] At present, there is an urgent need for a solution that can combine PPT courseware to produce corresponding educational videos. Based on this, an online educational video recording and editing method and system provided by an embodiment of the present invention can be seamlessly integrated with PPT courseware, efficiently converting PPT courseware into highly interactive and easy-to-edit video courseware, simplifying the video courseware production process, reducing the lecturer's workload, and thus significantly improving teaching efficiency and quality.

[0020] A possible application scenario of the embodiment of the present invention is as follows: Figure 1 As shown, an embodiment of the present invention involves a web client 101, a front-end server 102 and a back-end server 103 connected in sequence; wherein the web client 101 is used to provide an interactive interface for users, and users can perform operations such as recording and editing online educational videos through the web client 101; the front-end server 102 is used to process the requests of the web client 101 for the web client 101, and in combination with the interaction with the back-end server 103, return response data to the web client 101, so as to realize functions such as video recording and editing of the web client 101.

[0021] To facilitate understanding of this embodiment, a method for recording and editing online educational videos disclosed in an embodiment of the present invention is first introduced in detail.

[0022] The embodiment of the present invention provides a method for recording and editing online educational videos, which can be executed by the front-end server 102. Figure 2 The flowchart of a method for recording and editing online educational videos is shown in FIG. 1 , and the method mainly includes the following steps S210 to S240: Step S210 , in response to the web client starting the recording operation for the target PPT courseware to be recorded, performing a device detection of the recording function on the user device to which the web client belongs.

[0023] The above-mentioned target PPT courseware is the PPT courseware for which video courseware needs to be produced. Lecturers and other users can log in to the web client through the browser on the user's device, select the target PPT courseware to be recorded on the web interface of the web client, and click the recording control to start the recording operation. Before starting the recording operation, the user can first upload the target PPT courseware to be recorded, and then the front-end server can automatically convert the target PPT courseware into a target PPT page through the back-end server to provide an intuitive and interactive interface for subsequent video recording and editing.

[0024] Based on this, in some possible embodiments, before executing step S210, the above method also includes: obtaining the target PPT courseware sent by the web client; performing a security check on the target PPT courseware, the security check including file format verification and file integrity verification; after the security check passes, uploading the target PPT courseware to the back-end server, obtaining the parsed data corresponding to the target PPT courseware returned by the back-end server, and using Html and JavaScript technology to dynamically generate a target PPT page that matches the layout and content of the target PPT courseware based on the parsed data; and displaying the target PPT page on the web client for user preview.

[0025] Users can upload the target PPT courseware to the front-end server through the web interface, which ensures the convenience of digital storage and subsequent processing of the courseware. After receiving the target PPT courseware, the front-end server will perform a security check, including file format verification and file integrity verification; after verification, the file will be uploaded to the back-end server and the parsing process will be started. After receiving the target PPT courseware, the back-end server will automatically parse the courseware content and return the parsed data corresponding to the target PPT courseware. The front-end server can then use Html and JavaScript technology to dynamically generate web pages that match the layout and content of each page of the original PPT. This innovative step not only retains the original design of the PPT, but also provides an intuitive and interactive interface for subsequent video recording and editing.

[0026] Before users prepare to record video courses, a comprehensive device detection process will be performed to ensure that all necessary hardware devices and software environments are in optimal condition. Device detection for recording functions on user devices may include: Step S211, camera and microphone detection: the connection status of the camera and microphone will be automatically detected to ensure that they can work properly, and feedback information will be provided to guide the user to make necessary adjustments.

[0027] Step S212, network connection test: In order to ensure the smoothness of the video recording process, the network connection speed and stability of the user's device will be tested to determine whether the network connection status supports recording and editing functions.

[0028] Step S213, browser compatibility check: the user's browser type and version will be checked to ensure that the browser supports recording and editing functions.

[0029] It should be noted that there is no order of execution among the above-mentioned steps S211, S212 and S213. In other embodiments, they can also be executed in the order of step S212, step S211, step S213, or in the order of step S213, step S212, step S211, etc.

[0030] Step S220, after the device detection is passed, the camera and microphone of the user device are activated, and the web client is controlled to enter the courseware recording interface; wherein, the courseware recording interface includes a recording interface and a track interface that are displayed simultaneously, and the courseware recording interface is used to display a real-time preview screen during the recording process, and the real-time preview screen includes a target PPT page automatically generated based on the target PPT courseware and an image captured in real time by the camera.

[0031] After the device detection is passed, the user will enter the courseware recording stage. This step fully utilizes the advantages of the web client, without the need to install any client software, and can be easily used even on a computer under security control (where unauthorized software is not allowed to be installed).

[0032] Step S230, in response to the user recording operation on the courseware recording interface, the video courseware is recorded and stored in real time to obtain the recorded initial video courseware.

[0033] In some possible embodiments, the above step S230 may include: in response to a screen sharing operation on a courseware recording interface, recording the current screen content; wherein the current screen content includes the current PPT page or additional teaching materials of the current demonstration, that is, the additional teaching materials of the demonstration can be displayed in the recording screen; in response to a recording control operation on the courseware recording interface, recording control of the video courseware is performed; wherein the recording control operation includes a start control operation, a pause control operation, a continue control operation, an end recording operation, a camera turn on / off operation, a microphone turn on / off operation, a screen sharing turn on / off operation, and a recording next page PPT operation. During the recording process, the courseware recording interface displays a real-time preview screen; during the recording process, the video data recorded in the current period is periodically obtained, and the video data corresponding to the current period is respectively stored in the browser cache and the back-end server, until in response to the end of the recording operation, all the stored video data is used as the initial video courseware, and the web client is controlled to enter the video editing interface.

[0034] The screen sharing function can be used to display real-time annotations on the current PPT page or demonstrate additional teaching materials in the recording screen. The above-mentioned specified duration can be set according to actual needs and is not limited here. For example, the specified duration is 2 minutes. The above-mentioned browser cache can select IndexedDB; using IndexedDB to cache data can reduce the number of requests to the backend server and improve application performance.

[0035] The process of user recording courseware mainly includes the following functions: Step S231, real-time preview: During the recording process, a real-time preview window will be provided to display the images captured by the camera and the sounds collected by the microphone, so that the user can monitor the recording effect.

[0036] Step S232, screen sharing: If the lecturer needs to annotate the PPT content in real time or display the required application, the screen sharing function can be used, which allows the user to use the current screen content as part of the video.

[0037] Step S233, recording control: recording control options will be provided, including starting, pausing, continuing and ending recording, as well as the ability to record each page of the PPT separately.

[0038] Step S234, real-time upload and recording feedback: The background adopts a segmented recording method and performs real-time segmented caching of recorded video data, that is, during the recording process, the current recording task is ended at a specified interval and a new recording task is immediately started. At the same time, the currently recorded video data is stored in the browser IndexedDB cache and the video data is uploaded to the back-end server, providing a basis for subsequent real-time editing. It should be noted that the segmented recording process is executed in the background, and the user cannot perceive the segmented recording process (that is, the user cannot perceive the start and end of the recording task corresponding to each video data segment). At the same time, key information in the recording process can also be recorded, such as recording time, recording status (user status collected by the camera), etc., and feedback (that is, recorded key information) is provided after the recording is completed to help users understand the overall situation of the recording.

[0039] In specific implementation, after the user chooses to start recording, the front-end server will activate the camera and microphone, and the camera image and the PPT page will be displayed in the real-time preview screen at the same time. The effect presented by the real-time preview screen is the display effect of the final generated video courseware. Users can display the current PPT page or additional teaching materials in the recording screen through the screen sharing function. During the recording process, users can pause and continue to annotate the PPT content or add additional explanations. In order to improve the efficiency of subsequent video processing, during the video recording process, the current recording task will be ended at intervals, and a new recording task will be started immediately. The currently recorded video data will be stored in the browser IndexedDB cache and the video data will be transmitted to the back-end server. After each PPT page is recorded, the user can choose to end the recording or continue recording the next page (i.e., the next PPT page).

[0040] An exemplary courseware recording interface is as follows: Figure 3 As shown in FIG. 1 , the courseware recording interface includes a PPT page list area, a real-time preview area, a recording content track area, a recording control, and a saving control, etc.; among them, Figure 3 As shown, the PPT page list area displays the content of PPT page 1, PPT page 2, ... PPT page 7, and the real-time preview area displays a real-time preview screen consisting of the currently recorded PPT page and the camera screen.

[0041] Step S240, in response to the user's editing operation on the initial video courseware, the initial video courseware is edited to obtain the target video courseware.

[0042] After the user has finished recording the video, a powerful set of video editing tools will be provided, allowing the user to carefully edit and optimize the recorded content. These tools may include: A1 Video Preview: Users can retrieve recorded videos from the browser IndexedDB cache and watch them, ensuring the accuracy and completeness of the content.

[0043] A2 Video Editing: Users can retrieve recorded videos from the browser IndexedDB cache and accurately trim the video through the timeline, delete unnecessary parts, or adjust the order of different clips. The front-end server will record the user's final video editing steps.

[0044] In some possible embodiments, the above step S240 may include: obtaining the initial video courseware from the browser cache and displaying it in the video editing interface; in response to the user editing operation on the initial video courseware in the video editing interface, recording the video editing steps; in response to the editing completion operation on the initial video courseware, sending the video editing steps to the back-end server, so that the back-end server performs editing operations and rendering on the initial video courseware according to the video editing steps to obtain the edited video courseware; according to the edited video courseware, determining the target video courseware. In specific implementation, the editing completion operation can be a click operation on the save control (such as the save button) in the video editing interface. For example, after the user completes the editing and clicks the save button in the upper right corner, the video editing steps will be sent to the back-end server, that is, multiple editing can be performed before the user clicks the save button.

[0045] In a possible implementation, the edited video courseware can be directly used as the target video courseware.

[0046] In another possible implementation, the edited video courseware may be converted into a format and optimized to obtain a target video courseware in a target video format; wherein the target video format may include MP4 or WebM, and the file optimization includes compression processing. It should be noted that the target video format is not limited to MP4 or WebM, and the file optimization is not limited to compression processing. In other embodiments, other video formats or other file optimization methods may also be used.

[0047] Based on this, after the user completes the video editing, the front-end server will provide a one-click generation function, allowing the user to quickly generate the final video courseware, including: B1 format conversion: By sending format conversion operation instructions to the backend server, the video stored in the backend server is converted into a format suitable for online playback and sharing, such as MP4 or WebM.

[0048] B2 File Optimization: Video files stored in the backend server will be compressed to reduce file size for easy uploading and sharing.

[0049] Furthermore, the embodiment of the present invention also provides a backup function, based on which, after step S240, the method further includes: backing up the target video courseware. Automatically backing up the video files in the back-end server can ensure the security and recoverability of the data.

[0050] Furthermore, the embodiment of the present invention also provides a sharing function. Based on this, after step S240, the method further includes: sending the target video courseware to a preset student client or uploading it to a preset online education platform. The user can easily share the final video courseware with students or upload it to an online education platform. Through this process, it can be ensured that the final video courseware not only meets the teaching needs, but also is easy to distribute and watch, thereby improving the teaching effect and the students' learning experience.

[0051] The embodiments of the present invention have the following beneficial effects: (1) No need to install client software, improving system availability: Using a web client for video recording and editing avoids the need to install client software on computers that are subject to security controls, improving system availability and convenience, and allowing users to make videos on any device that supports a browser.

[0052] (2) Improve production efficiency: Through the automated PPT courseware uploading and parsing process, as well as the integrated video recording and editing functions, the time that lecturers spend on courseware production is greatly reduced. Lecturers can now focus on creating teaching content rather than technical operations, which significantly improves the efficiency of teaching content production.

[0053] (3) Optimizing user experience: Through the function of uploading video data in real time, the video data is stored in the browser IndexedDB cache and the video data is transmitted to the backend server at intervals during the recording process. Subsequent user preview and editing of the video are all performed by taking the video data from the browser IndexedDB cache, and the reading time is extremely short. In the final video synthesis step, the video editing instruction (carrying the video editing step) is sent to the backend server to operate the video data stored in the backend server. Traditional web page video recording and video editing operations are performed serially, that is, the video is recorded first, and after the video recording is completed, the complete video data is stored in the backend server before editing. The data upload before video editing takes a long time. This innovative step of the embodiment of the present invention effectively reduces the waiting time for uploading video data to the backend server before the later video editing, significantly improving the overall work efficiency. At the same time, the user device detection function ensures the stability of the recording environment, avoids problems during the recording process, and optimizes the user experience. At the same time, the real-time preview and recording control functions provide users with intuitive operation feedback, making the recording process smoother and more controllable.

[0054] (4) Fine-tune video quality: The video track editing function provided allows users to fine-tune and adjust the recorded video content, including cropping, stretching, shortening, undoing, restoring and adjusting the order, etc., ensuring the continuity and professionalism of the video content, thereby improving the quality and viewing experience of the final video courseware.

[0055] (5) Simplifying the courseware sharing process: The function of generating final video courseware with one click simplifies the video output and sharing process, allowing lecturers to quickly share courseware with students or upload it to online education platforms, improving the efficiency of courseware distribution and ensuring the timely updating and wide dissemination of teaching resources.

[0056] (6) Lowering the technical threshold: Taking into account the user's operational convenience, the threshold for instructors to use video recording and editing technology is lowered through simplified operating procedures and intuitive user interfaces, allowing non-professionals to easily produce high-quality video courseware.

[0057] (7) Improving teaching flexibility: The addition of screen sharing function allows lecturers to flexibly display additional teaching materials during the recording process, such as real-time annotations, demonstration applications, etc., which increases the flexibility and richness of teaching.

[0058] (8) Ensure data security and reliability: Automatic file backup and optimization ensure the security and reliability of courseware data, reduce the risk of courseware loss, and ensure the continuity and stability of teaching activities.

[0059] In summary, the embodiments of the present invention not only improve the production efficiency and quality of online education video courseware through integrated functional design, but also bring significant improvements and innovations to the field of online education by enhancing interactivity and optimizing user experience, thus meeting the needs of modern education for efficient, convenient and high-quality teaching resources.

[0060] Corresponding to the above-mentioned online education video recording and editing method, the embodiment of the present invention also provides an online education video recording and editing system. Figure 4 The structure diagram of an online education video recording and editing system shown in FIG. 1 includes: The device detection module 401 is used to perform device detection of the recording function of the user device to which the web client belongs in response to the start recording operation of the target PPT courseware to be recorded by the web client; The device activation module 402 is used to activate the camera and microphone of the user device after the device detection is passed, and control the web client to enter the courseware recording interface; wherein the courseware recording interface includes a recording interface and a track interface displayed simultaneously, and the courseware recording interface is used to display a real-time preview screen during the recording process, and the real-time preview screen includes a target PPT page automatically generated based on the target PPT courseware and an image captured in real time by the camera; The video recording module 403 is used to record and store the video courseware in real time in response to the user's recording operation on the courseware recording interface, and obtain the recorded initial video courseware; The video editing module 404 is used to edit the initial video courseware in response to the user's editing operation on the initial video courseware to obtain the target video courseware.

[0061] The online education video recording and editing system provided by the present invention can respond to the start recording operation of the target PPT courseware to be recorded by the web client, and perform device detection of the recording function on the user device to which the web client belongs; after the device detection is passed, the camera and microphone of the user device are activated, and the web client is controlled to enter the courseware recording interface; wherein the courseware recording interface includes a recording interface and a track interface displayed simultaneously, and the courseware recording interface is used to display a real-time preview screen during the recording process, and the real-time preview screen includes a target PPT page automatically generated based on the target PPT courseware and an image captured in real time by the camera; in response to the user recording operation on the courseware recording interface, the video courseware is recorded and stored in real time to obtain the recorded initial video courseware; in response to the user editing operation on the initial video courseware, the initial video courseware is edited to obtain the target video courseware. In this way, there is no need to install client software, and video recording and editing can be completed using the web client, which improves the usability and convenience of the system, allowing users to complete video production on any device that supports a browser; the recording function of the user's device is automatically detected before recording, which can ensure the stability and reliability of the recording function and prevent recording failures, thereby improving video production efficiency and optimizing the user experience; the automatic generation of target PPT pages and the integrated video recording and editing functions greatly reduce the time investment of lecturers in courseware production and significantly improve the production efficiency of teaching content; the real-time preview screen displayed during video recording can provide users with intuitive operation feedback and improve the user experience; the real-time storage of video courseware during video recording can shorten the time consumed for data storage, thereby improving the efficiency of video production and optimizing the user experience. In summary, the online education video recording and editing system provided by the present invention simplifies the production process of video courseware, reduces the workload of lecturers, and thus improves teaching efficiency and quality.

[0062] Furthermore, the above system also includes a page generation module, which is used to: obtain the target PPT courseware sent by the web client; perform a security check on the target PPT courseware, the security check including file format verification and file integrity verification; after the security check passes, upload the target PPT courseware to the back-end server, obtain the parsed data corresponding to the target PPT courseware returned by the back-end server, and use Html and JavaScript technology to dynamically generate a target PPT page that matches the layout and content of the target PPT courseware based on the parsed data; and display the target PPT page on the web client.

[0063] Furthermore, the above-mentioned video recording module 403 is specifically used for: recording the current screen content in response to the screen sharing operation on the courseware recording interface; wherein the current screen content includes the current PPT page or the additional teaching materials of the current demonstration; performing recording control of the video courseware in response to the recording control operation on the courseware recording interface; wherein the recording control operation includes a start control operation, a pause control operation, a continue control operation, an end recording operation, a camera turn on / off operation, a microphone turn on / off operation, a screen sharing turn on / off operation and a recording next page PPT operation, and during the recording process, the courseware recording interface displays a real-time preview screen; during the recording process, the video data recorded in the current period is periodically obtained, and the video data corresponding to the current period is respectively stored in the browser cache and the back-end server, until in response to the end of the recording operation, all the stored video data is used as the initial video courseware, and the web client is controlled to enter the video editing interface.

[0064] Furthermore, the above-mentioned video editing module 404 is specifically used for: obtaining the initial video courseware from the browser cache and displaying it in the video editing interface; recording the video editing steps in response to the user editing operation on the initial video courseware in the video editing interface; sending the video editing steps to the back-end server in response to the editing completion operation on the initial video courseware, so that the back-end server performs editing operations and rendering on the initial video courseware according to the video editing steps to obtain the edited video courseware; and determining the target video courseware based on the edited video courseware.

[0065] Furthermore, the video editing module 404 is also used to: perform format conversion and file optimization on the edited video courseware to obtain target video courseware in a target video format; wherein the target video format includes MP4 or WebM, and the file optimization includes compression processing.

[0066] Furthermore, the above system also includes a file backup module, which is used to back up the target video courseware.

[0067] Furthermore, the above system also includes a video sending module, which is used to: send the target video courseware to a preset student client or upload it to a preset online education platform.

[0068] For ease of understanding, the following is an exemplary introduction to the process of generating online education video courseware using the online education video recording and editing system (hereinafter referred to as the system). Figure 5 As shown in FIG. 1 , the process of generating online education video courseware includes: Step S510: The user uploads the PPT courseware to the backend server, and the backend server parses all elements in the PPT courseware and generates a web page that matches the PPT content.

[0069] Step S510 may include the following two steps: Step S511, PPT courseware upload: The lecturer clicks the "Upload Courseware" button on the system's web interface, and in the pop-up file selection dialog box, selects the locally stored PPT file to upload. After the system receives the file, it performs a security check, including file format verification and file integrity verification. After verification, the system uploads the file to the backend server and starts the parsing process.

[0070] Step S512, content parsing and web page generation: The back-end server parses all elements in the PPT file, including text, images, etc. After the parsing is completed, the back-end server returns the parsed PPT content in the form of pictures, and the system uses Html and JavaScript technology to generate a web page that matches the PPT content. The system uses CSS (Cascading Style Sheets) to style the web page to ensure that the visual effect is consistent with the original PPT. The generated web page is provided to the lecturer for preview to ensure the accuracy of the content.

[0071] In step S520, the system detects the browser type and version, as well as the status of the device to be used during the recording process, to ensure that the device is ready before recording.

[0072] User device detection includes: Before recording, the system will detect the user's camera, microphone, and network connection status. The system prompts the user to grant necessary permissions, such as the right to use the camera and microphone. Only after the user agrees to the authorization can the next steps be carried out. If any problems are detected, the system will provide troubleshooting suggestions to ensure that the device is ready before recording.

[0073] Step S530: The user starts the recording task, the system activates the camera and microphone, and displays a real-time preview screen in combination with the PPT content.

[0074] In step S540, the system ends the current recording task at regular intervals, stores the currently recorded video data in the browser IndexedDB cache, uploads the video data to the backend server, and starts a new recording task.

[0075] The courseware recorded by the user includes: the user chooses to start recording, the system activates the camera and microphone, and the camera image is combined with the PPT content to be displayed in the real-time preview screen. The user can use the screen sharing function to display the current PPT page or additional teaching materials in the recording screen. During the recording process, the user can pause and continue to annotate the PPT content or add additional explanations. In order to improve the efficiency of subsequent video processing, during the video recording process, the system will end the current recording task at intervals and immediately start a new recording task, store the currently recorded video data in the browser IndexedDB cache, and transmit the video data to the backend server. After recording each page of PPT, the user can choose to end the recording or continue recording the next page.

[0076] Step S550: The user ends recording.

[0077] In step S560, the system provides a timeline and editing tools, obtains video data from the browser IndexedDB cache for the user to make detailed adjustments to elements such as camera recorded video, audio, and shared screen images, and the system records the final editing operation steps.

[0078] User editing of recorded content includes: After recording is completed, the user enters the video editing interface, and the system provides a timeline and editing tools. The user can obtain video data from the browser IndexedDB cache and perform operations such as cropping, splicing, and stretching on the video. At the same time, the system records the user's video editing records (i.e., editing operation steps). The system supports multi-track editing, allowing users to make detailed adjustments to elements such as camera recorded video, audio, and shared screen images.

[0079] Step S570: The user ends video editing and starts video synthesis.

[0080] In step S580, the system sends the recorded video editing steps and video synthesis instructions to the backend server, and performs final editing and synthesis on the video stored in the backend server.

[0081] Step S590, the system generates a video format suitable for online playback, and shares the final video courseware with students, or uploads it to an online education platform.

[0082] Generating the final video courseware includes: after the user completes the video editing, select the "Generate Video" option, the system transmits the user's video editing record in step S560 to the back-end server, and the back-end server starts to edit the video stored in the back-end server according to the video synthesis instruction, and then renders the video file. The system converts the video file into a format suitable for online playback and compresses it to optimize the file size. After the video file is generated, the system provides sharing and saving functions, which can easily share the final video courseware with students or upload it to the online education platform.

[0083] The key points of the embodiments of the present invention include: 1. Automatic PPT parsing and web page generation: The uploaded PPT courseware is automatically parsed through the back-end server, and HTML and JavaScript technology are used to dynamically generate web pages that match the layout and content of each page of the original PPT, retaining the original design of the PPT and providing an intuitive and interactive interface for video recording and editing.

[0084] 2. User device detection and optimization: The system automatically detects the user's camera, microphone, and network connection status before recording to ensure the stability and reliability of the recording function and prevent recording failures.

[0085] 3. Integrated video recording and screen sharing: Users can record courseware through the camera and microphone selected by the system, and use the screen sharing function to show additional teaching materials such as real-time annotations or demonstration applications when needed.

[0086] 4. Segment recording and real-time segment caching: Segment recording is performed in the background, and the current video data segments are stored in the browser IndexedDB cache and backend server in real time. This method effectively reduces the waiting time for uploading video data to the backend server before post-editing the video, significantly improving overall work efficiency.

[0087] 5. Efficient video editing tools: It provides a set of efficient video editing tools, allowing users to crop, splice, stretch and perform other operations on recorded video content to optimize video quality.

[0088] 6. One-click video generation and sharing: After the user completes the video editing, he can generate the final video courseware with one click and easily share it with students or upload it to the online education platform.

[0089] The online education video recording and editing system provided in this embodiment has the same implementation principle and technical effects as those of the aforementioned online education video recording and editing method embodiment. For the sake of brief description, for matters not mentioned in the online education video recording and editing system embodiment, reference may be made to the corresponding contents in the aforementioned online education video recording and editing method embodiment.

[0090] like Figure 6 As shown, a front-end server device 600 provided in an embodiment of the present invention includes: a processor 601, a memory 602 and a bus, the memory 602 stores a computer program that can be run on the processor 601, when the front-end server device 600 is running, the processor 601 and the memory 602 communicate through the bus, and the processor 601 executes the computer program to implement the above-mentioned online education video recording and editing method.

[0091] Specifically, the memory 602 and processor 601 can be general-purpose memories and processors, which are not specifically limited here.

[0092] The embodiment of the present invention also provides a computer-readable storage medium, on which a computer program is stored, and when the computer program is executed by a processor, the online education video recording and editing method in the previous method embodiment is executed. The computer-readable storage medium includes: a USB flash drive, a mobile hard disk, a read-only memory (ROM), a RAM, a magnetic disk or an optical disk, and other media that can store program codes.

[0093] The term "and / or" herein is only a description of the association relationship of the associated objects, indicating that there may be three relationships. For example, A and / or B can represent: A exists alone, A and B exist at the same time, and B exists alone. In addition, the term "at least one" herein represents any combination of at least two of any one or more of a plurality of. For example, including at least one of A, B, and C can represent including any one or more elements selected from the set consisting of A, B, and C.

[0094] In all examples shown and described herein, any specific values ​​should be interpreted as merely exemplary and not as limiting, and thus other examples of the exemplary embodiments may have different values.

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

[0096] In the several embodiments provided in the present application, it should be understood that the disclosed systems and methods can be implemented in other ways. The system embodiments described above are merely schematic. For example, the division of modules is only a logical function division. There may be other division methods in actual implementation. For example, multiple modules or components can be combined or integrated into another system, or some features can be ignored or not executed. Another point is that the mutual coupling or direct coupling or communication connection shown or discussed can be through some communication interfaces, and the indirect coupling or communication connection of modules can be electrical, mechanical or other forms.

[0097] The modules described as separate components may or may not be physically separated, and the components shown as modules may or may not be physical modules, that is, they may be located in one place or distributed on multiple network modules. Some or all of the modules may be selected according to actual needs to achieve the purpose of the solution of this embodiment.

[0098] In addition, each functional module in each embodiment of the present invention may be integrated into one processing module, or each module may exist physically separately, or two or more modules may be integrated into one module.

[0099] Finally, it should be noted that the above embodiments are only used to illustrate the technical solutions of the present invention, rather than to limit it. Although the present invention has been described in detail with reference to the aforementioned embodiments, those skilled in the art should understand that they can still modify the technical solutions described in the aforementioned embodiments, or replace some or all of the technical features therein with equivalents. However, these modifications or replacements do not cause the essence of the corresponding technical solutions to deviate from the scope of the technical solutions of the embodiments of the present invention.

Claims

1. A method for recording and editing online educational videos, characterized in that: include: In response to a start recording operation of a target PPT courseware to be recorded by a web client, performing a device detection of a recording function on a user device to which the web client belongs; After the device detection is passed, the camera and microphone of the user device are activated, and the web client is controlled to enter the courseware recording interface; wherein the courseware recording interface includes a recording interface and a track interface displayed simultaneously, and the courseware recording interface is used to display a real-time preview screen during the recording process, and the real-time preview screen includes a target PPT page automatically generated based on the target PPT courseware and an image captured by the camera in real time; In response to a user recording operation on the courseware recording interface, recording and real-time storing the video courseware are performed to obtain an initial video courseware that has been recorded; In response to a user editing operation on the initial video courseware, the initial video courseware is edited to obtain a target video courseware.

2. The method according to claim 1, characterized in that Before performing a device detection of a recording function on a user device to which the web client belongs in response to the web client starting a recording operation on the target PPT courseware to be recorded, the method further includes: Obtain the target PPT courseware sent by the web client; Performing a security check on the target PPT courseware, the security check including file format verification and file integrity verification; After the security check is passed, the target PPT courseware is uploaded to the back-end server, the parsed data corresponding to the target PPT courseware returned by the back-end server is obtained, and the target PPT page that matches the layout and content of the target PPT courseware is dynamically generated based on the parsed data using Html and JavaScript technology; The target PPT page is displayed on the web client.

3. The method according to claim 1, characterized in that The step of recording and storing the video courseware in real time in response to the user recording operation on the courseware recording interface to obtain the recorded initial video courseware includes: In response to the screen sharing operation on the courseware recording interface, the current screen content is recorded; wherein the current screen content includes the current PPT page or additional teaching materials currently being demonstrated; In response to the recording control operation on the courseware recording interface, the recording control of the video courseware is performed; wherein the recording control operation includes a start control operation, a pause control operation, a continue control operation, an end recording operation, an on / off camera operation, an on / off microphone operation, an on / off screen sharing operation, and a recording next page PPT operation, and during the recording process, the courseware recording interface displays the real-time preview screen; During the recording process, the video data recorded in the current period is periodically obtained, and the video data corresponding to the current period is stored in the browser cache and the back-end server respectively, until the recording operation is ended in response, all the stored video data is used as the initial video courseware, and the web client is controlled to enter the video editing interface.

4. The method according to claim 3, characterized in that The step of editing the initial video courseware in response to the user editing operation on the initial video courseware to obtain the target video courseware includes: Obtaining the initial video courseware from the browser cache and displaying it in the video editing interface; In response to a user editing operation on the initial video courseware in the video editing interface, recording video editing steps; In response to the completion of the editing operation for the initial video courseware, the video editing step is sent to the back-end server, so that the back-end server performs an editing operation and rendering on the initial video courseware according to the video editing step to obtain the edited video courseware; According to the edited video courseware, the target video courseware is determined.

5. The method according to claim 4, characterized in that Determining the target video courseware according to the edited video courseware includes: The edited video courseware is subjected to format conversion and file optimization to obtain a target video courseware in a target video format; wherein the target video format includes MP4 or WebM, and the file optimization includes compression processing.

6. The method according to claim 1, characterized in that After the initial video courseware is edited in response to the user editing operation on the initial video courseware to obtain the target video courseware, the method further includes: Back up the target video courseware.

7. The method according to claim 1, characterized in that After the initial video courseware is edited in response to the user editing operation on the initial video courseware to obtain the target video courseware, the method further includes: The target video courseware is sent to a preset student client or uploaded to a preset online education platform.

8. An online education video recording and editing system, characterized in that: include: A device detection module, configured to perform device detection of a recording function on a user device to which the web client belongs in response to a start recording operation of the web client for a target PPT courseware to be recorded; A device activation module, which is used to activate the camera and microphone of the user device after the device detection is passed, and control the web client to enter the courseware recording interface; wherein the courseware recording interface includes a recording interface and a track interface displayed simultaneously, and the courseware recording interface is used to display a real-time preview screen during the recording process, and the real-time preview screen includes a target PPT page automatically generated based on the target PPT courseware and an image collected by the camera in real time; A video recording module, for recording and storing video courseware in real time in response to a user recording operation on the courseware recording interface, and obtaining an initial video courseware that has been recorded; The video editing module is used to edit the initial video courseware in response to the user's editing operation on the initial video courseware to obtain the target video courseware.

9. A front-end server device, characterized in that: It includes a memory and a processor; the memory stores a computer program that can be run on the processor, and the processor implements the online education video recording and editing method described in any one of claims 1 to 7 when executing the computer program.

10. A computer-readable storage medium having a computer program stored thereon, characterized in that: When the computer program is executed by a processor, the online education video recording and editing method described in any one of claims 1-7 is executed.

Images