WARPこどもプログラミング

小学生から始める WARPでのHTML/CSS講座【教材ストック集】

はじめに…

席についたら、まずやってみてね！


もじにゅうりょくのれんしゅうように「BBS」をせっちしました。
BBSとはインターネットの「けいじばん」のことです。

きょうのお題（おだい）は…。

ここをクリック！

タイピング練習

ロジックプログラム

Piskelをつかいます

  1. Piskelでロジックを組んでキャラクターを作りましょう。
  2. 手足のあるキャラクターを作りましょう。
  3. アニメーションで歩くキャラにしましょう。

Atomでまちをつくります

手足があって歩いたり走ったりするキャラクターが10個あると、ゲームが作れます。

※密ですゲームに出てくる小池さんの歩き方をマネしましょう。
※もっと細かいドットが描けるよ！という人はミニドット絵に挑戦を！

お手本けんさく

VRプログラム

HubsMozillaは終了しました

Hubsは5月末で終了してしまいました…残念😢
アヒル噴水のモール（知らない人がいるかも）
みずうみの上のかいぎしつ
バスケットゴールのある家
あいちゃんギャラリー
テスト部屋（知らない人が部屋にいるかも）

ここは入れます↓
参考
https://www.sandbox.game/ja/
https://xrworld.cloud.vket.com/
https://hello.vrchat.com/
https://axieinfinity.com/

YouTubeで見る

🐸FlexBoxプログラム🐸

FLEXBOX FROGGYをつかいます

レベル01：カエルを葉っぱの上に乗せます。
レベル02：緑のカエルは緑の葉っぱに、黄色のカエルは黄色の葉っぱに乗せます。
レベル03：緑カエル→緑の葉、黄カエル→黄色の葉、赤カエル→赤の葉に乗せます。
レベル04：緑カエル→緑の葉、黄カエル→黄色の葉、赤カエル→赤の葉に乗せます。
レベル05：緑カエル→緑の葉、黄カエル→黄色の葉、赤カエル→赤の葉に乗せます。
:
:

ここでチャレンジ！

脱出ゲームをつくろう

HTMLとCSSをつかいます

サンプル
ミニ脱出
サイン

1️⃣部屋を作る
2️⃣クリックできる場所（家具など）を作る
3️⃣ヒントをくれるキャラを置く
4️⃣鍵を隠す
5️⃣ゴール（出口）を作る
で完成できます。

いきなりゲームをつくるとしっぱいします。
まずは、シナリオをつくりましょう！

脱出ゲームを作る人は
ファイルをもらってくださいね！

脱出ゲームのシナリオをつくる

Mindomoでシナリオを書く

  1. メールアドレスとパスワードで登録
  2. 学生用サービスをつかう
  3. 「作成」→「組織図」→「作成」
  4. スタートをせってい
  5. メインの部屋・左の部屋・右の部屋などをせってい
  6. 家具などをおく
  7. しかけをおく

ここで登録

スクラッチ Scratch

スクラッチでまずは
犬🐕をあるかせてみよう！


スクラッチをはじめるには、アカウント（メールアドレス）がひつようです。
メールアドレスは、先生につくってもらいましょう。

WARPのみんなのページを見にいこう！

インベーダーゲームをつくろう

HTMLとCSSをつかいます

1️⃣Atomを開く
2️⃣「2023si.html」と「2023si.css」ファイルを作る
3️⃣HTMLをコピー＆ペースト
4️⃣CSSをコピー＆ペースト
5️⃣HTMLでタイトルとリンクを書き換える

ここからコピーします！

トップにもどる

2024 © タグチ!ワークス