Scratch on AtCoder 入門編

はじめに

こんにちは、キラメックスにてテックアカデミージュニアという子ども向けプログラミング学習サービスの開発をしています、蟹です。🦀

テックアカデミージュニアは子ども向けのプログラミング学習サービスで、中でも「Scratch」と言うプログラミング言語の学習が主軸となっております。

junior.techacademy.jp

また、個人的な趣味として「AtCoder」で勉強させていただいており、今回「ScratchでAtCoderをやってみよう!」と思い立った次第でございます。

サービス理解も深めながら趣味のプログラミングができる、最高のやつですね!! それでは、それぞれScratchとAtCoderの簡単な紹介の後、実装をしていきたいと思います! (今回はAtCoderでAC通すと言うことではなく、実装してScratch上で挙動を眺めて楽しむことをゴールとしています!)

Scratchについて

ScratchMITメディアラボによって開発されたプログラミング言語で、プログラミングによってモノを作ること(使いやすさ、速さ、メンテしやすさ等)ではなくプログラミング学習自体を目的としており、その一番の特徴はコーディングの仕方にあります。

テキスト(英語)を書くのでなく、「ブロック」と呼ばれるものをドラッグ&ドロップすることでコーディングします。

scratch.mit.edu

見ていただくのが最も手っ取り早いと思います。 例えば1から10までの足し算は、こんな感じでコーディングできます。

f:id:kani-krmx:20210708043119p:plain

この1つ1つの四角い枠がブロックと呼ばれているもので、ブロックを組み合わせることでプログラムを組んでいきます。 ブロックはいくつか(たくさん)用意されていて、他のプログラミング言語にあるほとんどの構文はカバーされています。

実行(緑の旗をクリック)すると、以下のように猫さん(ScratchCat)が実行結果を教えてくれます。

f:id:kani-krmx:20210708100933p:plain

雰囲気だけでも伝わったかと思いますので、詳細は後半で問題を解きながら見ていくこととして、次にAtCoderの説明に入りたいと思います。

AtCoderについて

AtCoder競技プログラミングを気軽に(もガチにも)触れ合えるWebサイトです。

筆者もプログラミングやアルゴリズムや新しい言語に親しむ勉強のため、また単純に楽しい趣味としてAtCoderを利用させていただいております!お世話になってます。

atcoder.jp

知らない方のために競技プログラミングを簡単に説明しますと、アルゴリズムに関する問題をプログラミングで解く競技です。

例えばAtCoderでは、以下のような問題が出題されます。

二つの正整数 a, b が与えられます。 a と b の積が偶数か奇数か判定してください。

こういった問題を、正しく解いていき(用意されたテストケースをパスする)その提出までのタイムを競う。というのが競技プログラミングないしはAtCoderの概要となります。

これは個人的な感想ですが、パズル的な要素が大きく、(パズル的なものが好きであれば)プログラミング自体は始めたばかりでも楽しめるコンテンツだと思います!

やってみた

それでは、やっていきましょう!

AtCoderには問題が無数にあるのですが、今回はその中でもけんちょんさん( @drken / @drken1215 )の記事で抜粋された問題を取り扱っていきたいと思います。

qiita.com

筆者の知力と体力と時間の問題で、今回は前半5問を取り上げたいと思います! それぞれ、問題文・Scratchプロジェクト・解説の順で書いていきます。

こちら(リンク) が今回の作品をまとめたScratchスタジオ(Scratchプロジェクトの集合)になります。 [任意の色]コーダー・Scratcherの皆様、是非アドバイス含むご意見ご感想ご指摘をお待ちしております。

問題1

問題 : A - Product

まずは問題です。

【問題文】

シカのAtCoDeerくんは二つの正整数 a,b を見つけました。 a と b の積が偶数か奇数か判定してください。

【制約】

1 ≤ a,b ≤ 10000

a,b は整数

最初なのでいくつか注釈です。 問題にはABCDEFの難易度があり、Aが簡単でFが難しくなります。上記はA問題で、本稿ではA/B問題を扱います。

問題文と、inputにまつわる制約が与えられます。 文章がユニークなところもポイントですね!

Scratchプロジェクト

それでは、次にScratchプロジェクトを見ていきましょう。 下記のリンクを押していただくとScratchの画面が開きます。

https://scratch.mit.edu/projects/491126793

このような画面が開くと思います。 緑色の旗を押すとコードが実行されます。

f:id:kani-krmx:20210709121622p:plain

プロジェクトページ右上の「中を見る」ボタンを押すと、プログラムを見ることができます。

f:id:kani-krmx:20210709121629p:plain

ここのプログラムはそのまま変更することができますので、是非文言やブロックをアレンジしてみてください! どれだけ触っても元のプログラム(プロジェクト)に反映されることはないので、安心して破壊していただけます。

さて、ブロックを見ていきましょう。

f:id:kani-krmx:20210708115544p:plain

コメント

ここでは、Scratchのプログラムの簡単な説明を行いたいと思います。

「〇〇と聞いて待つ」ブロックでinputを受け、「〇〇を××にする」ブロックで変数に格納し、「〇〇と言う」ブロックでoutputをしています。 処理は問題文通りのシンプルな処理にしています。

問題2

問題 : A - Placing Marbles

【問題文】

すぬけ君は 1,2,3 の番号がついた 3 つのマスからなるマス目を持っています。 各マスには 0 か 1 が書かれており、マス i には s_i が書かれています。

すぬけ君は 1 が書かれたマスにビー玉を置きます。 ビー玉が置かれるマスがいくつあるか求めてください。

【制約】

s1_,s_2,s_3 は 1 あるいは 0

Scratchプロジェクト

https://scratch.mit.edu/projects/491134133

f:id:kani-krmx:20210708175646p:plain

コメント

前半分くらいのブロックは変数の初期化です。 ちなみに、グリーンフラッグを連続で押すとき、変数の初期化をしていないと前回実行時の値を保持し続けるので注意が必要です。

for文やif文も、日本語で小学生の方でも分かりやすく表現されています。 今回は半角1と全角1をどちらもカウントするようにしてみました。(子ども向けのサービスでは、半角全角など区別ついていないユーザーさんも多いので…。)

問題3

問題 : B - Shift only

【問題文】

黒板に N 個の正の整数 A_1,...,A_N が書かれています.

すぬけ君は,黒板に書かれている整数がすべて偶数であるとき,次の操作を行うことができます.

黒板に書かれている整数すべてを,2 で割ったものに置き換える.

すぬけ君は最大で何回操作を行うことができるかを求めてください.

【制約】

1≤N≤200

1≤Ai≤109

Scratchプロジェクト

https://scratch.mit.edu/projects/491142180

f:id:kani-krmx:20210708181705p:plain

コメント

ここからB問題です。

初期化が多くなってしまったので切り出しました。 「定義」ブロックで関数を定義、呼び出しすることができます。 なお、引数は取れないので、(グローバルな)変数を使い回す格好になります。

今回はwhile文「〇〇まで繰り返す」の中に、for文とif/else文が入っている構造です。 whileの終了条件はもちろんですが、for文も勝手にインクリメントしたりしてくれないので「iを1ずつ変える」ブロックをちゃんと書いてあげます。

問題4

問題 : B - Coins

【問題文】

あなたは、500 円玉を A 枚、100 円玉を B 枚、50 円玉を C 枚持っています。 これらの硬貨の中から何枚かを選び、合計金額をちょうど X 円にする方法は何通りありますか。

同じ種類の硬貨どうしは区別できません。2 通りの硬貨の選び方は、ある種類の硬貨についてその硬貨を選ぶ枚数が異なるとき区別されます。

【制約】

0≤A,B,C≤50

A+B+C≥1

50≤X≤20,000

A,B,C は整数である

X は 50 の倍数である

Scratchプロジェクト

https://scratch.mit.edu/projects/491158682

f:id:kani-krmx:20210708180045p:plain

コメント

三重ループですね。 変数はやはりループの都度、0に直してインクリメントして…を書く必要があります。 コード自体は割と見やすい気がします。

問題5

問題 : B - Some Sums

【問題文】

1 以上 N 以下の整数のうち、10 進法での各桁の和が A 以上 B 以下であるものの総和を求めてください。

【制約】

1≤N≤104

1≤A≤B≤36

入力はすべて整数である

Scratchプロジェクト

https://scratch.mit.edu/projects/491178799

f:id:kani-krmx:20210708180105p:plain

コメント

整数の桁の扱いが問題の趣旨ですが、そのまま文字列と整数をシームレスに扱えるので、直感的にブロックを並べて動いてくれます。 この辺りは型など難しい概念より、プログラミングとの触れ合いを重視したScratchの思想が垣間見える気がします。

ただ、以上以下(≦ / ≧)が無いため、当コードでは A-1 を 未満など(< / >)で評価しています。

おわりに

いかがでしょうか? ScratchAtCoder競技プログラミング)の雰囲気・楽しさが伝わっていれば幸いです。 ただ、やはりどちらも自分で触れてみるのが一番だと思うので、上記の筆者の拙コードを触ってみてもらったり、 それぞれアカウントを作成して(無料です!)、自分でコーディングしてお試しください!

また、今回は触れませんでしたが、ScratchのコードをC++に変換してAtCoderに参加できるChrome拡張などもあるので、こちらもぜひ!!

chrome.google.com

最後にささやかな宣伝ですが、もしお子様Scratchにご興味ありましたら、弊社のScratchコースでもオンラインでの無料体験などができますので、ぜひお気軽にお申し込みください!!!!

junior.techacademy.jp