One click online video production through ve template

Posted by petethepirate on Fri, 14 Jan 2022 15:11:55 +0100

One click online video production is realized through ve template. Specific tools are available from the following websites:
http://vesdk.com/ https://www.mbjia.com/ .
ve video engine has a powerful ae export tool and a rendering sdk. We can export the basic template from the ae tool and make video through the rendering sdk. https://www.mbjia.com/ It is through this form that one click video production is realized.

  • ve video template

Template folder structure

assets: store all resource files participating in template rendering
Data: store all animation data files
ui: store accessory drawing files required for ui interface design
config.json: template configuration file
music.mp3: audio files

Introduction to standard template config file

{
    "settings": {
        "attr": 0 //Property setting 1: open OIT rendering
    },
    "fps": 30, //Main frame rate of template
    "main": "comp0", //The name attribute of the main composition used for rendering. The SDK supports pre composition, so there is more than one exported composition layer. Here, the name of the main composition is defined.
    "description": "Synthesis 1", //Description of the template, corresponding to the name of the main composition in AE
    "version": "1.3.0.beta", //SDK kernel version number, which is closely related to rendering effect
    "ui_version": "2.0", //The editing interface version number is currently divided into 1.0 and 2.0. The 2.0 interface is more perfect and easier to understand
    "type": 1, //Template properties, set by bit, 1: normal template, 2: dynamic template, 4: filter, 512: Character Animation
                    // Note that this is a bitwise value if the normal template contains character animation
                    // The binary value of type is 1001, that is, 1 + 512 = 513
                    // Therefore, the template type should not be judged by = = but by bit and,
                    // For example, judge whether it is a standard template type & 1= 0 instead of type == 1 
    "snap": [], //Integer array, the frame index number of the screenshot, which has not been implemented yet
    "comps": [{ //Save all composite objects
        "name": "comp0", //Composite name
        "duration": 150, //Total frames
        "fps": 30, //Frame rate
        "size": [720, 1280], //Synthetic size, some models do not support more than 4096
        "bg": "#ffffffff ", / / background color
        "layers": [{ //All layer objects in the composite
            "uuid": "layer_2", //Unique ID of the layer
            "ui_key": "", //Designer set tags in the designer interface
            "ui_extra": "", //Additional information set by the designer in the designer interface
            "source": "assetkey0", //Resource ID corresponding to the layer
            "type": 32769, //Layer attributes, such as 3D attributes, layer type, etc
            "blend": 0, //Mixed mode
            "matte": 0, //trakmat type
            "resample": 0, //
            "enabled": true, //Visible
            "range": [0, 0, 149,30], //The starting frame Start Time, visible starting frame In Point and visible continuous frame number (Out Point - In Point) of the corresponding layer are explained in detail below, and the fourth data has been discarded
            "mask": [], //Mask data
            "effects": [], //Special effect data
            "transform": { //Transform the information, and the 3d layer is a 3d array
                "p": [360.0, 640.0],  //Position, [x-axis coordinates, y-axis coordinates]
                "a": [540.0, 960.0], //Anchor point, [x-axis coordinate, y-axis coordinate]
                "s": [1.0, 1.0], //Zoom, [x-axis zoom, y-axis zoom]
                "t": 1.0, //Transparency, 0 - 1.0
                "r": 0.0 //Rotation angle
            }
        }]
    }],
    "assets": [{ //Save all material object arrays
        "key": "assetkey0", //Unique ID of the material
        "ui_key": "", //The identifier key set by the designer for the material in the export tool
        "ui_extra": "", //Additional data set by the designer for the material in the export tool
        "fps": 30, //In the explain material option in AE, if the frame rate is specified, this key exists; otherwise, it is 0 or does not exist
        "name": "asset1.mp4", //The name of the material. The function of the name field is different according to the material type  
        "type": 1, //Material type 0: unknown material type 1: picture or video or picture sequence frame material 2:OpenGL texture material 3: pre synthetic material 4: solid state color material 5: custom material
        "num": 0, //If the material is a picture sequence frame material, this num represents the number of sequence frame files. In other cases, the num field is 0
        "text_anim":"data.json", //Text animation data, which exists only when advanced character animation is turned on
        "size": [1080, 1920], //Material size, ui 2.0 text material no longer uses this size (refer to editSize)
        "ui":{//The transformation information only supports 2D pictures and text, and only one exists at the same time
            "f":"a.png", //Foreground drawing (accessory drawing)
            "b":"b.png", //Background map
            //Picture material information
            "group": 10, //Group index
            "index": 0, //Intra group index
            "duration": 278, //Continuous frames (maximum frames based on the main composite frame rate)
            "accept": 0, //Accept material type
            "type": 1, //Editable type 1: Picture 2: text 3: Advanced Character Animation text
            "editSize": [100, 100], // Edit area, picture material size
            "p": [100.5, 38.0],  
            "a": [100.5, 38.0],
            "s": [1.0, 1.0],
            "t": 1.0,
            "r": 0.0,
            "area": [0, 0, 100, 100] // The selected areas designated by the designer are x-axis coordinates, y-axis coordinates, width and height

            //Text material information
            "group": 9, //Group index
            "index": 0, //Intra group index
            "duration": 348, //Continuous frames (maximum frames based on the main composite frame rate)
            "type": 2, //Editable type 1: Picture 2: text 3: Advanced Character Animation text
            "default": "Edit text", //default text
            "max": 4, //Maximum number of words
            "font": "SimHei", //Font full name
            "font_style": "Regular", //Font style (such as bold, thin, italic, etc.)
            "font_family": "STSong",//Font family name
            "font_file": "Songti.ttc",//Font file name (string is not guaranteed to be returned for all font types; for some types of fonts, the return value may be an empty string)
            "size": 92, //font size
            "line_height": 110, //Row height
            "fill": "#ffffff ", / / fill color
            "stroke": "#000000 ", / / stroke color
            "width": 0, //Stroke Width 
            "strokeOverFill": true, //Stroke is drawn on top of fill
            "align": 0, //Typesetting 0: align left 1: align right 2: align Center
            "direction": 0,//Text direction 0: horizontal text 1: vertical text
            //--------------------------------------------------------------------------------
            //type=3 type text can call SDK to draw pictures. The following information is required
            "box_text":true, //Whether it is text box type text (only supported by advanced character animation)
            "adapt":true, //Turn on adaptation (Advanced Character Animation only)
            "bound":[-50,-50,100,100], //Text box [x,y,width,height] (only supported by advanced character animation)
            //--------------------------------------------------------------------------------
            "faux_bold":true, //Whether to use imitation bold (advanced character animation is not supported at present)
            "faux_italic":true, //Whether to use Italic (advanced character animation is not supported at present)
            "shadow": "#000000 ", / / projection (deprecated, layer style projection supported)
            "s_alpha": 0.0,//(deprecated, layer style projection supported)
            "s_angle": 0,//(deprecated, layer style projection supported)
            "s_dist": 0,//(deprecated, layer style projection supported)
            "s_size": 0,//(deprecated, layer style projection supported)
            "editSize": [100, 100], // Editing area, text and picture material size
            "p": [0.0, 0.0],
            "a": [0.0, 0.0],
            "s": [1.0, 1.0],
            "t": 1.0,
            "r": 0.0,
            "area": [0, 0, 100, 100] // The selected areas designated by the designer are x-axis coordinates, y-axis coordinates, width and height
        }
    }],
        "ui_group": [ // Corresponding assets - > UI - > Group 
        {
            "size": [
                720,
                1080
            ]
        },
        {
            "size": [
                720,
                1080
            ]
        }
    ]
}

The confi configuration file contains all material information and parameters of the template. We can edit and assemble the corresponding json through these parameters, and then realize video production by rendering sdk.

  • Template parsing
    Mainly resolve config JSON file to obtain the information required in the above model (template type, sdk version, ae version, fps,size,duration, etc. can be directly obtained and used. The number of replaceable words and pictures need to be obtained by traversing assets. Analyze the editable asset (with ui field), and replace the default material (name field), foreground (f field), background (b field), config JSON and upload it to the cloud for front-end template editing and material acquisition;
  • Template editing
    After initializing the editing interface, the front end can edit editable materials, such as rotation, scaling, displacement and changing text content Then assemble the data into replacejason Replacejason details After that, call the back-end api to form the rendering task data, and call Rendering api Just turn on video rendering

This article aims to provide ideas for everyone to realize one click video production. If you want to know more about VE video engine, you can go to the website for consultation and obtain detailed services.