VisoTalkExamplesDocsGitHubnpm

Examples / shape-sketch

A picture from shapes

0:08 · made by an agent with the VisoTalk skill

Source

The video is this document. The narration is the text of each Line, and a word inside it makes an object appear when it is spoken.

  <Scene id="s" pattern="stage" slots={{title: "head", main: ["c1", "c2", "c3", "e21", "e32", "main", "fork", "c4", "mark", "logo"]}}>
    <Beat id="b1" duration={2.4}>
      <Appear on="c1" at="start"/>
      <Appear on="c2" at="start" offset={0.3}/>
      <Appear on="c3" at="start" offset={0.6}/>
      <Tween on="e21" draw={1} at="start" offset={0.9} dur={0.5}/>
      <Tween on="e32" draw={1} at="start" offset={1.2} dur={0.5}/>
    </Beat>
    <Beat id="b2" duration={2.4}>
      <Appear on="main" at="start"/>
      <Appear on="mark" at="start" offset={0.4}/>
      <Appear on="logo" at="start" offset={0.7}/>
    </Beat>
    <Beat id="b3" duration={2.4}>
      <Appear on="fork" at="start"/>
      <Tween on="fork" draw={1} at="start" dur={0.8}/>
      <Appear on="c4" at="start" offset={0.7}/>
      <Tween on="main" x={1280} y={300} at="start" offset={0.7} dur={0.8}/>
    </Beat>
  </Scene>
examples/shape-sketch/doc.tsx on GitHub ↗