Outschool
通貨、タイムゾーン、言語の設定を開く
ログイン

アートとコードの冒険 - 飛び込んでみよう! P5js Javascript でプログラミングを学ぶ

このクラスに興味がある場合は、代わりに「JavaScript を発見! ゲームとアート」をご覧ください。このクラスは段階的に廃止されます。ありがとうございます!
Terry D [Code & Art, JavaScript, M.Ed]
平均評価:
5.0
レビュー数:
(44)
クラス
再生

含まれるもの

4 ライブミーティング
3 時間 40 分 授業時間
宿題:
週1時間. Students are encouraged to spend about 1 hour per week working on projects so that they have time to become comfortable with skills and time to explore new ideas they'd like to code.
この文章は自動翻訳されています

このクラスで学べること

=====================
WHAT WE'LL CREATE
=====================
In this class, learners embark on a 4-week investigation into the beauty and fun of making computer-generated art – the lovely patterns and shapes that computers create when we give them imaginative commands. Like many coding classes this one welcomes learners who love games, but it also welcomes learners who love design, color, and animation. No previous experience with coding is necessary!

LESSON 1. SHAPES THAT MOVE WITH THE POINTER
- What is programming? What is code? What is JavaScript? What is p5.js?
- How to open and save a starter project
- How add or change commands in the starter project
- How to undo errors
- Commands that create essential shapes
- How to use numbers to change the color of shapes
- How to use the built-in variables mouseX and mouseY to make shapes follow the on-screen pointer

LESSON 2. SHAPES THAT GRADUALLY MOVE, CHANGE COLOR, AND SHRINK OR GROW
- How to create your own variables
- How to use your variables to make shapes gradually (not randomly)...
- - - move up and down
- - - change color 
- - - change size
- How to use the "if" command to make choices in code – for example, make a moving shape jump up to the top if it has reached the bottom of the drawing area
- Make a project of your own that uses variables to change motion, size, or color

LESSON 3: SHAPES THAT SPIN
- How to move shapes across the drawing area by using the translate() command
- How to spin the drawing area by using the rotate() command
- How to use variables to spin shapes at different speeds
- Designs all around us that are made by spinning (like mandalas or spirals)
- Make a project of your own by spinning 

LESSON 4: SHAPES THAT BOUNCE
- How to make shapes move back and forth, get larger and then smaller, or bounce off edges of the screen
- How to add and subtract variables
- Make a project of your own with bounces

APPROACH
Learners begin by tinkering with teacher-provided code. In a guided exploration, they make changes to the code and notice what happens. Then they collaborate with classmates, comparing results and figuring out together how the code works. New concepts and commands are added in small steps, with plenty of concrete examples and time for invention. Gradually, students write commands independently. 

Class sizes are small so that I can work with individual students, finding each student's strengths and proposing questions or challenges that build on them. In addition, I provide supplementary written or video materials for students who move a little faster than the class.

This class is intended both for students with no experience in text-based coding (writing commands instead of dragging blocks) and also for students who've written short scripts in Roblox or Minecraft or who have completed tutorials and video lessons online. However, for more advanced students who already write code independently in p5.js, JavaScript, or another language, please contact me to arrange a more appropriate learning experience.
学習到達目標
* What's a variable? 
* Using built-in variables mouseX and mouseY
* Creating your own variables 
* Using variables to change color, position, size, and speed of shapes
* Using variables to rotate (spin) the canvas (screen)
* Translating (sliding) shapes around the canvas
学習目標

その他の情報

保護者へのお知らせ
During the class, students will create accounts at https://openprocessing.org/, where they will write code and see their animations. Student accounts include many safety features. No personal information is collected. Additionally, student profiles and projects are visible only to the teacher and classmates, and students are not allowed to comment or annotate projects outside their class. For a full description of these protections, see https://intercom.help/openprocessing/en/articles/5228489-student-account-types. This free code editor, funded by the Processing Foundation, works on Windows, Mac, Linux, and Chromebook computers but isn't appropriate for iPads or phones.
外部リソース
このクラスでは、Outschool内のクラスルームに加えて、以下を使用します。
参加しました August, 2022
5.0
44レビュー
プロフィール
教師の専門知識と資格
15 years of experience teaching JavaScript, Python, Scratch, web development, robotics, and artbotics to students from 8 - 15 years old in private, public, and after-school settings. Two masters degrees in education – from Harvard Graduate School of Education with a focus on technology and from Lesley University in mathematics education.

レビュー

ライブグループクラス
共有

$18

毎週または$72 4 クラス分
週に1回、 4 週間
55 分

3 人がクラスを受けました
オンラインライブ授業
年齢: 11-15
クラス人数: 2 人-6 人

About
サポート
安全性についてプライバシーCAでのプライバシー保護学習者のプライバシーデータ設定の管理利用規約
アプリを入手
App StoreでダウンロードGoogle Playで入手する
© 2024 Outschool