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.

評論

現場團體小班課程
分享

US$18

每週或US$72 用於 4 課程
每週1次,共 4 週
55 分鐘

有3 位學習者完成此課程
即時視訊會議
年齡: 11-15
2-6 每班學員人數

關於
支援
安全隱私加州隱私學習者隱私管理資料首選條款
下載這個軟體
在應用程式商店下載在 Google Play 上取得
© 2024 校外