😺

[CS50x学習メモ] Week 0: Scratch

2023/01/26に公開

programming

いよいよ初回。CS50xのオリエンテーションからスタート。
意訳というか、個人的な理解に基づいて書いているので、間違っていたりするところもあるかもです。
1つの講義動画が2時間超えなので、ボリュームがすごくあって、途中の休憩のタイミングで一度区切りながら視聴し、次にLab課題。動画を見直したりreferenceやWalkthroughを見つつProblem Setの課題をしています
毎回講義の動画を観て思うが面白くて、分かりやすい。
個人的に先生の"voilà"(Ta-dah‼)が好きなんだけど、調べてみたらフランス語の様子…だが、脱線になりそうなのでスキップ。

Over View

どのようなことに取り組んでいくのかを説明しながらプログラミングとは、Computer Sienceとは？
Sctratch、C言語から始めてPythonへと移行していくよ
最終課題は一人ではなくクラスメイトと協力してもいいし、コミュニケーションを取るならPuzzle day とかもあるよ。とのこと、確かCOVID-19の状況が悪かったときはMovie nightみたいなのがあった模様。間に合いたかった。Final Projectの12時間に集まれるのは課題提出前とか文化祭前泊まり込み感があって楽しそうでうらやましい。

Computer Sience

Computer Sience ＝プログラミング？と思う人が多いと思うが、CSそれ自体は情報の研究であり、それをどのように表現し、実際にどのように処理するかである
Computational thinking(論理的思考)問題を解決する方法なので、プログラミングしてアプリケーションを開発するだけではなく、いろんな問題解決に適用することができる

では、問題解決とは何か？と、モデル化した例も挙げ(input → □ → output)
inputがあり、「何かしら」があって、outputを得られる。この、「□の部分(何かしら)」な部分についてどう問題を解決するか考えていこう(とても意訳)

binary digits(二進数)

スマホやゲーム機、いろんなところで目にするコンピューターは、ちゃんと言語を表示してくれたり、いろんな動作や操作を受け付けて様々な機能があるが、Computerは0,1の二進数しかわからない
(今この記事が表示されているのも、根本なところまで遡ったら最終的には0か1で動いている)
単純なON/OFFの切り替えスイッチがたくさん並んでいて、一つのスイッチはOFF=0, On=1として動いている。それらで膨大な処理をおこなっているよ、との説明。

まず3つの電球を使うと0～3まで数えることができる。
※数字と同じく、右から位が上がっていくので、下記の電球も右から操作を行っている

電球A	電球B	電球C	数
OFF	OFF	OFF	０
OFF	OFF	ON	１
OFF	ON	ON	２
ON	ON	ON	３

次に、Computerと同じく、二進数で考えると0から7までより多く数えることができる
※2023ではボランティアを壇上に上げて番号のライトで説明

電球A(4)	電球B(2)	電球C(1)	数
OFF	OFF	OFF	０	全部OFFなので無。ゼロ
OFF	OFF	ON	１	電球C(1)がONなので1
OFF	ON	OFF	２	電球B(2)がONなので2
OFF	ON	ON	３	電球B,C(2+1)がONなので3
ON	OFF	OFF	４	電球A(4)がONなので4
ON	OFF	ON	５	電球A,C(4+1)がONなので5
ON	ON	OFF	６	電球A,B(4+2)がONなので6
ON	ON	ON	７	電球A,B,C(4+2+1)がONなので7

※二進数についてはこのあたりまでで割愛するが、右手の5本指を使って10進数の31まで数える方法(親指を1として、順に2,4,8,16)とかもあるので、分かりやすいものを探すのがオススメ。
開始したのは2022の9月なので、昨年版の講義では、ステージの電球に何か意味があるのか…という質問があったけれど今年版のはどうなんだろうか。見返していないので不明。

Scratchの使い方とプログラミングのdesignについて

広い講堂に、Meowが鳴り響くシュールさはありつつも、Scratchの使い方の説明。

Scratchの詳しい使い方は観たほうが早いので割愛。
プログラミングしていくときは、一歩一歩、Stepを重ねていくことが大事。
そして望む挙動を達成することができたとしてもdesignがよくないことは多々ある。として電話帳を例として破り捨てながら、問題解決方法として適切かを説明するDavid先生。

最後は、過去の生徒の作品を使って大まかな課題の説明。作品のゲームも面白かったし、どんな中身なのか考えながら見ていたけれど、いろんな大学ロゴが追いかけまわして、だんだん無理ゲーになっていくの良い。あと、先生の説明や体験、壇上へのボランティアしている人へのリアクションが優しくていい環境だな～としみじみ。

感想と提出物

Scratchは、大きさや色ではなく、ブロックの形が同じであれば意外なところにも使えるので、and, or, notなど入れ子だらけになってしまい、作りながらもうこれ、大丈夫なのかな？無理やりなのでは？と思いながらもブロックをつめつめしました

作ったものはこちら。Jigsaw puzzle game!

久々にScratchを触って、楽しくて条件満たしてるのに作りこんでしまった感。
面倒だったのがピースの作成・位置合わせと長いブロックのコピペ。
もうめっちゃ雑にトリミングをしてしまった。大きさ違うし。凸凹がなく端っこが分かりにくいので枠線つけてみたり…後から直していったので余計に大変だったのかも。
Spriteにブロックをドラッグすると複製してくれるのはとても助かったが、それでも結構面倒だった…(3つもLevelを作らなければいい話)

エイリアンかわいい。エイリアン。
ステージ切り替えのとき、ワープっぽい音をつけたり、マウスオーバーの時だけコメント出したりと、かわいくて気に入ってしまった。

試行錯誤する中で、ピースの挙動が落ち着いたと思ったら、ステージを開始したときすべてのピースが同じ絵になってしまったり…延々と音が鳴り続けるとか、真夜中に何してるんだろうなとたまに我に返りつつ、なんとか提出にこぎつけました。でも楽しかった。

詰まったところ

目指した挙動：パズルのピースが正しい位置に来て、ピースを離した時に「音を鳴らし」「表示濃度を変え」「ピースを固定(クリックできなくする)」なのだが
一つのSpriteでそれを行おうとすると正しい位置に到達した時点から音が鳴りやまなかったり…開始時にピースが消えてしまったり…となかなか狙ったようにできず
最終的には、ピースをドラッグし「放す」だけではなく、「正しい位置に置いたら、クリックして嵌め込む」みたいな操作が必要になっていて、まだここが少し心残りではある。

※Scratchの課題は完成したファイル(.sb3)を提出するので注意
　Week 1からはVSCode上からSubmitする形になる

WEEK 0の学習メモはいったんここまで。
他の週で同じくらいのボリュームのなるのかは未定。