ちょこっとプログラミング

「ちょこっとプログラミング」へようこそ!

このシミュレーターは、まるでゲームのようにキャラクターの動きを自由にプログラミングできて、楽しくて直感的なツールだよ。

時間軸に沿ってキャラクターの「移動」や「ジャンプ」といったアクションを指示するだけで、君だけのオリジナルアニメーションがすぐに完成するよ。

複雑なコードは一切不要!プログラミング的思考タイムラインに沿った順序を立てて考える力を遊びながら自然と養うことができるよ。

さっそく使い方を説明するよ。

ちょこっとプログラミングを使って見よう

ちょこっとプログラミング

「ちょこっとプログラミング」の使い方

  1. アクションを設定する


    画面左側には、「char-1 (赤いまる)」と「char-2 (青いまる)」それぞれのアクション設定エリアがあるよ。

    時間 (ミリ秒)
    アクションを開始したいタイミングをミリ秒(1秒 = 1000ミリ秒)で入力してね。例えば、0ミリ秒はアニメーション開始直後、500ミリ秒は0.5秒後だよ。

    アクション
    プルダウンメニューからキャラクターに実行させたいアクションを選んでね。

    「右へ移動開始」「左へ移動開始」「上へ移動開始」「下へ移動開始」
    キャラクターを指定の方向に動かす指示を選ぶよ。

    「移動停止」
    実行中の移動アクションを停止させるよ。

    「ジャンプ開始」
    キャラクターがジャンプするよ。

    「ジャンプ停止」
    ジャンプアニメーションを中断し、元の高さに戻すよ。

    値 (px)
    「移動」や「ジャンプ」を選択した場合に移動距離やジャンプの高さを決めるよ。

    移動距離
    どれくらいの距離を移動させるかをピクセル (px) で入力してね。

    ジャンプ高さ
    どれくらいの高さまでジャンプするかをピクセル (px) で入力してね。

    「アクション追加」ボタン
    設定したアクションをタイムライン(イベントリスト)に追加してね。

  2. イベントリストを確認する


    画面右側の「現在のタイムラインイベント」には、追加したアクションが時間順に表示されるよ。
    不要なアクションは、リストの右にある「削除」ボタンでいつでも消すことができるよ。

  3. アニメーションを再生・リセットする


    アクションの追加が終わったら、画面右上のボタンでアニメーションを制御できるよ。

    「プログラム実行」ボタン
    設定されたすべてのアクションに従って、キャラクターがアニメーションを開始するよ。キャラクターは常に初期位置(中央付近)からスタートし、目標地点の配置は変わらないよ。 キャラクターの動きを微調整しながら何度も試したい時に便利だよ。

    「目標地点とキャラクターをリセット&シャッフル」ボタン


    画面上のA, B, C, Dの目標地点がランダムな新しい位置に再配置されるよ。同時にキャラクターも初期位置に戻り、目標地点の色もリセットされるよ。完全に新しい状況でアニメーションを始めたい時に使ってね。

    キャラクターが目標地点に到達すると、その目標地点の色が変わるよ。全ての目標地点に到達するとクリアだよ!

ヒント!

  • 複数のアクションを同じ時間に設定することもできるよ。
    • 移動中のキャラクターに別の移動指示を出すと、新しい指示が優先されるよ。
    • いろいろなアクションと時間を組み合わせて、キャラクターに面白い動きをさせてみてね!
© EGAKU-Lab All rights reserved.