子どもが描いたキャラクターをまばたきさせると、顔まで横に動いてしまう。歩くポーズに替えただけなのに、足が地面から浮いて見えることはありませんか。
コスチュームを切り替える瞬間だけ位置がずれるなら、各コスチュームの「中心の目印に対する絵の位置」を比べてみましょう。座標を補正する前に、顔や体の同じ場所を基準にして絵をそろえる方法があります。Scratch公式も、コスチュームの中心が位置合わせや回転の基準になることを説明しています。Scratch公式のコスチューム解説
この記事では、自分で描いたキャラクターの表情・ポーズを切り替えたときの位置ずれに絞って、確認と修正を進めます。
座標が同じでも、見える絵の位置はずれる
たとえば、「目を開けた顔」と「目を閉じた顔」を別々に描いたとします。開いた顔は編集画面の中心付近、閉じた顔は少し右側に描いてあったらどうでしょう。
スプライトの位置を動かしていなくても、切り替えた瞬間に顔が横へ跳ねたように見えます。確認したいのは、絵が上手かどうかではなく、中心の目印から見て、同じ体の部分が同じ位置にあるかです。
Scratchの「次のコスチュームにする」は、選んでいるスプライトのコスチュームを次のものに切り替えるブロックです。切り替えの仕組みと、絵の位置合わせを分けて考えると、直す場所を絞れます。Scratch公式「Next Costume」
なお、絵の外側を囲む四角形の中央と、そろえたい体の場所が一致するとは限りません。片手を大きく伸ばした絵と、両手を下ろした絵では、外形の中央が変わるためです。「枠の真ん中」だけを合わせず、何を動かさずに見せたいのかを決めます。
まず停止して、コスチュームだけを切り替える
最初から移動のプログラムを書き換えるのではなく、作品を停止した状態で比較することをおすすめします。以下は、位置ずれを見分けるための確認手順です。
- 修正前の作品を別名で保存するなど、戻せる状態を用意する。
- 赤い停止ボタンを押し、調べたいスプライトを選ぶ。
- スプライトの情報欄で、現在のx座標・y座標をメモする。
- 「コスチューム」タブで、ずれを比べたい絵を交互に選ぶ。
- ステージ上の顔・胴体・足元を見て、どこが動いたように見えるかを確かめる。
この比較では、ステージ上のキャラクターをドラッグしないようにします。絵を替える操作と、スプライトを移動する操作が混ざると、違いを追いにくくなるからです。
止めた状態でも同じずれが出るなら、まずコスチューム側を調整する候補になります。一方、止めた状態ではそろっていて、実行中だけずれる場合は、絵を動かす修正をいったん見送ります。今回の方法で直す対象かどうかを、ここで分けましょう。
コスチュームの選択や編集の基本操作は、Scratchチームの公式解説でも確認できます。
まばたきは顔、歩行は接地位置を基準にする
絵を動かす前に、そろえる場所を一つ選びます。次の表は、本記事で提案する位置合わせの考え方です。
| 作りたい動き | そろえる基準の例 | 比較するときに見ること |
|---|---|---|
| まばたき・口の開閉 | 頭の輪郭や鼻の位置 | 目や口以外まで横に動いていないか |
| 手を振る | 胴体の同じ場所 | 腕と一緒に体全体が揺れていないか |
| その場で足踏みする | 体の左右の基準と、地面に接する高さ | 意図せず浮いたり沈んだりしないか |
たとえば、まばたきなら「鼻の位置は固定して、まぶただけ変える」と決められます。頭の輪郭が同じなら、その輪郭を重ねるつもりで比べてもよいでしょう。
歩く動きでは、上げた足まで地面にそろえる必要はありません。見るのは、地面についている足の高さや、体を置きたい位置です。しゃがむ絵なら、頭が下がるのは意図した変化かもしれません。
大切なのは、すべてを動かさなくすることではなく、「動かしたい部分」と「その場に残したい部分」を分けること。コスチュームの中心を基準に位置を考える仕組みは、Scratch公式の中心点の説明が参考になります。
絵全体を選び、中心の目印との関係をそろえる
ここからは、Scratch 3のベクターモードで描いた絵を例にします。選択範囲の操作はモードによって異なるため、ビットマップの絵で操作が分からない場合は、無理に変換せず、元の絵を残して確認してください。
基準にするコスチュームを決める
まず、立ち姿など、位置を決めやすい絵を基準にします。編集画面の中心の目印に対して、鼻や胴体などの基準がどこにあるかを見ます。
必ず鼻を中心の目印に重ねなければならない、という意味ではありません。中心から少し上に鼻がある配置でも、ほかのコスチュームで同じ関係になれば比較できます。編集画面の見えている範囲の中央ではなく、中心を示す目印を頼りにしてください。
お子さまに合う学び方診断
正解・不正解を決める診断ではありません。今の様子から、取り組みやすい学び方の入口をご案内します。
ずれる絵を、部品ごとではなくまとめて動かす
矢印の選択ツールで、顔・体・持ち物など、移動させたい絵全体を囲んで選びます。そのうえで絵の内側をドラッグし、基準にしたコスチュームと位置関係をそろえます。選択枠の角を引っ張って大きさを変える操作とは分けましょう。
顔だけを動かして帽子を残すと、別のずれを作ってしまいます。選択に入れ忘れた部分がないかも確認します。矩形で囲んだ図形やグループを選ぶ動作は、Scratch公式のペイントエディター実装でも確認できます。
ステージで切り替え、見え方を確かめる
調整したら、元のコスチュームと交互に選びます。編集画面だけで判断せず、ステージ上で「顔が跳ねなくなったか」「足元が浮かなくなったか」を見ましょう。
一度に位置・大きさ・形を全部変える必要はありません。まず位置だけを調整し、違いを確認します。位置がそろった後にも体の大きさが違って見えるなら、それは次に検討する別の変更として残します。
追加する表情は、そろえた絵を複製して作る
これから表情を増やすなら、位置がそろったコスチュームを複製し、必要な部分だけ描き替える方法を試してみてください。
まばたきなら目、話す動きなら口を変更します。毎回キャラクター全体を描き直すよりも、「どこを変えたか」を追いやすい作り方です。Scratchチームも、コスチュームを複製して動かしたい部分を編集する手順を紹介しています。公式解説のコスチューム複製手順
すでに描いた絵を捨てる必要はありません。まず、よく使う表情の組み合わせだけをそろえる選択肢もあります。
確認結果は、次の短いメモにすると作業を再開しやすくなります。
- 比べる絵:目を開けた顔/目を閉じた顔
- 動かさない基準:鼻の位置
- 見つけた違い:閉じた顔のほうが右に寄っている
- 今回の変更:閉じた顔の絵全体を左へ移動
- 確認結果:顔の横ずれはなくなった/まだ少し残る
これは記入例です。実際の作品では、「胴体」「接地している足」など、自分で選んだ基準に置き換えて使ってください。
よくある質問(FAQ)
x座標とy座標が同じなら、絵も同じ位置になるのでは?
コスチュームの中心に対して絵がどこに描かれているかも関係します。座標だけでなく、各コスチュームの中心の目印と、顔や体の位置関係を比べてください。Scratch公式の位置合わせの説明
すべての絵を、外枠の真ん中に合わせればよいですか?
本記事の方法では、外枠よりも体の同じ場所を優先します。片手を伸ばす動きなどは、外形が変わっても胴体をその場に残したい場合があるためです。作品で固定したい場所を選びましょう。
コスチュームごとに座標を変えて直してもよいですか?
演出として位置を変えたいなら、その設計も選択肢です。ただ、同じ場所でまばたきさせたいだけなら、まず絵の位置合わせから試すことをおすすめします。表情を増やすたびに座標の補正も追加する作り方を避けられます。
跳ねる動きが好きなら、ずれを残してもよいですか?
もちろんです。「顔が跳ねるのが面白い」という意図があれば、表現として残せます。今回そろえるのは、本人が意図していない移動です。正しさだけでなく、どんな動きに見せたいかで判断してください。
CotoMiraiで、作りたい動きを相談する
CotoMiraiでは、年齢・興味・理解度に合わせたプログラミングの個別指導を行っています。教室で学ぶことを検討する際は、「表情だけ替えたいのに顔が動く」など、実現したい動きを具体的に伝えてみてください。CotoMiraiの個別指導について
年中以上のお子さまは、公式案内から無料体験を申し込めます。家庭の作品を使った相談の可否や、希望する体験内容は、申し込み時にご確認ください。
参考にした情報
- Scratch Foundation:Costumes
- Scratch Foundation:Next Costume
- The Scratch Team:Unlock the block: next costume
関連する記事
お子さまに合う学び方診断
正解・不正解を決める診断ではありません。今の様子から、取り組みやすい学び方の入口をご案内します。