技術書

技術書典6で同人誌を配布するまで考えたこと全て

Sato Takeshi

• 12 min read
技術書典6で同人誌を配布するまで考えたこと全て

2019/04/14 (日) 技術書オンリーイベント技術書典6が開催されました。
私は新作「ハーフモーダルで理解するFluid Interface」を配布しました。

イベント開催時間の11:00から17:00まで、ひっきりなしに人がブースに遊びにきていただき大いに盛り上がりました。お陰様で販売数も170冊以上（製本+PDF合わせて）配布することができました。

ご購入頂いた方、ブースをのぞいてくれた方ありがとうございます。

この記事では新作を作り、読者に届けるまでの過程を振り返りたいと思います。

会場の様子

参加した理由

私、けっこう勉強や学習、個人テーマの研究は「アウトプットをする場所」を決めてからすることにしています。
そうすれば嫌でも頭にインプットしなければいけない状況になり結果身につくという寸法です。

それで、個人研究テーマとしてずっとiOS開発のカスタムUIや画面遷移について学びたいと思っていました。

すると2018年のWWDCにて「Designing Fluid Interfaces」としてトークが発表されました。
このビデオは、直感的に使えるUIとして「なめらかなインターフェイス」を提唱するものです。
私もiOSエンジニアとしてユーザーにとって使いやすいUIを極めていきたいです。
このトークはそんな人にとってとても重要なものでした。

ただこのトークは概念を中心に話しており、具体的な「このアプリのこのUIはこう作る！」というものがありません。
また他のブログや記事、書籍を探しても具体的なUI実装を解説しているサイト、ブログはあまりありません。

ならば作るか！

というのがきっかけです。

この「Fluid Interface」をテーマに概念とUI実装を含めた技術同人誌を作れば自分の学びにもなり、読者にとっても有益になるはずです。

過去の作品

過去いくつか技術同人誌を作りました。

Server Side Swiftとして名高いVaporを学ぶ入門書「Vaporで学ぶServer Side Swift」

技術書典３で出展したVapor入門書

@iototakuさんと共著で執筆したブロックチェーンにかんする「公務員の文章改竄防止システムをブロックチェーンで作ってみた」。私は第一章にてEthereumのスマートコントラクトアプリを作る方法を解説しました。

技術書典４で出展したブロックチェーン開発入門書

ただ、どちらも「作ったけれど読者の心に響くものになったかな？」というと疑問です。
作れたけどそれで終りというか。。
ツイートでエゴサしても感想が引っかかりません。

もっと読者に「読んで役に立った！」と思えるような作品を作りたい！

それには綿密な計画が必要です。
なので執筆をする前から準備を進めました。

企画書の作成、ペーパーのものを抜粋する

自作のコンセプトシートを埋めてどんな作品にするかをまとめました。
アプリ用に作ったものなので項目名がおかしいところはご了承ください。

IMG_0562-----

  • タイトル
    • ハーフモーダルで理解するFluidc Interface
  • 本の内容
    • WWDCで提唱されたFluid Interfaceを解説する
    • 新しいUIの考え方に触れてUIを組む参考にできる
  • 対象者（対象読者）
    • iOSエンジニア
    • アプリデザイナー
    • （エンジニア、デザイナーに限らず）UI実装、デザインに興味のある人
  • 使用ストール（読者はどんな感想をもつのか？）
    • さくっと読めていい！
    • UIの歴史、概念からサンプルコードもあってわかりやすい。すぐ試せる
    • 実際に動くサンプルコードがあってわかりやすい！
    • UI設計いつも悩むから助かる！
  • 内容
    • ユーザーが使いやすいとは？を解説
    • Appleが考えるUIとは? Fluid Interfaceとは？
    • 実装がわかる
    • 概念がわかる

企画段階なので、今考えると途中で微調整した内容もありますがまずまとめることが重要です。
自分が作るものは「誰に対して」「どんなものを」「どんなふうに届けたいのか（どんな感想を持ってもらいたいのか）」を予め考えておくと読者に響くものがつくれます。

本のページ数

今回は自分一人の執筆であるということと、ページ数は少なくても逆に「さくっとよめるのがいい」という意見が@shu223さんがつぶやいていたのでA5サイズで100ページを目指しました。
実際の本は60ページに収まるページ数になりました。

ページ数が少なくても価値になる

技術書典について調べる

事前に技術書典の運営の方がイベントについて共有するイベントがあったので参加しました。

技術書典6 技術書の作り方勉強会 ～執筆環境をワイワイはなそう～ - connpass

とてもいいイベントでした。技術書典に参加を検討している人はconnpassグループの技術書典 - connpassをフォローしてイベント参加したほうがいいです。
このイベントでは

  • 執筆環境は何でやるといいのか。
  • 本の作成過程
  • 値段設定
  • 本のサイズ（A5やB5など）
  • 前回までの技術書典の振り返り
    • 入場者数やチェック数による本の販売数の推移なども共有いただきました。300チェック以下ならチェック数≒販売数がなりたつそう。本の印刷冊数を決めるのに参考になります。

また技術書典の運営をしているTechBoosterさんが執筆ツールの一つRe:Viewの環境テンプレートをGitHubで公開しているという情報をいただきました。

https://github.com/TechBooster/ReVIEW-Template

今回の執筆はこのテンプレートを使って執筆しました。環境構築に時間をとられず執筆に作業を集中することができました。

表紙にこだわる

読者の心に刺さる本を作るには表紙が大事です。
今までは自分で作っていました。
しかし私はエンジニア。イラストは頑張れば作れるレベルで、それでは当日会場に歩いている参加者の目に止めることはできません。
そこで今回は表紙をデザイナーの方に依頼することにしました。

株式会社UZUMAKIのひのふさんです。

技術同人誌の表紙はかわいい萌え絵やオライリーのような写実的な表紙がよくあります。
ただ、萌え絵にしても周りの同人誌に埋もれてしまいます。
コンセプトシートをもとにどんな読者に届けたいのか、そのためにどんな表紙にするべきなのかをひのふさんと話し合いました。
そこで表紙デザインの方向性が

* ジャケ買いを狙う
* UIを扱う内容なのでエンジニアだけでデザイナーにも手にとれるようにおしゃれなデザインにする
* 表紙で内容が分かるのがよい

イメージしたのはこんなふうな「線が太くてはっきりとしたデザイン」でした。

https://www.pinterest.jp/pin/564216659564033090/
https://www.pinterest.jp/pin/564216659563960368/

そうしてできたのがこちら。
雑誌の表紙を飾りそうな仕上がりになりました。
とてもクオリティが高く、すばらしい出来になりました。

D2_dlbLUgAAb0F9

内容の練習

内容は決まりつつありますが、やはり一度軽くでもアウトプットをすると頭の整理になります。
ROPPONGI.swift 第7回に執筆内容について登壇しました。

その時の資料がこちら。

勉強会で登壇することで、「この内容を本にするよ」と宣伝することもできました。本の内容に興味のある人を増やしていきます。

目次の作成

目次が終われば執筆は終わりも同然といわれているほど目次は大事です。
いつもは漫然と書いてましたが今回は目次を先に作成してから執筆しました。
プログラミングに例えると設計に当たりますね。仕様と設計が終われば、あとは実装するだけです。

内容レビューをお願いする

一人で書いていては品質を担保できません。
誤字脱字、表記ゆれ、そのそも何を書いているのか分かりづらいといものは一人ではなかなか気づきません。
友達の田中さんと酒井さんにレビュー依頼をしました。
お二人ともお忙しい中すばやくフォードバックを頂きました。
おかげで大部分の誤字脱字をなくし、表記揺れを統一することができました。
お二人には感謝しています。

また、一度紙に印刷してざっと目を通すことも行いました。ディスプレイよりもおかしい表現をすぐ見つけることができてよいです。

値段設定

だれしも悩む値段設定です。
高すぎても配布冊数がへってしまいますし、安すぎて赤字になってもモチベーションが下がります。
技術書典6 技術書の作り方勉強会 ～執筆環境をワイワイはなそう～では他のサークルがどれくらいの値段をつけていたかを共有いただきました。

・細かい値段にするとお釣りを用意するのが大変
・PDFでも同じ値段にするところが多い

ということで以下のような値段設定にしました。

  • 書籍1000円
  • PDF1000円
  • 書籍+PDFセットで1500円

印刷

@shu223さんがこんな戦略で同人誌を執筆していました。

技術書でご飯は食べられるのか？ #技術書典 - その後のその後

印刷代の割増を恐れずギリギリまで書く
どんな時間管理術や仕事術を弄したところで、結局一番捗るのは締切間際、というのが現実かと思います。締切間際のあの集中力と決断力はプライスレスです。

ギリギリまで粘ると印刷代の割増料金がかかるといっても1日で5%程度、元の印刷代を仮に40,000円とすると、たかだか2,000円です。たったの2,000円で締切間際の集中力ブーストがもう1日分買えるなら買うしかない、と判断しまして、入稿を10%割り増し（2日延長）の10/4（技術書典は10/8開催）に行いました。この2日の作業で本のクオリティは50%はアップしたと思います。

一理あります。ギリギリにならないと人は動けないですからね。
ということで私も真似ることにしました。
通常締切よりも1日遅い10%アップのもので日光企画さんに印刷をお願いしました。
ちなみに日光企画は技術書典の公式バックアップ印刷所で、ここに頼むと各ブースの机の下に直接搬入することができます。

サークルチェック数と配布数が300までは連動するとのことで印刷を依頼した時点で70から80ぐらいでした。なので150冊を印刷することに決めました。

当日までの宣伝

書いてる本は当日までツイッターでつぶやいて宣伝しました。

執筆前に「どんな本を作るのか」をつぶやいたり、

表紙が完成した段階でつぶやいたり、

目次ができた段階でシェアしたり、

入稿が終わってからもつぶやきました。

ひのふさんもツイートしていただいて嬉しい限りです。

当日の接客

事前準備はできるところはしたつもりです。
あとは当日の呼び込み、接客です。
当日は妻も参加し、tanako（@tikidunpon）さんも応援に駆けつけてくれました。

基本的に興味がありそうな人がいたら、iPhone純正の地図アプリを見せて「これのUIを解説しました」 を繰り返えします。

今回良かったのはUIの解説なので、実際に動くものを見せて「これです」と説明できたところです。
すぐにお客さまも理解できて立ち読み、気に入ったら購入という流れができていました。

もちろん、事前にチェックしてすぐに購入する方も多かったです。

結果

当日はひっきりなしにブースに人が訪れていました。
嬉しかったのは表紙に惹かれて手にとっていただいた方が多かったことです。
「表紙がおしゃれ」と直接話してくれた方もいました。

アプリデザイナーの方も購入して頂いていました。またターゲットとしていた「デザイナーにも届くもの」が作れたのかと思い感無量です。

実際に販売したのは書籍、PDF合わせて１7０冊以上（セット含めて）。

何よりも嬉しいのはツイートやnoteで感想を頂いたこと！

noteでレポートを書いていただいた方もいらっしゃいました。

技術書典6に行ってきたレポート｜まりーな/iOSエンジニア｜note

結果

成功といっていいなじゃいでしょうか！
事前に考えたとおり以上の結果が得られました。

  • たくさんの人に手にとってもらえた
  • イベントが終わったあともツイートで感想もらった

読者の心に届くものが作れたかなと思います。

内容としては1章2章でハーフモーダルの概念、3章で実装の解説をする構成にしたのですがそれが良かったのかもしれません。
なかなかUIについて「それがどんな背景で作られているのか」を踏み込んで解説するものはありません。

また実装の解説も多くの人がライブラリーに頼っており、「じゃあプレーンな状態で作るとしたらどう組み立てるの？」というところを受け止められた結果かなと思います。

うれしいことにひのふさんに作成過程の記事も書いていただきました。

ひのふさんの制作過程note

反省点

出来なかった点も確かにあります。次に活かします。

  • サンプルコードがiOSであることを伝えるのが弱まった。前提と思ってしまった
  • 印刷代、次回は早割で安く仕上げたい（とはいえ、最後にならないとすすめられない）
  • サンプルアプリの作成が入稿ギリギリになった

まとめ

「ハーフモーダルで理解するFluid Interface」を読者に届けるためにやったことをまとめると以下の様になります。

  • 誰に届けるか、どんな感想をもらうのかをイメージして作る
  • 表紙大事。届けたい読者イメージで作る
  • 内容の品質を担保するため、同じ内容を勉強会で発表したり、校正レビューをもらう
  • 事前告知を頻繁にする
  • 当日のブース呼び込み完結にアピールする

作品を作るのは大変ですが、感想をもらうと作ってよかったと思えますね。
これからも同人活動続けていきたいと思います。

ぜひ皆さんも技術同人誌を作りたくなったらこの記事を参考にしてください。