BlocosIA Wiki Editor

3D animation studio, costumes and embedding games

Edit the costumes of any sprite, create 3D animations with keyframes, use the new 3D Characters blocks and put your game on any website.

1. Costumes of any sprite

Pick a sprite and click 3D in the Costumes tab (or the 3D Characters category button). In the Sprite costumes tab you can: edit each costume in the drawing editor, duplicate, delete, reorder, draw a new one, take a photo of the 3D view (it becomes a costume) and import images. Click Save.

2. Create animations (keyframes)

In the Create animation tab:

  1. Choose a part (or click it on the character): head, arms, legs, hips… Rigged models show their bones.
  2. Use the turn X / Y / Z and up/down controls to make the pose.
  3. Drag the timeline, make another pose and click Record keyframe (a diamond appears).
  4. Test plays the animation. Loop goes back to the first pose (good for walking and dancing).
  5. Give it a name and click Save animation. It becomes 2D costumes (in every direction) and goes with the 3D model to the 3D World.

Tip: in Start from you copy a ready animation and change only what you want.

3. New 3D Characters blocks

• evt_bandeira
• p3d_auto [PARADO: parado, ANDANDO: andar]

• evt_tecla [TECLA: espaço]
• p3d_tocar_vez [CLIPE: atacar, FPS: 16]

• p3d_quando_terminar
• p3d_auto [PARADO: parado, ANDANDO: andar]
  • go to the next / previous / first / last / random frame — the animation's "next costume" (and it stops playing by itself):
• evt_tecla [TECLA: seta para direita]
• p3d_ir_quadro [QUAL: proximo]
  • switch to the next / previous / random animation, set the speed, pause / resume, animation frame, number of frames, list of animations.

Examples: Zombie Escape Open and 3D Dance Show Open.

4. Embed your game on a website

Publish the project (Share) and open Embed on your website or blog: choose the size and copy the code. It works on WordPress, Google Sites, Blogger, Moodle and any HTML page. Examples can be embedded too:

<iframe src="https://blocosia-studio.web.app/embed?exemplo=44" width="640" height="536" style="border:0" allow="fullscreen; autoplay; gamepad" allowfullscreen></iframe>

Open in the editor