User study highlights

Back to All Results

Motion Vectorization

Input video: congratulations

Output SVG motion program code

Output SVG motion program

Motion Program Transformation

Appearance Adjustment

Simple appearance adjustment

Input SVG motion program

MPTransformer(P, args):
    // Set background color.
    setBgColor(P, [10, 100, 60])

    // Replace text with HAPPY HOLIDAYS.
    selObjs = objSelector(P, "property", 'id', "shape_09", 0, 1)
    changeAppearanceObjTransformer(selObjs, ["happy_holidays.png"])

    // Replace confetti with snowflakes.
    selObjs = objSelector(P, propQuery, "id", "not shape_09", [0, P.endFrm])
    for i in range(4):
        start_idx = i * selObjs / 4
        end_idx = (i + 1) * selObjs / 4
        newAppearances = [f"snowflake{i + 1}.png" for _ in range(start_idx, end_idx)]
        changeAppearanceObjTransformer(selObjs[start_idx:end_idx], newAppearances)

Motion program transformer code. The participant used changeAppearanceObjTransformer to create a holiday-themed card.

Output SVG motion program

Input SVG motion program

MPTransformer(P, args):
    // Change text to HAPPY NEW YEAR.
    selObjs = objSelector(P, propQuery, "id", "shape_09", [0, P.endFrm])
    changeAppearanceObjTransformer(selObjs, ["happy_new_year.png"])

    // Reverse motion of confetti and make it shoot outwards.
    selObjs = objSelector(P, propQuery, "id", "not shape_09", [0, P.endFrm])
    function fall_up(t, [y]):
        return P.height - y[t]
    adjustGlobalObjTransformer(selObjs, fall_up, [0, P.endFrm])
    for obj in selObjs:
        x_offset = propQuery(obj, "positionX", [0, P.endFrm])
        y_offset = propQuery(obj, "positionY", [0, P.endFrm])
        x_offset = [x - P.width / 2 for x in x_offset]
        y_offset = [P.height - y for y in y_offset]
        function rotate(t, [theta, x, y]):
            0.1 * x[t] + 0.01 * y[t] * np.sign(x[t])
        adjGlobalMotion(obj, rotate, [obj.startFrm, obj.endFrm])
    
    // Replace confetti with gold streamers and stars.
    newAppearances = ["gold%d.png" % (i % 5 + 1) for i in range(len(selObjs))]
    changeAppearanceObjTransformer(selObjs, newAppearances)

Motion program transformer code. The participant used changeAppearanceObjTransformer to create a new years-themed card. They also adjust the motion of the streamers to make them shoot upwards and outwards.

Output SVG motion program