Siv3Dでのプログラミング教育

# これは何

私はプログラミング教室で主に中高生にプログラミングを教えています。教える内容はUnityを用いたゲーム制作やPythonが基本となっています。

この記事はそんなプログラミング教室でSiv3Dを2年半教えていて感じたSiv3Dでのプログラミング教育の利点を書いたものです。

# 利点1:コードのみで完結する

## 余分な要素がない

プログラミングを学ぶ一番多いモチベーションはゲーム制作だと思います。ゲーム制作を教えるための選択肢として最も用いられているのはUnityでしょう。

UnityとSiv3Dで最も異なるのはコードのみでゲームを作れるかどうかだと思います。多くの初心者がUnityを始める場合に最初に行うのは**Unityの画面と操作になれること**になります。そしてUnityの操作に慣れた後、あるいは 並行してC#を学ぶことになります。


**Unityの初期画面** 
![スクリーンショット 2024-12-18 004922.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/946196/b641cb24-0056-2746-d911-4e0fa945bf4e.png)

一方Siv3DではVisualStudioを起動するだけであとはコードを書いて学ぶ流れになります。

UnityのGUI操作とコーディングを一緒に教えるのは、大半の生徒に取っては十分にハードでしょう。

## デバッグのしやすさ

バグの原因がわかりやすいのもコードのみの利点です。Unityでのバグや意図しない挙動は初心者はコードが間違っていたのか、GUIでの設定でミスをしたのか判断することが難しいことが多々あります。その点Siv3Dはコードの修正に集中することができます。



このようにSiv3Dは余計なことを教えずに**コードを教えるのに専念**することができます。これはパソコンにあまり慣れてないような生徒に教える場合は特に有効です。

# 利点2:UIの見た目がリッチ

簡単に書けるGUIライブラリとしてのSiv3Dの比較対象はtkinter(Python)やSwing(Java)になるかと思います。これらのツールはコードが簡単にかける反面、端的に言って非常に古めかしいデザインとなっています。

一方でSiv3DのGUIライブラリはモダンなデザインでかつ非常に簡単に記述することができます。プログラミング学習において成果物の見た目は非常にモチベーションに寄与するので、Siv3Dを使うことでより生徒の達成感やモチベーションは上がることでしょう。

**tkinterのサンプル**
![スクリーンショット 2024-12-18 181656.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/946196/ccd32c18-a997-c7fd-d865-ac04eebbce6c.png)
**Swingのサンプル([Wikipedia](https://ja.wikipedia.org/wiki/Swing)より引用)**
![Gui-widgets.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/946196/d7e3617f-290c-5aee-91fd-6b5052bce182.png)

**Siv3Dのサンプル([公式ドキュメント](https://siv3d.github.io/ja-jp/tutorial2/gui/#283-gui-%E3%81%AB%E3%81%8A%E3%81%91%E3%82%8B%E3%82%A2%E3%82%A4%E3%82%B3%E3%83%B3%E3%81%AE%E4%BD%BF%E7%94%A8)より引用)**
![3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/946196/e69d5b8f-7200-4934-4fae-2a55596945d8.png)



# 利点3:絵文字が便利

自分でゲームを作る際に画像素材を集めるのは一つのハードルとなります。更に統一感のある素材が大量に必要な際は自分で描いて用意する必要があるかもしれません。

しかし、Siv3Dはこの問題を非常に簡単に解決してくれます。Siv3Dでは絵文字を画像に変換して扱うことができます。これによって統一テーマでかつ数多もの画像素材を簡単にゲーム内の素材として扱うことが可能となります。

**絵文字を用いたゲームの例([公式ドキュメントより引用](https://siv3d.github.io/ja-jp/samples/games/#6-%E7%B5%B5%E6%96%87%E5%AD%97%E3%82%BF%E3%83%AF%E3%83%BC))**
![6.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/946196/1cf7eb54-2da1-95e2-512e-f9edccb623fc.png)


更にゲームだけでなく、UIでのアイコンとしても絵文字は非常に使い勝手が良いです。

**絵文字を用いたUIアイコンの例([公式ドキュメントより引用](https://siv3d.github.io/ja-jp/samples/ui/#11-%E3%82%B2%E3%83%BC%E3%83%A0%E3%81%AB%E4%BE%BF%E5%88%A9%E3%81%AA%E3%82%A2%E3%82%A4%E3%82%B3%E3%83%B3%E9%9B%86))**
![11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/946196/806cad63-8e05-55e3-ccba-a4e6b68eb270.png)


このように画像素材やデザイン部分の手間を一気に省ける絵文字を用いることで、ゲームやアプリケーションを完成まで持っていくハードルはぐっと下がります。

# 利点4:公式のドキュメントが神

プログラミング教育において「コードが書けるようになること」と同じ程大事なのは「**自分で調べられるようになること**」でしょう。機能の詳細を調べることや使っているクラスの関数を調べることが自分でできるようになることは今後プログラミングをしていく際に非常に重要になっていきます。

しかし、生徒がいきなりPythonのライブラリの機能を調べて自分の探したい情報にたどり着くのは非常にハードルが高くなっています。Webで検索して出てくるのは英語で書かれた公式ドキュメントやいつの情報かわからないブログ記事といったものばかりです。

一方でSiv3Dは公式のドキュメントに**すべての情報が日本語で読みやすくまとまっています**。これだけで自分の欲しい情報を調べるのはずっと簡単になります。更に、様々なサンプルやコースが載っていてそれらを眺めるだけでも知らない機能を学べたり、新しく作るアイデアが浮かんだりと読み物としても価値が高くなっています。

Siv3Dのドキュメントを通じてドキュメントの読み方や欲しい情報を調べ方を学ぶのはとても効果的で意味のある学びとなります。

# 利点5:Web版を用いた公開

自分で作ったゲームやアプリケーションを公開する際にSiv3Dは非常に簡単な公開手段を提供しています。それはWeb版Siv3Dです。Web版Siv3Dは**Siv3Dとほぼ同じコードでWebブラウザで実行できるようになります**。Web版によって生成されたファイルをGithub PagesなどのWebサーバーにアップロードすることで、ダウンロード不要かつスマホでもアクセス可能な状態でアプリケーションを公開することができます。

生徒が自分で作った成果物を手軽に公開できて、友人や家族に触ってもらえるのは非常に良い刺激となるでしょう。

**生徒と作った路線図メーカーのWeb公開版**

https://mukade-daiou.github.io/RouteMapMaker/

# 利点6:豊富な機能

Siv3DはGUIツールとして以上に様々な機能が内包されています。

- HTTPクライアント
- TCP通信
- 物理演算
- 3D描画
- マイク・Webカメラ
- etc…

上で挙げた以外にも様々な機能があり、追加したい機能や作りたいものを高確率で実現することが可能です。

# まとめ

Siv3Dは簡単なC++で様々なことを実現できます。手軽にゲームやアプリケーションを完成させて公開することができます。そして、公式のユーザーサポートも手厚く学習者に非常に優しい環境となっています。是非Siv3Dでのプログラミング教育が広がっていくことを願っています。