じまろぐ

めめ

技術書典5でVue.js本を出してみた振り返りとか

はじめてのサークル参加

技術書典4で一般参加して「なんか出す側のほうが楽しそうだなぁ」と思ってサークル参加してみた。

大変なこともあったけど、結果的にめちゃくちゃ楽しめた。

頒布したもの

Vueのコンポーネント設計の本。テストのしやすさという観点から、これまでVueを使ってきて感じたアンチパターン的な話と、コンポーネントの分類、テストのやり方なんかを書いた。BOOTHでDL版販売中です（宣伝）

ponyhead.booth.pm

本にするネタ

今回はVue Fes JapanのCFPに出して落ちたネタがあったので、それを本にまとめる形にした。

「売れる内容を考える」みたいなのはしなかったけど、興味を引くようにタイトルは何個か案を考えて最終的に「後悔しないためのVueコンポーネント設計」にした。

執筆環境

PDF生成のために執筆環境構築が必要になる。

はじめは自力での構築を試したが、つらくて挫折した。結局TechBoosterのリポジトリをcloneして使った。

github.com

レイアウトもそのまま使って（見た目にこだわる優先度が低い）設定ファイル、表紙、本文だけ自前のものにすればPDF生成までできて楽だった。ビルドは用意されてるdockerコマンドで。

エディタはVSCode。Re:Viewプラグインは次のやつを使用。

marketplace.visualstudio.com

本文を書く

とにかく書く。お仕事で技術文書をそこそこ書いているのもあって、執筆自体が全く苦ではないのでスムーズに完了した。

CFPを出すときに練りまくったので、構成と内容の流れみたいなのはちゃんとできたかなと思う。CFPを書くときは次のやつを何回も読んだ。

blog.builderscon.io

今回本にした内容は、自分の経験から感じていたことや考えていたことを文章に起こす形だったので、無理なく書けた気がする。

ただ構成とかページ数の関係で削った内容がぼちぼちあるので、それはまたの機会に発散したい。

表紙を作る

表紙は妻にイラストを書いてもらった。

f:id:nakajmg:20181009153525p:plain

かわいいでしょ。

入稿する

本文と表紙ができたらあとは入稿するだけ。

今回は技術書典のバックアップ印刷所であるねこのしっぽさんを利用した。イベント当日にブースまで本を運んでもらえるの超楽なので助かった。

プランは「ねこスパーク」という締切遅めだけどそこそこ安いやつ。

入稿はまず申し込みフォームからページ数やサイズを入力、利用するプランを選択して申し込み。

その後、本文だけのPDFファイルと、表紙と背表紙をそれぞれPSDファイルでアップロード。アップロードしたファイルで印刷してOKですよ、というの印刷会社に伝えるUIがあるので入稿完了状態にする。

入稿完了後「コードブロックがはみ出してるけどこれは意図してるやつですか？直しますか？あと表紙用のPSDのサイズがちょっと合ってないから少し拡大しますか？ 」と確認の電話があった。

修正して再度アップロードして入稿完了の報告をWebで。その後もう一度電話があり問題ないとのことで無事印刷に進めた。

細かいところまで見てくれて大変助かった。また次もお願いしたいと思いました。

DLカードの準備

冊子のほかにPDFのダウンロード版も用意した。

印刷は名刺の印刷でググって出てきたとこに適当に決めた。

printsta.jp

入稿用のテンプレートがアプリケーションごとにあったので楽だった。

printsta.jp

表面に光沢のある用紙を選択したけど、出来上がりを見てマットなやつで角丸とかにしたほうがよかったかな？と思った。

DLカードの表面は表紙をそのまま使って、裏面にPDFをDLするためのURLとQRコードとZipファイルを解凍するためのパスワードを書いた。

個人名刺もついでに作った。

PDFファイルを置く場所

よくあるDropboxで〜ユニークなURLを〜みたいなのがめんどくさそうだったので、BOOTHにパス付きzipファイルを置いて0円でDLしてもらう運用にした。

ponyhead.booth.pm

下書き状態があるので、あらかじめ商品を登録してURLを決めておいて、そのURLをDLカードの裏面に印刷し、当日の朝に公開した。

技術書典の次の日からBOOTHでDL版を買えるようにしたかったので、あらかじめページを作っておいて次の日に公開処理だけすればよい状態にしておいた。BOOTH使いやすい。

事前に準備したもの

サークル向けガイドラインを読んで、ブースの設営に必要そうなものを準備した。

techbookfest.org

以下持ちこんだ物

  • お釣り（1000円札40、5000円札2）
    • 頒布物の価格は1000円のものだけ
  • 見本誌を立てるやつ*2
    • 見本誌を取ってもらいやすくするように2つ
    • 冊子売り切れたときには完売札を立てた
  • ポスター吊るすやつ
  • 机に広げる布
    • 布はあったほうが圧倒的にサークル感が出る
  • スケッチブック
    • 見本誌マークや完売札を作ったり、いろいろ使える
  • マッキーのセット
  • ハサミ
    • スケッチブックで書いたものを切り取る
  • 養生テープ

見本誌立てはなんとなく2つ用意していったけどわりと正解だったぽい。見本誌を結構読んでもらえた。

（自分の文字を書く能力はレベル1のまま止まってるので、全部妻に書いてもらった）

決済方法

今回使えるようにしたのは次の3つ。

  • 現金
  • 技術書典かんたん後払い
  • pixiv Pay

圧倒的に現金が多かった。お釣りの千円札をかなり用意したけど、1万円札or5千円札を出してきた人は合わせて6人くらいでほぼ使わなかった。参加者の人もお釣りがでないように崩してきてる感あってやさしい世界。

かんたん後払いは70部くらい。かんたん後払い用のQRコードは運営側で用意してくれていて、スタンドとして立てられるようになっていて大変よい感じだった。感謝。

pixiv Payは圧倒的に認知が少ないのか、使ってくれたのは6人だった。この利用人数だとサークル側としてはオペレーションが複雑になるだけなので、次回はなしかな〜？といったところ

被チェック数

自サークルの配置場所はこ32。サークルリストを見るとわかるんだけど、リストの下から9番目の位置。500近いサークルがある中でめっちゃ後ろの方にあるので、サークルリストからサークルカットでのチェックに頼ると伸びが悪いだろうなと思った。

ということでこのリストからのチェックはあまり重視せずに、Twitterからの流入で被チェック数が伸びるといいなと思って何回かつぶやいた。

つぶやくときは#技術書典のハッシュタグをつけて、出すものの内容とサークルページへのリンクをセットで。

被チェック数の推移

被チェック数は開催3日前くらいまではゆるやかに伸びて、そこから一気に増えた。

  • 9/12: 15
  • 9/27: 50
  • 10/2: 77
  • 10/4: 103
  • 10/7: 181
  • 10/8: 270

最終的な被チェック数は270。

f:id:nakajmg:20181009143359p:plain

これは読めない。読めないが、この伸び方は理解できる。

前回自分が買う側で参加したとき、サークルチェックしたのは前日の夜&当日の朝だった。早めにチェックしてるのは多分サークル参加する人たちで、一般参加の場合は直前にチェックするのが合理的な行動っぽい。

印刷の部数

今回は250部刷った。初サークル参加だし、Vue.jsというテーマに絞っていたので、自分のなかではかなり冒険した部数。

印刷の部数を決めたのが開催日の10日前くらいで、そのときの被チェック数が50。

被チェック数が50の段階で部数を250に決めたのはいくつか理由があって、一番大きいのは次の記事を読んでなんか大丈夫そうと思ったから。

note.mu

  • 気持ち的に印刷代だけ赤字にならなければいいかなと思ってた
  • 100刷るより200くらい刷ったほうがコスパよくなる
  • 250刷ると70ちょっと売れれば赤字ラインを超える
  • 在庫出たら出たでそのとき考える

という感じで、赤字じゃなければもうどうなってもいいやと思った。10日前で被チェック数50あるなら70以上はまぁ売れるでしょとかなり楽観的だった。

当日の結果

開始45分の時点で赤字ラインを乗り越え、14:30に冊子244部（見本誌とか自分用で6部）が完売。1分に1冊以上なペースで息つく暇もない感じで冊子が売り切れた。

見本誌を見ずに買ってくれる方もぼちぼちいたけど、見本誌を読んで買ってくれる人のほうが多かったかなという印象。この結果をみるに、Vue.jsというテーマの引きは結構強いんだなと認識を改めた。

冊子がなくなったあとはDLカードのみに切り替え。17:00の閉会までで30枚くらい。やはり物理本は強く、「冊子ないのか〜残念」となる人が多かった。

f:id:nakajmg:20181009162723j:plain

最終的な頒布数は合計で275部。すごい。

冊子がなくなったペースをみるに、たぶん物理本は400刷ってもちょっと余るくらいで済む感じのやつだったのかなと推測。

BOOTH公式のこのアナウンスがあと数日早かったら300部にしてたかも。

DL版

技術書典の翌日朝にBOOTHでDL版の販売を開始した。

とりあえず出すけどそんな売れないだろう、と思ってたけどそこそこのペースで売れててびっくりしている。

いろいろな人に届いてる感じで嬉しい。BOOTH使いやすいし、技術書が売れる土壌が育ってる気がする。

次回へのあれこれ

  • 書きたいことは書ききる
    • 入稿してから「削ったあれやっぱ無理やりねじこんでもよかったな〜〜〜」はもったいない
    • 多少構成が崩れても書きたいことを書こう
  • サークル参加の申し込みをした段階から準備する
    • 当選してから書きはじめると少し苦労するぞ
    • 落ちたら誰かのとこに委託するくらいの意気込みで
  • 見本誌は透明なカバーつけるといいかも
    • 「見本誌」マークをテープで貼ったら表紙剥がれて悲しい
    • というか表紙の仕上げをツルツルのやつにしたほうがいいかも
  • 名札作っていったほうがよさそう
    • ただでさえアイコンと顔が一致しないので認知してもらうためにもあったほうがいい

次回サークル参加するとしたら

  • Slackクライアントの作り方
  • Functional Vue.js

のどちらかをテーマにしようかなと考え中。

おわりに

とにかく楽しかった。終わったあとに妻と飲んだビールは最高においしかった。

ブースに来てくれたみなさまありがとうございます。戦利品の写真に自分のが写ってると嬉しいですね。ブースに来てくれた人の中に「これを買うために技術書典きました」と言ってくれた人がいて、なんだよ最高のイベントかよと思いました。

購入報告とか感想とかありがとうございます

Twitterで購入報告とか感想を書いてくれてる人がちらほらいて感無量でございます。ありがとうございます😭

こういう感想とか反応がもらえるとめちゃ嬉しいし、書いてよかったな〜。

自分のに限らず、本を手にした人たちは一言でもいいので感想をつぶやくと著者の人がめっちゃよろこぶと思います。

自分がゲットした本については別途感想を書きます。

おつかれさまでした。