子とペアプロ

昨年5月に作ったスクリーンセーバーをまだ使ってるのだけど、子がたびたびスクリーンセーバーを眺めて喜んでいた。とくに顔が出てきて動くのが気に入っていそう。
子が「おもしろい絵を作るところが見たい」というので、ブログの編集画面にHTMLを書いて、コーディング風景を見せてあげた。
好きな絵文字を選んでもらい、好きな大きさにして、気にいる動きをつける。
setIntervalの第2引数をいろいろ変えると動きが超高速になったり、掛け算の数字を変えると楕円になったりと、いろんな数字を変えたら動きが変わることはわかってもらえたような気がする。
前に子がオフィスに遊びに来たときには、仕事場とは、おやつを食べてジュースを飲んでけん玉の練習をする場所という理解をしていたのだけど、それに加えて、仕事とはお絵描きをして遊ぶ場所という解釈が追加されているような気がする。

音声入力で、応答なしでコードだけ出てくるコーディングAIがあれば、おしゃべりだけでコードを書かせてお絵かきする遊びができそうなので、もうちょっと子供向けバイブコーディングツールなど調査したい。
昔はScratchで入門していたと思うけど、今なら、わけもわからず「人工衛星を飛ばして」とか言って絵が出てきたらそっちのほうが楽しいだろうと思う。

<div id="character" style="position: absolute; font-size: 9em; pointer-events: none;">🛰️</div>
<script>
(() =>{
  let f=0.0;
  setInterval(() => {
  document.querySelector('#character').style.left = `${Math.sin(f+=0.15) * 100}px`;
  document.querySelector('#character').style.top = `${Math.cos(f+=0.2) * 400}px`;
  }, 90);
})();
</script>

🛰️