CLIP STUDIOで技術系同人誌を作ろう! 原稿作成→データ入稿までの一連の流れを公開

公開日: : 最終更新日:2018/05/20 イラスト, マンガ, 作業メモ, 制作ツール, 雑記

技術系同人誌 Advent Calendar 2017 18日目

技術系同人誌 Advent Calendar 2017 18日目担当として、CLIP STUDIOで技術系同人誌を作るときの流れをまとめます。

はじめに

技術系同人誌というと、Re:VIEWを使って書いている方が多いと思います。
テキストメインの場合、Re:VIEWは大変便利ですが、「文字よりも図解が多い」「マンガを挟みたい」場合は「CLIP STUDIO」を使うのがオススメです。

CLIP STUDIOは、さすがマンガ制作用ソフトだけあって、図解を書きやすいですし、印刷所にラクにデータ作成・入稿できます。

今回の記事では、Webデザイナー・マンガ家・技術書執筆をしております湊川あいが、技術書同人誌を作るときどのような工程で作っているのかを共有したいと思います。

1. 環境

CLIP STUDIO PAINT EX

湊川はCLIP STUDIO PAINT EXを使っています。

CLIP STUDIOとは、マンガに特化したイラスト制作ソフトで、その使いやすさから最近だとアニメ制作にも使われています。
値段も良心的なので、いちからデジタルイラストを始めたいという人にもおすすめです。

iPad版もリリースされたようなので、iPad Proをお持ちの方はアプリ版を使うという手もありますね!

絵を書くためのデバイス

液晶タブレットかペンタブレット(板タブと呼ばれているもの)をパソコンに繋いで使います。
どの機種が合うかは個人差があるので、まずは家電量販店で試し書きしてみるのがよいでしょう。

  • 肘から動かして絵を描く人 →大きめのインチ
  • 手首だけ動かして描く人 →小さめのインチ

湊川は手首で描くタイプなので、大画面だと逆に描きづらくなってしまいます。よって、小さめの液タブWacom Cintiq 13HDを使っています。

↑こちら、Amazon上でCLIP STUDIO EX付きの割安セットも選べるので同時購入を考えている方はオススメです。

2. 仕上がりサイズとページ数を考える

CLIP STUDIO PAINT EXを立ち上げ、上部のメニューから[ファイル] > [新規]をクリックします。

ページ数を考える

仕上がりサイズをA5にするか、B5にするか決めます。
「A5ってどれくらい?」と思う方は、A4用紙を半分に折るとわかります。

A5ってこれぐらい

書籍「わかばちゃんと学ぶ」シリーズはA5です。
わかばちゃんと学ぶシリーズはA5

B5ってこれぐらい

B5は、同人誌でよくあるサイズといえば伝わりやすいでしょうか。結構大きいです。
設定資料集はB5

私は、図解解説はA5、設定資料集などの絵を大きく見せたいものはB5にしています。

ページ数を決める

ページ数は基本的に8の倍数で考えます。

  • 16ページ
  • 24ページ
  • 32ページ 
  • … 

表紙・裏表紙は別で換算します。
表紙・裏表紙は印刷用語で「表1・表2・表3・表4」の計4ページぶんになります。
表1って何?と思った方はこちら

たとえば本文24ページの冊子を作りたい場合、「本文24ページ・表紙込みで28ページ」となります。
ページ数によって印刷費が変わってくるので、印刷所さんのWebサイトをよく確認しましょう。

.cmcファイル

冊子の設定を終えると、「.cmc」という拡張子のファイルができて、こんな感じで連番でページを埋めていくことができます。
(原稿ページ管理機能はCLIP STUDIO PAINT EXだけの機能です)

ページの並び替えもドラッグ&ドロップでできてラクチン!
cmc.png (93.7 kB)

3.全体の構成を考える

どんな項目を入れるかを箇条書きで考えます。

4. プロットを考える(マンガがある場合)

全体の構成の中でも

  • そもそもの場面設定の部分(どういうキャラクターが、どういう状態にあるのか?)
  • 特に力を入れて説明したい部分

をマンガにしていきます。

5. ネームを切る

プロットをマンガに当てこんでいきます。

6. 下書き→ペン入れ

ネームに沿って下書きします。
私の場合は、下書きであることがわかるように青い線で書いています。

マンガ下書き (103.9 kB)

下書きが終わったら、下書きレイヤーの透明度を20%ぐらいに下げ、その上のレイヤーから黒い線でペン入れしていきます。

最後にベタを塗る→トーンを貼る→一番上のレイヤーにホワイトを乗せて仕上げます。

マンガ仕上げ (103.9 kB)

8. テキスト

clipst.png (105.6 kB)

フォントはそれぞれこだわりがあると思うので一概には言えませんが、私が試した中では

  • テキスト部分:F910新コミック体
  • コマンドやソースコードの部分:Osaka

がしっくりくるので、よく使っています。

9. 仕上げに、メモ書きを書き入れたりする

ここがCLIP STUDIOで技術書を作るときの一番のメリットではないかと思うのですが、このように手書きで注釈を入れることで「手書きのノート風」にできるのです。

魔王教授と学ぶGitコマンド入門より

イメージとしては、友達のノートを見ているような感じでしょうか。
CLIP STUDIOだからこそできるこのスタイル、私は結構好きです。

10.いよいよ入稿!

私が普段使っている印刷所さんはサンライズパブリケーションさんです。
対応が丁寧ですし、入稿用のWebフォームもわかりやすいです。

サンライズパブリケーションさんの会員ページはこんな感じ

kaiin.png (103.9 kB)

再版も簡単

saihan.png (46.8 kB)

入稿形式

PSDファイルで書き出して、ZIPファイルにまとめておきます。

表紙は、テンプレートが用意されているので、それに当てこみます。

サンライズ表紙テンプレート

11. サンライズさんのWebフォームからデータを送って完了です

入稿しました

早めの入稿で20%割引

サンライズ割引
ちなみにサンライズさんには「レスキュー」っていうプランもあるけど35%”割増”です。
レスキュー……。

告知:表紙イラスト担当しました

おやかたさん 編の「技術同人誌を書こう! アウトプットのススメ」の表紙と、一部文章を担当させていただきました。
Re:VIEWの使い方から印刷所の手配、当日の準備物まで網羅した、258ページを超える分厚い本になっています。

ワンストップ!技術同人誌を書こう
技術同人誌を書こう! アウトプットのススメ | 出版社:インプレスR&D

Kindle版と冊子版とがお選びいただけます。
Amazonで好評発売中!

おわりに

この記事が「CLIP STUDIOを使ったことはないけど、図解や挿絵がたくさん入った技術書を描いてみたい」という方の参考になれば幸いです。

明日はfinapさんです!よろしくお願いします。

関連リンク

GitHub・Bitbucketの使い方は、こちらの書籍で解説しています。


C4XnLc6UoAAJNrS

「わかばちゃんと学ぶGit使い方入門」

Web連載

著書

  • Pocket       
  • このエントリーをはてなブックマークに追加

関連記事

CodeIQ Magazineにて、マンガでわかるGitの連載が始まりました

こんにちは、Webデザイナーの湊川あいです。 最近やっと一段落ついたので、改めて怒濤の3ヶ月をまとめ

記事を読む

マンガでわかるGitが書籍化!2017年4月21日から書店にて発売

マンガでわかるGitが書籍になります Web連載中の「マンガでわかるGit」の書籍用原稿が完成いた

記事を読む

#マンガでわかるDocker サンプル #技術書典 4

マンガでわかるDocker 2018年4月22日(日) 秋葉原UDX2階 アキバ・スクエアにて

記事を読む

マンガでわかるWebデザインが書籍化!全国の書店・アマゾンで発売

マンガでわかるWebデザインが本になりました! 「わかばちゃんと学ぶWebサイト制作の基本」 出

記事を読む

初めてでも大丈夫!Tech系Podcastに出てみませんか?

こんばんは。フリーランスWebデザイナー・マンガ家・技術書執筆をしております湊川あいです。 しがない

記事を読む

『わかばちゃんと学ぶ』シリーズ #技術書典 5に出展します【あ20】

◎貴サークル「湊川あいの、わかば家。」は、 あ20 に配置されました。 一番出口に近い

記事を読む

わかばちゃんと学ぶ Git使い方入門 PDF版ダウンロードはManateeで!

御礼 拙著「わかばちゃんと学ぶ Git使い方入門」が、2017年4月に発刊して以降、おかげさまで2

記事を読む

【コラボマンガ】怖くない!黒い画面入門【 #シス管系女子 + #マンガでわかるGit 】

こんにちは!絵を描くWebデザイナーの湊川あいです。 普段 マンガでわかるGit わかばちゃんと学ぶ

記事を読む

「マンガじゃなくてもGitぐらいわかるでしょ」と言われたことがあります

わかばちゃんと学ぶGit使い方入門 Web連載から始まった「マンガでわかるGit」の書籍版がついに

記事を読む

HTMLちゃんとCSSちゃんを擬人化するとこんな感じ

  ちょっとラクガキ。 HTMLちゃんとCSSちゃんの日常を描いてみました。

記事を読む

Comment

  1. llminatoll より:

    18日目を書きました! 技術系同人誌 Advent Calendar 2017 / #技術書典 #techbook_meetup

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

『わかばちゃんと学ぶ』シリーズ #技術書典 5に出展します【あ20】

◎貴サークル「湊川あいの、わかば家。」は、 あ20 に配置さ

#マンガでわかるScrapbox Kindle化しました:便利な使い方をイラストで

技術書典4で、配布開始後30分で150冊即なくなった「マンガでわか

Live2Dモデル制作 ご依頼承ります
Live2Dモデル制作依頼受付中(サンプルモデル・制作料金掲載)

こんにちは。本ページをご覧頂きましてありがとうございます。 フリー

YouTubeヘッダー画像のサイズは2560×1440ピクセル。チャンネルアート作り方2018

チャンネルアートの作り方 2018年8月時点での、YouTubeチャ

わかばちゃんと学ぶ Git使い方入門 PDF版ダウンロードはManateeで!

御礼 拙著「わかばちゃんと学ぶ Git使い方入門」が、2017年4月

→もっと見る

PAGE TOP