技術書典7でプログラミングマンガ同人誌を出した

 すっごく今更な話ですが、技術書典7でプログラミングマンガ同人誌を出しました。

 なので、どんな目的でどんな風に書いたのかという話をちょっと残しておこうと思います。

 

1. 企画を考える

 今回はズンドコキヨシを見かけた男子中学生がプログラミングを勉強していく話 第1話をマンガにしたかったのですが、多分著作権上いろいろアウトなのでエッセンスだけ取り出してマンガにすることにしました。

 そこで、ズンドコキヨシチェック相当の問題を思いつきたかったのですが、そこはうまく考えられなかったのでFizzBuzzを問題にすることにしました。

 

2. 登場させたいソースコードを全部書く

 まず普通にFizzBuzzを書いていきます。で、初心者はここでつまづきそうだな、というバグを仕込んでおりかつ未完成のバージョンをまず書き、そのバグは取れたし次の一歩に進んだけれどもその次の一歩でもまたバグを仕込んでいる、というバージョンを書きます。

 ポイントとしては、いきなり最後まで書かず、少しづつプログラムが完成していくという過程を踏んでいくことです。なぜなら、私が書きたいことはプログラムはまず完成を目指すよりも小さな問題から少しづつ作っていく方がいいということだからです。

 小さな問題から少しづつ作るのはいろんな意味でいいと思っています。バグを仕込んでも原因の特定がしやすいとか、自分が言語の使い方を覚える時にも必要なものを必要な時に調べ少しづつ動かしていくことで言語の使い方を無理なく覚えられるとか、メリットいろいろあると思っているので、本当にプログラミングの初心者が覚えるべきことは変数の宣言の仕方とか関数の作り方よりも少しづつ問題を進めていく姿勢だと思っています。

 前述のズンドコキヨシでもこの本でも、本当に書きたくて本当に伝えたいことはここだということは最初からブレていないつもりでいます。

 

3. シナリオを書く

 そしてこのプログラムを作っていく過程をセリフにしていきます。主人公が次のステップに進むための気づきを得るところが書いていて一番難しいです。

 

4. GitHubで公開してレビューを募る(しかし現れず)

 シナリオを書いたところで一旦GitHubにて公開することにしました。レビューを募ってブラッシュアップをしようと思ったためですが、お礼をちゃんと明記しなかったりとか多分いろんなことが原因でレビュアーさんは現れませんでした。

 次はもっとうまくやりたいです。

 

5. Clip Studio EXでネームを描く

 シナリオを元にネームを描いていきます。ネームってのはマンガの設計図です。コマを割り、誰がどこ向いてるのかくらいはわかる程度の絵を入れて、吹き出しの位置を決め、シナリオに書かれたセリフをさらにブラッシュアップします。

 シナリオではセリフが長くなりがちですが、吹き出しに入れて、かつ読みやすくしようとするといろんなところを省略したり、吹き出しの配置を工夫する必要がありました。

 

6. ネームを元に絵を入れていく

 ネームを元にして、絵を描いていきます。アナログ時代はネームを描く紙と絵を描く本番の紙は別物でしたが、デジタルだとレイヤーがあるので、ネームレイヤーの上に下描きレイヤーを作って更にレイヤーを重ねてペン入れをしてといった具合に作業ができて、一つのファイルで済むようになっています。

 でも、デジタルでもネームのファイルと本番のファイルを分ける人も多分いると思います。ネームだけアナログとか。

 

7. スクショを貼りこむ

 絵ができたらエディタ画面やブラウザのスクリーンショットを貼り込んでいきます。

 デジタルで白黒の絵のデータを作るときは、白黒2値(書店とかで普通に売られているマンガはこれです)を使う場合とグレースケールを使う場合があります。

 マンガだからと思って普通に白黒2値で原稿を作ってきましたが、スクリーンショットを白黒2値で表現するのは無理がありました。

 なので、印刷屋さんのウェブサイトを調べまくって、白黒2値とグレースケールを混合させることにしました。スクリーンショットのみ、グレースケールで表現するためです。

 とはいえファイルの属性的にはグレースケールで、スクリーンショット以外のところでは白黒2値以外のグレーは使わなかったというだけの話ですが。

 

8. 完成

 ちなみにこのClip Studio EXというソフトのiPad版を使っています。

f:id:KZE:20191226184702p:plain

iPad版Clip Studio EX

 

9. 振り返り

9.1 もっとネームが練れたのではないか

 ネームはもっとわかりやすくは出来なかったと思うのですが、細かい言い回しなどはもっと練ることが出来たと思っています。姉の出来ない人は必要ない、というセリフは添削したいセリフ第一位です。

 

9.2 もっと絵を丁寧にできたのではないか

 絵を丁寧にするモチベーションがなかなか湧かなかった、というのが正直なところです。絵で見せなければならない最終コマは粗い状態から描き直しましたが、その他の絵は最低限の説明ができれば良いという考えの元に描かれたものなので、本当に丁寧さに欠けています。

 マンガの楽しみの中には絵を見る楽しみも確実にあると思うので、次を描く機会があれば絵についてもっと執着を持ちたいと思います。

 

9.3 題材は適切だったか

 これは今でもわかりません。JavaScriptを採用したのは誰もが必ずブラウザという形で実行環境を持っているからです。

 でも、FizzBuzzを問題として選んだのはどうだったのか?

 試行錯誤して解いていく問題として適切だったか?

 ちなみに最初に書きたかったズンドコキヨシについては、実はほぼパーフェクトに適切で、第一話では関数を使わずに解く、第二話では関数を使って解く、第三話ではオブジェクト指向を使って解く、という三段構えの構想があったのです。二話と三話は今の所幻ですが。

 あと、プログラミング経験者である姉を出現させてしまったことによって、主人公がひとりで試行錯誤する感がズンドコキヨシの記事よりも欠けてしまったかも知れません。

 

9.4 次があるとしたら

 次に技術同人誌を描くとしたら、やっぱりマンガにしたいです。ちなみに夫からはUnityを使って子供をあやす用のガラガラアプリを作った話をエッセイマンガにしてはどうだ?と提案されています。でも、面白いネタのはずなのになぜかイマイチ心にグッときていません。

 あと、今回ニッチ本を描けたのは誇るべきものだと思いますが、もうちょっとソフトウェアエンジニアの人が面白いと思いそうな問題をテーマにして、パイが広めのところを狙いたい気持ちがあります。

 あとは、CUIの世界をダンジョンに例えてサーバというダンジョンを攻略していくマンガとか面白いかも知れません。

 えーと、つまり次は何も決めていないということです。

 何も決めていないけど、次はあってほしいです。

 

 今回の同人誌はBoothで販売しています。ご興味がありましたらお手に取っていただければ幸いです。

rotelstift.booth.pm