Outschool
検索

$30

per session
クラス
再生

クリエイティブ コーディング 1 対 1 [デジタル アート + ゲーム + JavaScript アニメーション]

8 人が学習を完了しました
年齢 9 歳-15 歳
ライブ1対1レッスン
変化する美しいアート、プレイヤーごとに異なるインタラクティブなストーリー、上達するにつれて難しくなるゲームを作りましょう。これらのレッスンでは JavaScript の基礎をカバーし、学習者ごとに個別に設計されています。初心者歓迎!
平均評価:
5.0
レビュー数:
(48 レビュー)

オンラインライブ授業
オンデマンドでクラスを開催
55 分

含まれるもの

オンデマンドで会う
必要に応じて会議をスケジュールする
55 分
セッションごと
教師のサポート
習熟度評価
Assessment is done informally during class. Written feedback is provided after class each week via a learner note.
テスト
Assessment is done informally during class. Written feedback is provided after class each week via a learner note.
この文章は自動翻訳されています

このクラスで学べること

英語レベル - A2
米国の学年 5 - 8
=====================
SCHEDULE
=====================
This ongoing class for individual learners meets once per week for 55 minutes. You may begin, pause, resume, and end the weekly meetings at any time.

=====================
WHAT WE'LL CREATE
=====================
In this ongoing 1-on-1 class, individual learners create wondrous "generative" games and art – animations that change themselves each time they're viewed. Learners can create many different projects depending on their interests. For example, some learners create scenes from nature – fading sunsets, raindrops dripping down windows, or brush strokes curving across canvas. Other learners make quizzes or storybooks with images and pages that turn. Still other learners invent and code their own games.

=====================
APPROACH
=====================
Learners have many different ways of planning, thinking, and processing their work, and this class respects all of them. Some learners are comfortable expressing their thoughts in words while others communicate through their work. Some learners like step-by-step instruction while others prefer challenges they can investigate on their own. Some learners move rapidly among many different ideas, creating cross-connections; some investigate a particular idea in impressive detail. Some learners prefer a systematic approach to a topic, building a ladder of related skills; others prefer to dip into learning anywhere they're interested. Some learn best visually, using diagrams, charts, and graphic organizers; others focus best when guided by spoken questions or instructions; some get up and walk around to think. And so on through infinite variations among learner styles. 

I welcome all the gifts each learner brings. I adapt lessons for each learner's style and respectfully listen for information in all their communications (whatever form they take). I aim to work with learners in ways that make them comfortable while still providing challenges and opportunities for new ways of thinking. 

Whatever their styles, all learners in this class work in a collaborative coding environment where we can write commands together. I model how the commands should look, and learners can practice them.  I can see and respond to their coding ideas immediately. We learn with plenty of time reserved for both exploration and practice. As learners become comfortable , they'll begin to work independently on their own projects.

=====================
CURRICULUM
=====================
The curriculum is adapted for each learner. However, all curricula share the following features.

EVERY LESSON CREATES A PROJECT
I collaborate with learners to choose projects that they find fun and interesting, and I try to make sure that each project has a little magic in it – something surprising that learners can investigate and that broadens their understanding. Please note that a lesson can include one or more class periods. 

OPPORTUNITIES FOR INVENTION AND INDEPENDENCE
While it's fun and confidence-building to complete projects, the ultimate goal of these lessons is to nurture self-reliant and independent code artists – learners who not only create projects but also imagine their own project ideas and create them independently. To foster this journey from lessons to self-reliance, I include opportunities for play, exploration, and invention in every step of learning. 

Most importantly, learning is carefully structured to provide challenges with low thresholds (all learners can reach them successfully) and high ceilings (plenty of room to explore one's own ideas) throughout the class.

SMALL STEPS IN A SPIRAL
Our learning proceeds in small steps. We begin with easy commands in projects that are mostly complete. Learners tinker with these projects, making small changes and investigating what happens. We particularly explore the syntax of p5.js JavaScript commands slowly and playfully. (Syntax means the patterns of letters, numbers, and punctuation in the commands.) As learners gain confidence, they proceed to write commands from scratch and eventually to create more and more of each project by themselves. At this point, I present challenges like "What commands would we need, and in what order, to make this shape move across the screen by itself ?" Or "to change its color randomly?" Or "to make it slowly disappear and reappear?" Or "to make it get smaller and smaller as it moves down the screen?" Ultimately, learners can envision whole projects and the code to create them.

Learning also proceeds in a spiral fashion. That means each lesson revisits the skills of previous lessons and builds on them thoughtfully. We proceed at a learner's pace, sticking with each skill and moving on when it's comfortable. 

JAVASCRIPT COMMAND SEQUENCE
Generally, we learn p5.js JavaScript commands in the following order. Additional commands can be added, and some can be omitted, according to learners' interests. We learn how to:
- draw simple shapes and colors
- undo and "debug" (strategies for fixing problems in the code)
- use p5.js JavaScript built-in commands to change shapes randomly
- understand the coordinate grid
- use built-in variables to move shapes with the on-screen pointer
- use variables you create to make shapes move gradually (not randomly) across the screen, change color, shrink and grow
- use the "if" command to make choices in code – for example, make a moving shape jump to the top if it has reached the bottom
- capture screen clicks and use them to keep score, turn book pages, and manage other sequential tasks
- spin the drawing area by using the rotate() command
- use variables to spin shapes at different speeds
- add and subtract variables and use these operations to make shapes oscillate – move back and forth, get larger and then smaller, or bounce off edges of the screen – or to move with acceleration (like a ball falling down the screen)
- add images and music
- use commands that repeat actions ("loops") like for() and while()

ART SEQUENCE
We consider some or all of the following design principles, which often inspire learners to try new strategies in their projects.
- randomness: make repeated but unpredictable changes to color, size, or position of shapes
- interactivity: allow players to change the screen by clicking or dragging the pointer or by pressing keys
- oscillation: make shapes that change and then change back – for example, circles that grow and shrink
- reflection: create two or more shapes that move or change in opposite but symmetrical ways
- repetition: draw shapes that repeat in pleasing ways – for example, tiling patterns
- displacement: alter the position or dimensions of repeated shapes over time

=====================
NO PREREQUISITES
=====================
This class is intended both for learners with no experience in text-based coding (writing commands instead of dragging blocks) and also for learners who've written short scripts in Roblox or Minecraft or who have completed tutorials and video lessons online. 

=====================
ACCOUNTABILITY
=====================
After each lesson, I post a summary of the learning activities in Outschool classroom.

=====================
GETTING READY
=====================
(1) Learners should join our coding group at Open Processing, where they'll write code and see their animations. See additional information in "Parental Guidance," below.
(2) Learners should log into Open Processing *before each class* so they're ready to work when class begins. 
(3) Learners should know how to cut and paste and how to move among different tabs in their web browsers.

Thanks! Please let me know if you need help with these requests. I am always happy to help!

学習到達目標

Students learn JavaScript commands that display shapes, colors and text and respond to key- and mouse-presses. Learners also use coordinates to position shapes and create variables to keep score, make timers and vary the size, position or color of shapes.

その他の情報

保護者へのお知らせ
Learners will create a login and join a coding group at Open Processing, where their class will write code and see the animations. Student logins at Open Processing include many safety features. For example, no personal information is collected, student profiles and projects are visible only to the teacher and classmates, and learners are not allowed to comment or annotate projects outside their class. For a full description of these protections, see "Restricted Student Accounts" at 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
48レビュー
プロフィール
教師の専門知識と資格
15 years of experience teaching JavaScript, Python, Scratch, web development, robotics, and artbotics to learners 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. And, most of all, great love, patience, and respect for the many different ways that people learn and the different gifts they each bring to the classroom!

レビュー



その他の人気クラス
9~14 歳向け 1:1 Javascript/P5.Js
Coco Coders
4.8
(974)
$60 セッションごと
1対1レッスン
オンデマンド
9 歳-14 歳
JavaScript / p5.Js コンピュータサイエンスコーディングクラブ: ゲーム、アニメーションなど
Coco Coders
4.8
(974)
$20 クラスごと
次のセッションは今日 11 PM です
グループクラス
1/週、 55 分
9 歳-13 歳
プロジェクトベースの JavaScript コーディング (レベル 1)
AI Code Academy
4.7
(1,781)
$21 クラスごと
次回のセッションは Friday の11:30 PM です
グループクラス
10 週間、 1/週、 1 時間
9 歳-14 歳
サマーキャンプ: 子供向け Javascript コーディング (入門)
Dr. Elliott Heflin, Jr.
4.6
(405)
$19 クラスごと
次回のセッションは Mon 4/28 の10 PM です
グループクラス
5 週間、 2/週、 55 分
8 歳-13 歳
キッズコーディングクエスト: JavaScript ゲーム版
MS. JEN of ARTISTIC KIDS WORKSHOP
4.7
(6)
$12 クラスごと
次回のセッションは Mon 6/2 の5 PM です
グループクラス
4 週間、 2/週、 55 分
9 歳-14 歳
P5.jsを使ったクリエイティブコーディング - JavaScriptを使った6~8年生向けゲームデザイン
Create N Learn: Game-Based Learning & Future Skill
5.0
(21)
$15 クラスごと
次回のセッションは Thursday の1 PM です
グループクラス
8 週間、 1/週、 55 分
12 歳-14 歳
初心者向け Javascript コーディング レベル 1 - プロジェクトベースの学習
Einsteins Square: Chess, Coding, Math, Art, Games
4.8
(5,828)
$20 クラスごと
次回のセッションは Thursday の6 PM です
グループクラス
12 週間、 1/週、 50 分
10 歳-15 歳
Javascript の学期: 基礎から大きなアイデアまで!
Coco Coders
4.8
(974)
$18 クラスごと
次回のセッションは Mon 6/2 の2 PM です
グループクラス
10 週間、 1/週、 55 分
10 歳-15 歳
クリエイティブ コーディング 1 対 1 [デジタル アート + ゲーム + JavaScript アニメーション]
Terry D [Code & Art, JavaScript, M.Ed]
5.0
(48)
$30 セッションごと
1対1レッスン
オンデマンド
9 歳-15 歳
8 ~ 10 歳: JavaScript を使用したモバイル アプリの作成 - レベル 1
Jamesetta James
4.7
(178)
$15 クラスごと
次回のセッションは Mon 5/12 の1 PM です
グループクラス
1 週間、 1/週、 1.50 時間
8 歳-10 歳
サマーキャンプ: 子供向けプロジェクトベースの Javascript (レベル 2)
AI Code Academy
4.7
(1,781)
$23 クラスごと
次回のセッションは Mon 6/16 の3 PM です
グループクラス
2 週間、 5/週、 1 時間
10 歳-15 歳
プロジェクトベースの JavaScript コーディング (レベル 2)
AI Code Academy
4.7
(1,781)
$22 クラスごと
次回のセッションは Friday の11:30 PM です
グループクラス
10 週間、 1/週、 1 時間
10 歳-13 歳
サマーキャンプ: 子供向けプロジェクトベースの Javascript (レベル 1)
AI Code Academy
4.7
(1,781)
$22 クラスごと
次回のセッションは Mon 6/16 の3 PM です
グループクラス
2 週間、 5/週、 1 時間
9 歳-13 歳
初心者向け Web 開発の基礎: HTML、CSS、JavaScript
Curtis Butler
$20 クラスごと
次回のセッションは Monday の7 PM です
グループクラス
7/週、 1 時間
14 歳-18 歳
初心者向け Web 開発の基礎: HTML、CSS、JavaScript (入門)
Curtis Butler
$20 クラスごと
次回のセッションは Saturday の2 PM です
グループクラス
1 週間、 1/週、 1 時間
14 歳-18 歳
子どものためのプロジェクトベースのウェブ開発(1年間):HTML、CSS、Javascriptを学ぶ
Faruk Hasan
4.8
(148)
$12 クラスごと
次回のセッションは Tue 7/1 の11 PM です
グループクラス
1/週、 35 分
10 歳-15 歳
もっとクラスを見る
アプリを入手 
App StoreでダウンロードGoogle Playで入手する
Home
検索
ギフトカードを贈る
通貨、タイムゾーン、言語の設定を開く
言語と地域
ログイン