*バーチャルYouTuber・VTuber*という言葉が普及して幾年が経ち、バーチャルYouTuber市場は，今まさに群雄割拠の世にあります。
読者の中にも、テック系バーチャルYouTuberとして一躍することを志しているエンジニアの方がいらっしゃるのではないでしょうか？

そんなバーチャルYouTuberのなかでも、ひときわ知名度が高く、世間にも知られているキャラクターといえば、2016年6月30日に自我に目覚め、同年12月1日にバーチャルYouTuberとしてデビューした**「キズナアイ」**さんでしょう。

YouTubeをはじめとしたWebコンテンツのみならず、地上波放送にも活躍の幅を広げる彼女は、バーチャルYouTuberの草分け的存在として、その地位を確固たるものとしています。

【自己紹介】はじめまして！キズナアイですლ(´ڡ`ლ)

そんな世界の「キズナアイ」さんをモデリングしたのが、今回アンドエンジニアがインタビューした3Dモデラー、トミタケさん。
トミタケさんに、**エンジニアが知らない3Dモデリングの世界の裏側**を、赤裸々に語っていただきました。

~~ トミタケさん : 主にVTuberの3Dモデルを作っているフリーランスの3Dモデラー。インターネット老人会会員。二次元三次元国籍男女問わず『アイドル』がとにかく大好き。最近はストレス発散のために始めたガーデニングに夢中。 ~~

## 3Dモデラーは3Dキャラクターの「パパ」

#### balloon skmt3p left
そもそもですけど、3Dモデラーって何をする仕事なんですか？

#### balloon tomitake-3d right
基本的には、**ママ**が作ってくれたキャラクターデザインをもとに、**3Dモデルを作成しています。**
時折、**ママ**と一緒にキャラクターデザインから関わらせていただくこともありますね。
後者の方が、**実際に動かした時に破綻が少なくて、モデリングしやすいものが作れるんですよね。**

#### balloon skmt3p left
なるほどなるほど...。ん？ママ？

#### balloon tomitake-3d right
3Dのキャラクターをつくるにあたって、**キャラクターデザインを担当するイラストレーターをママ**、**デザインをモデリングするモデラーをパパ**と呼ぶ文化があるようなんですよ。

#### balloon skmt3p left
そうなんですね。つまり、こういうことですか。

~~「3Dキャラクター界隈の家系図」ママとパパ(と大人の事情)から、3Dキャラクターは生誕する (アンドエンジニア編集部作)~~

#### balloon tomitake-3d right
そういうことですね。
そして、セットアップまで終わったら、先方にモデルを納品することになります。

#### balloon skmt3p left
なるほど。いきなりコアな文化を目の当たりにしてしまった。
クライアントへの納品前には、キャラクターの検品とかテストはするものなんですか？

#### balloon tomitake-3d right
**基本的に、各工程ごとのチェックを、先方にお願いしています。**
工程ごとにモノを見ていただいて、その結果をフィードバックをいただいて、また直しての繰り返しですね。
そして、最後には実際に動かしてもらったうえでのチェックもしてもらう感じです。
やはり、**実際にキャラクターを動かすのは先方の環境になる**ので。

#### balloon skmt3p left
なるほど。フィードバックはどういう内容のものをもらえるんですか？

#### balloon tomitake-3d right
**1番多いのは、造形についてのフィードバックです。**
他には、*「関節の動きがちょっと・・・」*とか*「髪の毛のこのポリゴンが違う」*という指摘をいただくことがあります。
あとは、**顔だけでも10000ポリゴンくらいはいくんですけど、そのうちの1箇所が良くない**という指摘も、なかにはありますね

~~「顔のポリゴンの例」トミタケさんのアイコンの3Dデータにもこれだけのポリゴンが使われている ~~

#### balloon tomitake-3d right
だから、常に細心の注意を払いつつ、地道にモデリングしていきます。 

#### balloon skmt3p left
それは大変ですね。
そんなに丁寧に作られるとなると、1体のモデリングするだけでも相当な時間がかかりそう...。

#### balloon tomitake-3d right
そうですね。私の場合、仕事のものは**1体あたり2ヶ月**はかかっちゃいますね。
「キズナアイ」ちゃんの場合は、最終的な調整も含めて**4ヶ月くらい**かかったかもしれません。

#### balloon tomitake-3d right
特に、**顔を作るのには時間がかかっちゃう**んですよね。
**顔を作るのに一番力を入れたい**ので。

#### balloon skmt3p left
確かに大事ではありそうですけど...顔ですか？

#### balloon tomitake-3d right
だって、**3Dキャラクターの顔ってやっぱり可愛いほうがいい**じゃないですか！
**どの角度から見ても可愛い顔にしたい**んですよ！

#### balloon tomitake-3d right
私は、**可愛いということだけに力を注いでいますね。**
多少おかしなところがあったとしても、**究極的には、可愛い3Dキャラクターだったら許される**みたいな。
だから、**顔を可愛くすることを1番に考えて、そこに1番時間がかかってしまうんです。**

#### balloon skmt3p left
可愛さへの熱量が半端じゃないことが非常に伝わってきました...。
ところで、3Dキャラクターって、作って納品した後の保守作業ってないんですか？

#### balloon tomitake-3d right
いえ、**不具合が出たら対応したり、気になった箇所があればアップデートをすることもありますよ。**
3Dキャラクターの新しい着替えをモデリングする場合は、また三面図もらって、また作り始める流れですね。
あ、**三面図っていうのは3Dモデルの設計図**みたいなものです。

#### balloon skmt3p left
なるほど。つまり3Dモデラーのお仕事は、こういう感じの流れになるんですね？
ざっくりではありますが、これを繰り返すと。

~~「3Dモデラーのお仕事の流れ(トミタケさんの場合)」エンジニアの商流と似ているような！？ (アンドエンジニア編集部作)~~

#### balloon tomitake-3d right
そうですね。概ねそんな感じだと思います。

## 作りやすい3Dモデルは「裸に近い」3Dモデル！

#### balloon skmt3p left
3Dキャラクターのモデリングを依頼する際の相場って、ぶっちゃけ1体あたりいくらかかるものなんですか？

#### balloon tomitake-3d right
**個人への依頼の場合、10万円から20万円**で作っている方もいらっしゃるようです。
これが制作会社への依頼となると、**基本的には数百万円**という世界になります。
作るのにどうしても手間と時間はかかるものなので、やっぱり**相応の値段設定**になるとは思いますよ。
**とはいえ、用途や仕様にもよるんですけどね。**

#### balloon skmt3p left
やっぱり、仕様によって、金額も異なるものなんですか？

#### balloon tomitake-3d right
はい。一例としては、モデリングした3Dキャラクターを複数のプラットフォームで使用する際、**場合によってはデータ変換が必要で、そうなるとデータ変換料が追加でかかる**ケースがありますね。

#### balloon skmt3p left
え？それは新手の詐欺じゃないんですか？

#### balloon tomitake-3d right
詐欺じゃないです！
*MMD(MikuMikuDance。3DCG制作ソフト)*とか、*VRM(VR向け3Dアバターファイルフォーマット)*とか、あとは*VRChat*で使う場合とか、**3Dキャラクターを動かすプラットフォームや用途によって　3Dモデルの仕様が異なるんですよ。**
だから、複数のプラットフォームで動かす場合なんかは、**どのプラットフォームでも問題なく動くように調整しなきゃいけない**んです。

~~「MMD」VPVPで公開されている初音ミク専用のPV作成用ツールとして開発された3DCG制作ソフト。ニコニコ動画ではおなじみ。 (引用: [Vocaloid Promotion Video Project](https://sites.google.com/view/vpvp/)~~

~~「VRM」VRアプリ向けの人型3Dモデルデータを扱うためのファイルフォーマット。トミタケさんも「今後のアップデートに期待」とのこと (引用: [VRM](https://vrm.dev/))~~

#### balloon tomitake-3d right
ボタンひとつでモデリングできたり変換できれば楽なんですけど、**実際は地道な作業の繰り返し**なんですよね。

#### balloon skmt3p left
なるほど。他にも仕様による違いってあるんですか？
例えば、こういうモデルは作りやすいけど、逆にこういうモデルは作りにくいみたいな。

#### balloon tomitake-3d right
そうですね。まず、**作りやすいのは、裸に近いモデル**です！
一方で、**今流行っているようなオーバーサイズのダボッとした服は、実は破綻しやすかったりして難しいんです。**
どうしても胴体や顔に腕がめり込んだりしちゃうので...。

#### balloon skmt3p left
でも、だからといって、バーチャルYouTuberの3Dキャラクターの身ぐるみを剥がすわけにもいかないですよね。

#### balloon tomitake-3d right
そうですそうです。やっぱりイラストレーターの方や運営の方の思いもありますので。

#### balloon skmt3p left
こういうところは、エンジニアの商流と似ているところかもしれませんね。

## 「夜空メル」ちゃんの三面図は3Dキャラクターの三面図の手本となるレベルのクオリティ

#### balloon skmt3p left
ちなみに、モデルの仕様以外で、作りやすさを左右するものって何かありますか？

#### balloon tomitake-3d right
そうですね。ひとつ例を挙げるなら、**3Dモデルの設計図となる三面図**でしょうか。
特に、**「夜空メル」ちゃんの三面図は、まさに「3Dモデルを作りやすい三面図」だと思っています。**

~~「夜空メルの三面図」 ホロライブ所属のバーチャルVTuber「[夜空メル](https://twitter.com/yozoramel)」の三面図。[あやみ](https://twitter.com/ayamy_garubinu)さんがママとして3Dデザインを担当。(引用: [Twitter](https://twitter.com/ayamy_garubinu/status/1113063491097653249))~~

#### balloon skmt3p left
三面図というと、3Dキャラクターのデザイン図のことですよね。
この三面図は、どういった点がモデリングしやすいんですか？

#### balloon tomitake-3d right
端的に、**厚みと色がしっかりと記載されている点**ですね。
まず、キャラクターの造形において、基本的に、三面図から各部の大きさ、長さ、太さといった形状を読みとるんですよ。
この三面図では、**細かい装飾品の1つ1つまで、厚みを細かく記載してくださっていることが分かるかと思います。**

#### balloon tomitake-3d right
色についても、ベースの色やハイライト、それにストッキングのテクスチャまで記載してくれていますよね。
**これらがない場合、厚みは想像で補ったり、色は全部スポイトでとってテクスチャを描いていくことになります。**
その結果、*「やっぱり想像と違う」みたいな齟齬が起きてしまうことがあるんですよ。*

#### balloon skmt3p left
そう言われてみると、素人目に見てもすごく出来の良い三面図な気がしてきました。

#### balloon tomitake-3d right
あと、**パンツのデザインが書いてある点もありがたい**です。

#### balloon skmt3p left
パ...パンツですか？

#### balloon tomitake-3d right
そうです。スカートを履いているキャラクターのスカートが捲れて、ぴらっとパンツが見えた時に、**変なパンツだったら可哀想じゃないですか。**

#### balloon tomitake-3d right
なので、スカートを履いているキャラクターの**パンツのデザインをいただけていない場合には、私は、パンツのデザインもお願いするようにしています。**

【#犬山たまき新3D】20万人達成記念！犬山たまきメイド3Dお披露目配信♡【豪華ゲスト様多数✨】

#### balloon tomitake-3d right
犬山たまきくんはスカートの中が特徴的で、**三面図にもその旨がしっかりと描かれていました**ので捗りました。

~~「スカートが捲れてぴらっとパンツが見えた時」の再現画像。動画を見ない読者のために、筆者がモデルから用意しました。 (アンドエンジニア編集部作)~~

#### balloon skmt3p left
なるほど。パンツ、大事。

#### balloon tomitake-3d right
あとは、「夜空メル」ちゃんは**キャラクターデザイン的にも3Dモデリングしやすくて、且つ3D映えするデザインだと思っています。**

#### balloon skmt3p left
すごい。べた褒めじゃないですか。

#### balloon tomitake-3d right
基本的に、*裸に近くて、1つ1つの装飾は凝っているのに、破綻しやすい関節部分には何もない*んです。
加えて、*黒の手袋は特に破綻しやすい手首を隠してくれている*んですよ。
これって、**すごく3Dに起こしやすいデザイン**なんですよね。

#### balloon skmt3p left
この三面図、本当にお手本みたいな仕上がりなんですね。
これから3Dモデリングする人の参考になりそう。

## 3Dモデリングをはじめるきっかけは「アイマス」

#### balloon skmt3p left
ところで、トミタケさんは、何をきっかけに3Dモデリングを始めたんですか？

#### balloon tomitake-3d right
**きっかけは「アイマス」**です！

#### balloon skmt3p left
「アイマス」というと、**今年で15周年を迎えた「アイドルマスター」シリーズ [^1] **のことですか？

~~「アイドルマスター」シリーズは、BANDAI NAMCO Entertainment Inc.が展開する大人気ゲームシリーズ (引用: [「アイドルマスター」シリーズ15周年特設サイト](https://15th.idolmaster.jp/))~~

#### balloon tomitake-3d right
そうですそうです。「アイマス」はXbox時代にハマって、アーケード版もやったことがあります。
もともとアイドルが好きで、*「アイマス」を見て、アニメと3Dの間くらいの可愛い女の子が踊っているのが新鮮で面白いと感じました。*
**そこから3Dに興味を持ち始めたんです。**

#### balloon skmt3p left
なるほど。それで、3Dモデリングの勉強を始めたんですね？

#### balloon tomitake-3d right
いえ。**特に勉強という勉強はせず、必要な情報は都度ググっていました。**
最初はMMDのダンス動画を作るためにMMDモデルを作っていたんですけど、そのときは、*動画を作るための素材としてのMMDモデル*と認識していたので、**勢いに任せて作っちゃってたんですよ。**
**モデリングはすぐに終わらせて、早く動画を作りたい**って思ってました。

#### balloon tomitake-3d right
そのあとは、ゲーム系の会社で3Dモデリングのアルバイトを何年かしていました。
「キズナアイ」ちゃんをモデリングさせていただいたのも、アルバイトとは別なんですけど、ちょうどこの頃なんですよね。
ありがたいことに、この実績を評価いただいてか、今はフリーランスとしてお仕事できています。

#### balloon skmt3p left
「アイマス」という趣味が高じて今のキャリアに辿り着いたのは、ひとえに凄いですね。
今のこの仕事のやりがいってなにかありますか？

#### balloon tomitake-3d right
**自分の名義で、神絵師さんたちが描いた可愛いキャラクターの3Dモデルを作れる**っていうのがすごく嬉しいです。
**可愛い女の子を自分の作品として作って、それでお金をいただける**なんて、最高の仕事じゃないですか？

#### balloon skmt3p left
確かに。全オタクの夢と言っても過言じゃないかもしれません！

## 作りたいものを作ることが3Dモデリングのはじめの一歩

#### balloon skmt3p left
これから3Dモデリングを始める人に向けて、おすすめの3Dモデリングツールってあったりしますか？

#### balloon tomitake-3d right
そうですね。**業界への就職を前提とすると、ゲーム系なら「Maya」を、アニメ系なら「3ds Max」を使っておくのがおすすめ**です。
これらのツールは、*学生であれば無料で使用することができます。*

~~「Maya」ハイクオリティな3DCGを作成できる多機能ソフトウェア。先日、インディーライセンスが発表され話題に (引用: [「Autodesk Inc. 公式サイト](https://www.autodesk.co.jp/products/maya/overview?plc=MAYA&term=1-YEAR&support=ADVANCED&quantity=1))~~

~~「3ds Max」ゲームやアニメーションの3DCGの作成に最適な多機能ソフトウェア。こちらも、インディーライセンスが発表され話題に (引用: [「Autodesk Inc. 公式サイト](https://www.autodesk.co.jp/products/3ds-max/overview?plc=3DSMAX&term=1-YEAR&support=ADVANCED&quantity=1))~~

#### balloon tomitake-3d right
あとは、**直感的に操作できるスカルプトの手法でモデリングできる「ZBrush」も使えるようになると、強みになると思います。**
フィギュアの原型に使われることが多いツールですね。

~~「ZBrush」デジタル粘土のような感覚で3Dデジタルスカルプト (彫刻)・ペイントを行うツール。 (引用: [「Too Corporation. 公式サイト](https://www.too.com/product/software/cgcad/zbrush/))~~

#### balloon tomitake-3d right
ただ、いずれも学生じゃない場合はお値段が高いので、趣味でやる場合には、無料で使えて高機能なアドオンが多々公開されている「Blender」がおすすめですね。

エンジニアが知らない3Dモデリングの世界について、「キズナアイ」さんの3Dモデラーであるトミタケさんに直撃取材。3Dモデラーの実態、お金の話、そして3Dモデリングの始め方の話など、普段あまりインタビューを受けられないというトミタケさんに、根掘り葉掘り聞いてきました。

トミタケさん

3Dモデリングには時間もお金もかかる

「夜空メル」ちゃんの三面図は、三面図の見本にうってつけ

3Dモデリングを始めるなら、用途に合わせたモデリングツールで、最初の1体を勢いで作りきれ！

「キズナアイ」の3Dモデルの原点は「アイマス」!? トミタケさんに聞く3Dモデリングの世界

「ぷよぷよ」「ソニック」など人気ゲームシリーズでおなじみの株式会社セガは、2020年6月にプログラミング教材「ぷよぷよプログラミング」をリリースしました。

「ぷよぷよプログラミング」は、「ぷよぷよ」で実際に使われているコードを手本通りに入力して、動くゲームをつくることで、プログラミングの基礎を学べる教材です。

ゲーム事業や「ぷよぷよ」の e スポーツにおける知見・ノウハウを活かした内容が特徴で、教育現場や各種イベントで活用されており、利用者数は20万人以上にものぼります。

今回は、プロジェクトのリーダーである五十嵐 勝氏、「ぷよぷよ」シリーズの総合プロデューサーを務める細山田 水紀氏、開発を担当した上田 展生氏、講師を務めるeスポーツプロ選手・ぴぽにあ選手に、教材の特徴や授業の流れ、ユーザーの反応、今後の展望などについてうかがいました。

~~ 株式会社セガ eスポーツ推進室 室長 五十嵐 勝（右）、「ぷよぷよ」シリーズ総合プロデューサー 細山田 水紀（中）、開発技術部 テクニカルリサーチ課 課長 上田 展生（左） ~~

~~ 「ぷよぷよプログラミング」の講師を務めるSBI e-Sports所属 日本eスポーツ連合公認 ぷよぷよプロプレイヤー・ぴぽにあ選手 ~~

## 「ぷよぷよプログラミング」とは？

#### balloon kishi left
「ぷよぷよプログラミング」はどんなプログラミング教材なのでしょうか？

#### balloon igarashi right
**セガのアクションパズルゲーム「ぷよぷよ」のコードを“写経”、つまりコードを書き写すことでプログラミングを学べる教材です。**学習環境は教育現場で広く使われている「Monaca　Education」なので、特別なソフトのインストールは不要です。

#### balloon igarashi right
HTMLやJavaScriptといった世界中で使われているコンピュータ言語を使ってコードを書くことで、コーディングのルールを知り、プログラミングに慣れることができます。

#### balloon kishi left
「ぷよぷよ」を教材にしているものの内容は本格的なんですね。

#### balloon igarashi right
私たちはゲーム開発会社なので、短時間であってもできるだけ本物と同じ開発環境でプログラミングを体験してほしいと考えて開発しました。

#### balloon hosoyamada right
**製品版の「ぷよぷよ」と同じ画像素材を使っていて、正しいコードを入れると、ゲームのように「ぷよぷよ」が落ちたり回転したりするんです。**

#### balloon kishi left
実際のゲーム画面が動くのは面白そうです。元々どのようなきっかけで「ぷよぷよプログラミング」は生まれたのでしょうか。

#### balloon igarashi right
私はもともとeスポーツの仕事をしているので、もっと若い世代に参加してほしいという思いがあり、学校で何かできないかと考えていました。ちょうど文部科学省が教育現場のICT環境を整備する「GIGAスクール」構想を打ち出したこともあり、「ゲーム会社の事業の延長線上で社会貢献できるのは、プログラミングなのでは」と思い、学校教育に利用できるプログラミング教材の開発を決めました。

~~ 「ぷよぷよプログラミング」配付資料の一例 ~~

#### balloon hosoyamada right
 eスポーツそのものも、一般的なスポーツと同じようにあいさつやルールを大切にしています。**ゲームを通して、子どもたちにマナーや適切な競争の在り方を学んでもらうのも社会貢献のひとつだと考えています。**

#### balloon kishi left
ゲームから多くのことが学べるんですね。他のプログラミング教材にはない特徴はどのあたりなのでしょうか。

#### balloon igarashi right
全国の学校から依頼を受けて行う特別授業の講師を、ぴぽにあ選手をはじめeスポーツのプロ選手が担当している点です。彼らは元々ITエンジニアとして活躍していたこともあり、現場の先生方からも厚い信頼をいただいています。

#### balloon igarashi right
**第一線で活躍しているプロeスポーツ選手がゲームについて解説したり、プレイを見せたりできるので、興味を持ってもらいやすいと思います。**

#### balloon kishi left
現役のプロ選手から教えてもらえるのは貴重ですね。他に特徴的な点があればお願いします。

#### balloon igarashi right
「ぷよぷよプログラミング」のリリースから2年半くらいになりますが、70以上の学校で授業をして、はじめの頃よりもかなり内容をブラッシュアップしています。例えば、飽きさせない工夫として、コードを入力したらすぐに動くようにする。せっかくプロeスポーツ選手が講師なので、eスポーツの話題について話すこともあります。

#### balloon hosoyamada right
他にも著作権に関すること、SNSの使い方などネットリテラシーの話、ゲーム開発に関する技術的な話などもしますが、あまり難しくならないように好奇心がわく内容を心がけています。

#### balloon kishi left
プログラミング周辺の知識も学べるんですね。ぴぽにあ選手は、「ぷよぷよプログラミング」はどんな教材だと感じていますか？

#### balloon piponia right
質も量もちょうどよいと感じています。小学校の授業でも5～6年生となると、講師の説明を追い越してどんどん進める生徒もいますが、全体をみると**プログラミングが初めての生徒が多いので最初は「写経」が適切だと思いますね。**

#### balloon piponia right
高校生だとタイピングスピードも早くて理解力もありますが、高校生の授業で取り扱う上級コース全体のソースコードが1000行ほどなのに対し、１回の教室でできるのは10行くらいです。プログラミングの入り口という立ち位置の教材だからこそ、なるべく楽しく体験してもらえるように心がけています。

## eスポーツと組み合わせた特別プログラムも

#### balloon kishi left
「ぷよぷよプログラミング」のプログラムはどのような流れで進めているのでしょうか？

#### balloon igarashi right
**せっかくプロ選手が講師をしているので、最初に13連鎖とかすごいプレイをしてもらって、生徒の気持ちをつかんでから説明しています（笑）。**あとは、できるだけ説明を短時間で終わらせて、授業開始から15～20分くらいで「ぷよぷよ」が落ちてくるのを体験できるように授業を進めています。

#### balloon piponia right
「ぷよぷよ」が落ちてくると、教室でワッと歓声が上がります。その後の授業でもわからないところがあれば、私はもちろん他のスタッフもサポートするようにしています。

#### balloon kishi left
なるほど、楽しみながら学べるんですね。

#### balloon igarashi right
ええ、中学生以上が対象の場合、2部構成で午後にeスポーツを楽しむこともあります。午前中に「ぷよぷよ」のソースコードを実際に書き、午後にそのゲームをプレイすることで、今までよりもプログラミングを身近に感じることができるんです。

#### balloon kishi left
ニーズに合わせて、授業のやり方を変えることも多いのでしょうか？

#### balloon igarashi right
その時々で学校の先生と相談して、カスタマイズしています。生徒の状況を見て難易度を調整するのはもちろん、効果音を鳴らしたり、ゲーム内で使用する画像を生徒のイラストに変更したりするケースも多いですね。

#### balloon piponia right
校内eスポーツ大会の場合では、MCや司会進行などの役割を生徒が担当するケースも少なくありません。決まったパッケージを提供するというよりも、学校のニーズを実現できるよう手助けするといったスタイルです。

#### balloon kishi left
非常に自由度が高いんですね。一般公開している「Monaca Education」ではどのように学習を進めるのでしょうか？

#### balloon igarashi right
「Monaca Education」にサインインして、初級・中級・上級からコースを選んで、ソースコードを正確に“写経”するという流れです。**公式ホームページからソースコード一式と学習方法を記載した小冊子をダウンロードできます。**独学でも、プログラミングへの理解を深め、コーディングの作法を身につけられます。

## 自分で書いたコードで「ぷよぷよ」が動く面白さ

#### balloon kishi left
「ぷよぷよプログラミング」を開発するうえで、どのような点を意識していたのでしょうか？

#### balloon ueda right
いかに楽しくコードを“写経”してもらうかです。“写経”はプログラミングの第一歩として、とても適していると思います。見本通りに打っているつもりでも、半角・全角の違いなどで正しく動いてくれない。**どこが間違っているのかを確かめて、正しい動作を導き出す経験が、プログラミングの第一歩だと考えています。**

#### balloon kishi left
たしかに、“写経”はプログラミングを学ぶうえで効果的ですね。

#### balloon ueda right
とはいえ、ただ“写経”するだけではすぐに飽きてしまいます。そこで私たちは、コードを正しく打ったらすぐに「ぷよぷよ」の動きに反映されるように工夫しています。この部分は何度も試行錯誤を重ねており、例えば「一行追加したらぷよぷよが上から降ってきた」といったようにできるだけ動作の変化がわかりやすく理解しやすい箇所のコードをピックアップしました。

#### balloon kishi left
書いたコードが動きに反映されることが重要なんですね。

#### balloon ueda right
私自身、子どもの頃に雑誌に載っているコードを写経しても上手く動かなくて、間違いを必死に探して直した結果、きちんと動いてすごく感動した経験があります。その喜びを体験してもらえるようにプログラムを工夫しています。

#### balloon kishi left
上田さんご本人の経験が反映されているのですね。難易度などの設計については、どのように調整したのでしょうか？

#### balloon ueda right
**最初の基本の部分は1行だけで動くようにする、次のステップでは4行くらい入力するようにするといったように、五十嵐と相談しながらバランスが取れるようにしました。**あとは、どうしてこうなるのかなどコードの構造がわかるような設計を意識しています。

#### balloon kishi left
細かいところまで配慮しているんですね。参加者の反応についてお聞かせください。

#### balloon igarashi right
「いつもはすごく大人しい子が、普通に初対面の講師と話したり、積極的に周りの子に教えたりしていて、新しい面を見ることができました」といった声をよくいただきます。どちらかというと、普段静かな生徒がクラスの中で一番活躍するようなケースも多いようです。

#### balloon piponia right
最初は、プログラミングに興味がない子がいきなり写経して楽しめるのか不安でしたが、いざやるとみんなすごくいい目をして集中して取り組んでいます。**プログラミングは、いわばPC上で行う“ものづくり”なので、図画工作のように楽しめることに気づかされましたね。**

#### balloon piponia right
あとは、生徒同士が主体的に教え合ったり、話し合ったりしているのが印象的でした。プログラミングと発表会をセットで実施する場合もあるのですが、やりたいことがぶつかっても自分たちで解決していて、コミュニケーションの訓練の場にもなっています。

## 「ぷよぷよeスポーツ」の裾野も広げていきたい

#### balloon kishi left
今後の展望についても伺いたいです。ぴぽにあ選手の目標をお聞かせください。

#### balloon piponia right
「ぷよぷよプログラミング」だけではなく、「ぷよぷよeスポーツ」も大きく成長させる手助けができるよう、今後も進化していきたいです。選手としては、明確な目標設定をしていろいろな部分を練習しつつ、本番で一番いいパフォーマンスを出せるようコンディションを整えて臨みたいですね。

#### balloon kishi left
今後のさらなる活躍が楽しみです。「ぷよぷよeスポーツ」の認知度を高めるための取り組みについてお聞かせください。

#### balloon igarashi right
競技人口の増加を目指し、トップ層だけではなく裾野を広げるような取り組みに注力していこうと思います。eスポーツの大会はオンライン配信する場合が多いのですが、女性プレイヤーのなかには顔出しに抵抗感のある方もいらっしゃいます。そのため、女性だけの大会も検討しています。**その他にも、日本で暮らす外国人・障害者・シニアなど、幅広い方が参加できる世界基準のeスポーツを実現できたらと考えています。**

#### balloon kishi left
今まで以上に誰もがeスポーツを楽しめるようになるんですね。他に何か施策があれば、うかがいたいです。

#### balloon igarashi right
**これまで「ぷよぷよeスポーツ」は1対1がメインの競技でしたが、チーム戦も積極的に実施する予定です。**今のeスポーツはチーム戦が好まれていて、世界的にも5人チームで戦うといった試合がたくさんあります。特に学校では、協力しながら競技ができるチーム戦が歓迎されるので、2対2の試合を導入できたらと思います。

#### balloon hosoyamada right
今年は私の地元である鹿児島で、全国都道府県対抗eスポーツ選手権が開催されます。「ぷよぷよeスポーツ」も競技タイトルのひとつです。これまで活躍してきた子どもたちが参加してくれるので、盛り上げていきたいですね。

#### balloon kishi left
なるほど。「ぷよぷよプログラミング」の普及に向けた取り組みについてはいかがでしょうか？

#### balloon piponia right
プログラミング講師として、プログラミングそのものの楽しさをわかりやすく伝えていきたいです。「ぷよぷよプログラミング」は、教材として非常によくできていると思います。わからないながらもコードを写し、「ぷよぷよ」をプログラミングで実際に動かしていく。初めてプログラミングに挑戦する人にとって、最適な「入り口」ではないでしょうか。

#### balloon igarashi right
内容のブラッシュアップはもちろん、より多くの人にプログラミングの楽しさを知ってもらうため、今後さらに開催数を増やしていきたいです。**社会的にもプログラミングのニーズは高まっており、2025年1月に実施される大学入試の共通テストに「情報」という科目が追加され、プログラミング言語についての問題が出題されるようになります。**「ぷよぷよプログラミング」で取り扱うJavaScriptがベースになっている部分があるので、入試対策になるような要素を今後取り入れていきたいですね。

大学卒業後、構成作家・フリーランスライターとして、幅広いメディア媒体に携わる。現在は採用関連のインタビュー記事や新卒採用パンフレットの制作に注力しながら、SaaS企業のマーケティングにも携わっている。いま一番関心があるのは、キャンプ場でワーケーションできるのかどうか。

岸 裕介

上田さん

ぴぽにあ選手

五十嵐さん

細山田さん

「ぷよぷよプログラミング」で学べる内容、他のプログラミング教材との違い

eスポーツプロ選手が講師を務める「ぷよぷよプログラミング」の授業内容

セガが推進する「ぷよぷよeスポーツ」認知度アップのための取り組み

「ぷよぷよ」でプログラミングを学べる!? eスポーツプロ選手が教えるプログラミング教室

こんにちは、アンドエンジニア編集部です。

**「プログラミングを学んでいまの業務への活用や転職・キャリアアップに繋げたい・・・」**

そのような思いから、プログラミングを学ぼうと考え中の方・あるいは学習中の方も多いのではないでしょうか？

しかし、実際どのように環境構築やテストを行えばいいのか、分からない方も多いと思います。

プログラミング学習ができる有名なサービスのひとつにProgateがありますが、Progateで学習したユーザーが実際に開発を始めると、**「開発環境の構築方法が分からない」「エラーが発生した時にどのように解決すればいいのか分からない」**といった課題に直面することもあるかと思います。

そんな中、**Progateでプログラミングを学んだ人が「その先」の「実践的なプログラミング」を学べるサービス『Progate Path』が2022年11月に公開されました**！

参考：[Progate Pathの公式サイト](https://path.progate.com/)

そこで、今回は**ProgateとProgate Pathの間にどんな違いがあるのか？Progate Pathで学べる実践的なプログラミングとは？アンドエンジニア編集部員が実際に体験してみました**！

#### balloon nao left
文系出身の元Webデザイナーで、使用経験があるのはHTML/CSS/PHP。Progateでプログラミング言語を学んだ過去あり。

#### balloon yuu right
元Webエンジニア。前職では企業向けのWebシステム開発案件でPHPを用いて開発していた。Progateを利用してプログラミングを学んだ過去あり。

#### balloon yuu right
まずはProgateってご存じですか？

#### balloon nao left
知ってる知ってる！**プログラミング学習ができるサイトでしょ**。有名だし使ったこともある！<br/>私はHTML/CSSのレッスンとかをやったんだけど、スライドの説明がイラストになっててわかりやすかった記憶がある。

#### balloon yuu right
その分かりやすさから、プログラミングをはじめたての場合まずProgateから手を付けるという人も多いですね。しかし、**Progateは始めやすい一方で、「終わったらどうする」「簡単すぎる」といった意見もあるようです**。

#### balloon nao left
終わったらどうするはたしかにそうかも。JavaScriptレッスンとかなら、「ホームページのこの部分を作るぞ！」みたいに学んだ内容を活かすイメージがなんとなく湧くけど、Rubyとかのレッスンになると「書き方覚えた！…このあとどうするの？」ってなっちゃいそう。

#### balloon yuu right
**そんな人たちにオススメなのが『Progate Path』です**！

#### balloon yuu right
Progate Pathは「実務につながる経験を積めるプログラミング学習サービス」として、2022年11月にリリースされました。

#### balloon yuu right
Progateではプログラミング言語の書き方を中心に学べますが、エンジニアとして仕事をする上では他のスキルも必要です。例えば、「コードを読む力」や「デバッグ力」、「検索する力」や「公式ドキュメントを読む力」などです。

#### balloon yuu right
**Progate Pathでは、それらの「エンジニアの実務に必要なスキル」を学ぶことができます**。

~~Progate Pathでは、エンジニアの実務で必要とされる「技術書で学べるスキル」「実務で身につけるスキル」の両方を学ぶことができる~~

#### balloon nao left
（急に説明口調になった...）つまり、**Progateは基礎となるプログラミングをメインに学べて、Progate PathはProgateで学べるプログラミング含め実務で使用する技術も学べる**ってこと？

#### balloon yuu right
その通りです。

#### balloon nao left
なるほどね。私が始めるならもう一度Progateからかな...。昔Progateでプログラミング言語を学んだけど、十分に勉強できていないから。

#### balloon yuu right
なおさんのような「昔Progateでプログラミング言語を学んだけど、十分に勉強できていない初心者」には、Progae Pathの公式サイトに公開されている『学習ロードマップ』を元に学習を進めてみるのが良いでしょう。

#### balloon yuu right
**Progate Pathでは、本気でエンジニアを目指す人向けに『学習ロードマップ』が公開されています**。

参考：[エンジニア就職までの学習ロードマップ](https://path.progate.com/roadmap)

#### balloon yuu right
今回は、そんなロードマップに沿って体験してみました！

### Web開発コースをはじめる方へ（Node.js）

~~Progateのログイン後に表示される上部メニューから、『学習ロードマップ』を見ることができる~~

#### balloon nao left
このコースを最後までやりきったらどうなるのですか？（Progate在住 わんこさん）

#### balloon nao left
こういうのが書いてあると、**自分でも「私は何のためにこのコースを受講するんだ？」って最初に意識できていいね**！

#### balloon yuu right
**「なんとなくやりました」より「このためにやってます」と意識できていた方が真剣に取り組めそうですよね**。

#### balloon yuu right
自分は2018年頃にProgateを使っていたのですけれど、当時はこのように改めてProgateの使い方や学習前の心構えを教えてくれるページがなかったので良いなと思います。

### 学習レッスン HTML & CSS 初級編

#### balloon yuu right
**直接学習と関係ない箇所はコピペできる機能があったり、分からなくなったらコーディングの画面から直接スライドへ戻れるようになっている**んですね。

#### balloon nao left
プログラミング初心者でもついていけそう！初心者に優しい設計だね。

#### balloon yuu right
HTML&CSSなどのマークアップ言語は、PHPやPythonなどのバックエンド言語とは異なり、プログラムが間違っていても動きます。プログラミング初心者あるあるの「エラーで詰まって先に進めない」という現象に陥りにくいこともあり、ついていきやすいと思います。

#### balloon nao left
急に難易度が上がった気がする...。

#### balloon yuu right
Node.jsはサーバーサイド側だからですね。前レッスンで学んだJavaScriptは「フロントエンド言語」、Node.jsは「JavaScriptをサーバーサイド上で動かす仕組み」という違いがあるので、なおさんのような初心者には難しく感じるかもしれません。

人気のある記事