Slide 1

Slide 1 text

プログラミング研究と CoderDojo 鈴木 遼 (早稲田大学 / Siv3D) C++ ライブラリ「Siv3D」の開発と CoderDojo でのワークショップ事例

Slide 2

Slide 2 text

プログラミングを楽しく簡単にする活動 1/4 小中高生の開発者に、開発費・技術メンタリングを支援する U-17 未踏ジュニアのメンター (2016~) 画像引用: https://jr.mitou.org/projects/

Slide 3

Slide 3 text

プログラミングを楽しく簡単にする活動 2/4 C++ プログラミングを学べる本の出版、Web サイトの運営 『冒険で学ぶ はじめてのプログラミング』 技術評論社 cppmap.github.io CEDEC 2020 での講演

Slide 4

Slide 4 text

プログラミングを楽しく簡単にする活動 3/4 C++ / Siv3D / Viscuit を使ったワークショップ 子ども~社会人へのオンライン個人レッスン CoderDojo 宜野湾 & 浦添

Slide 5

Slide 5 text

プログラミングを楽しく簡単にする活動 4/4 新しいプログラミングツールの開発と研究 Siv3D Siv3D for Kids Enrect

Slide 6

Slide 6 text

中・高・大学生 Siv3D ユーザの活躍 1/4 ゲームやメディアアートを制作 英語・中国語版も リリース 海外 YouTuber の ゲーム実況も多数 画像引用: https://twitter.com/Shibaken_8128/status/1344967321454931969 https://twitter.com/r193333333/status/1377613363929247746 https://twitter.com/takara2314/status/1415649264085069829 https://www.freem.ne.jp/win/game/14167 https://www.freem.ne.jp/win/game/14961

Slide 7

Slide 7 text

中・高・大学生 Siv3D ユーザの活躍 2/4 十代のクリエータが Siv3D 作品でコンテスト入賞 PCN こどもプロコン 最優秀賞 日本ゲーム大賞 U-18 部門予選通過 学力向上アプリコンテスト デザイン部門賞 画像引用: https://pcn.club/contest/contest10.html https://youtu.be/J19GBAjeBH8 https://youtu.be/2eX_rN9E_hA

Slide 8

Slide 8 text

中・高・大学生 Siv3D ユーザの活躍 3/4 競技プログラミングで Siv3D を活用 高専プロコンでは 10 校以上が Siv3D を使うプログラムで大会出場 競プロコンテストサイト AtCoder の C++ コースでも紹介 写真引用: https://www.cresco.co.jp/news/2021/09/13/210913_corp.html

Slide 9

Slide 9 text

中・高・大学生 Siv3D ユーザの活躍 4/4 十代のオープンソース開発者を育成 豆知識: Siv3D の最年少コミッタは 現在 CoderDojo のメンター Siv3D 実装会の様子 (2019 年)

Slide 10

Slide 10 text

Siv3D って何? 1/2 C++ で楽しく簡単にゲームやアプリを作れるライブラリ # include void Main() { Scene::SetBackground(ColorF{ 0.8, 0.9, 1.0 }); const Texture food{ U"🍿"_emoji }; const Texture bird{ U"🐥"_emoji }; while (System::Update()) { Circle{ Scene::Center(), 100 }.draw(); food.drawAt(Scene::Center()); bird.drawAt(Cursor::Pos()); } }

Slide 11

Slide 11 text

Siv3D って何? 2/2 2016 年からオープンソースで公開、直近 1 年間で 1 万ダウンロード Windows, macOS, Linux, Web で動くアプリを無料で開発

Slide 12

Slide 12 text

世界でもっとも使われているプログラミング言語の 1 つ Windows (OS) Google Chrome (ブラウザ) Photoshop (写真編集ソフト) Arduino (マイクロコンピュータ) Word, Excel (文書作成) Unreal Engine (ゲームエンジン) Minecraft (ゲーム) Google, YouTube, Amazon 自動運転・ロボット制御システム 金融取引システム C++ って何? 1/2

Slide 13

Slide 13 text

• コンピュータの性能を最大限に引き出すソフトウェアの開発が得意 • C++ プログラマは世界で 450 万人以上 • 世界中のパソコンやスマートフォン、ゲーム機や家電、企業や工場、 大学、研究所で動くソフトウェアの開発に使われる • AtCoder や情報オリンピック、パソコン甲子園など 競技プログラミングの分野でも人気が高い C++ って何? 2/2

Slide 14

Slide 14 text

C++ のパワーを引き出す Siv3D 難易度が高い C++ を、短く & たくさんの機能を使えるよう強化 # include void Main() { Size brickSize{ 40, 20 }; double speed = 480.0; Vec2 ballVelocity{ 0, -speed }; Circle ball{ 400, 400, 8 }; Array bricks; for (auto p : step(Size{ (Scene::Width() / brickSize.x), 5 })) bricks << Rect{ (p.x * brickSize.x), (60 + p.y * brickSize.y), brickSize }; while (System::Update()) { Rect paddle{ Arg::center(Cursor::Pos().x, 500), 60, 10 }; ball.moveBy(ballVelocity * Scene::DeltaTime()); for (auto it = bricks.begin(); it != bricks.end(); ++it) if (it->intersects(ball)) { (it->bottom().intersects(ball) || it->top().intersects(ball) ? ballVelocity.y : ballVelocity.x) *= -1; bricks.erase(it); break; } if (ball.y < 0 && ballVelocity.y < 0) ballVelocity.y *= -1; if ((ball.x < 0 && ballVelocity.x < 0) || (Scene::Width() < ball.x && 0 < ballVelocity.x)) ballVelocity.x *= -1; if (0 < ballVelocity.y && paddle.intersects(ball)) ballVelocity = Vec2{ (ball.x - paddle.center().x) * 10, -ballVelocity.y }.setLength(speed); for (const auto& brick : bricks) brick.stretched(-1).draw(HSV{ brick.y - 40 }); ball.draw(); paddle.draw(); } } C++ で自力で作ると 500 行ぐらいかかる Siv3D は 27 行

Slide 15

Slide 15 text

Siv3D for Kids って何? タッチ操作で Siv3D のゲームプログラムを改造できるプログラミング 体験ツール。パソコンに詳しい先生がいなくても楽しめるのが特長 これ自体も Siv3D で作られてる

Slide 16

Slide 16 text

CoderDojo との関わり 1/4 • ソフトウェア研究では「どれだけ使われたか」も重要 • たくさんの人に使ってもらうことで改善も進む • 東京ではワークショップを開催しやすいが、それ以外では難しい (参加者やスタッフを集めるのが難しい、良い会場がわからない) • 各地の高専・大学のコンピュータサークル、CoderDojo, プログラミング教室と連携して勉強会やワークショップを実施

Slide 17

Slide 17 text

CoderDojo との関わり 2/4 • といっても、いきなり知らない人に頼むのは難しい • IPA 未踏、U-17 未踏ジュニア、プログラミングイベント、 SNS などで交流のある CoderDojo 関係者が何人かいた • 私のこういうツールを使って、こういうワークショップをしたいと 相談したら快諾してくれた • ありがとうございます!

Slide 18

Slide 18 text

CoderDojo との関わり 3/4 Siv3D Siv3D for Kids Enrect CoderDojo 金沢 CoderDojo 宜野湾 CoderDojo 浦添 Siv3D for Kids

Slide 19

Slide 19 text

CoderDojo との関わり 4/4 Siv3D Siv3D for Kids CoderDojo 静岡 CoderDojo 柏 Siv3D for Kids 写真引用: https://coderdojo-shizuoka.org/9th 写真はCoderDojo 柏提供

Slide 20

Slide 20 text

CoderDojo との連携で感じたこと • ローカルの人々に広くリーチし多くの参加者を集めることができた • 運営がこなれていて、スムーズにイベントを進められた • 学校など一般での開催と比べて、メンターのサポートが頼もしい • 好奇心が高く、新しい使い方やバグを発見するニンジャたち

Slide 21

Slide 21 text

パソコンの数や機種などの制約に注意 ワークショップ用の ノート PC を 自分でも16 台所有 アップデート 作業は大変 各地のコミュニティとの連携のために 1/3

Slide 22

Slide 22 text

現地のコミュニティの活動実績になるような形式に 各地のコミュニティとの連携のために 2/3

Slide 23

Slide 23 text

普段とは違うローカルの参加者を発掘する機会にしてもらう • C++ を学べる • 遠くの大学からゲストがやってくる • 親子で参加するイベント ローカルコミュニティの活動を外部の人に披露する機会にも • ローカルの参加者が普段の活動や宣伝を発表する LT(ライトニング・トーク)タイムを設けることも 各地のコミュニティとの連携のために 3/3

Slide 24

Slide 24 text

プログラミングツールを研究する理由 • 生きている間に最大限すごい未来を見てみたい • そのためには、一人でも多くの人がコンピューターの力を活用し て、いろいろな分野を発展させていく必要がある • プログラミングツールの開発は、数万人~数百万人のソフトウェ ア開発者の生産性を底上げ、プログラミングに取り組む人を増や すことができる強力な手段

Slide 25

Slide 25 text

• Scratch など「道具」を使っての開発はしていても、 道具を作る人に出会う機会は少ない。視野が広がるきっかけに • 気になるツールの開発者・研究者に声をかけてみてください • 「受け入れ」を PR するのもあり? • 双方にメリットのある WS デザインを考えましょう • プログラミングツール開発に携わる人が Dojo から生まれると嬉しい (おわりに) CoderDojo へのメッセージ