CrossRoad

XRを中心とした技術ブログ。 Check also "English" category.

【技術書典14】はじめて物理本と電子本を一緒に作成したときのTipsあれこれ

先週より技術書典14が開催されています。

私が所属しているBabylon.js 勉強会では、前回の技術書典13に引き続き「Babylon.jsレシピ集 Vol.2」を頒布しました。コンテンツ以外の前回との差分として、今回は物理本の作成、現地会場での販売に挑戦してみました。

この記事では、技術書典事務局が提供するテンプレートを使って、電子本と物理本を準備するための手順やTipsを紹介します。

1. 技術書典とは

こちらのイベントです。技術書に限定したオンラインマーケット・現地会場イベントです。時期は若干ずれますが、だいたい半年に1回のペースで開催されています。

techbookfest.org

2. 技術書典向けの本を執筆するには

特に指定はありませんが、技術書典の事務局からはRe:VIEWと呼ばれる記法で執筆するためのテンプレートが公開されています。

github.com

これをクローンして使うのが便利です。

Re:VIEWの書き方、pdfビルド方法などは調べると色々と出てきます。参考のため、前回出展時の準備関係をまとめた記事を貼っておきます。

www.crossroad-tech.com

3. Re:VIEWテンプレートを使って印刷用データを作る方法

pdfビルドができることを前提にします。私の場合はdockerを構築して使っていました。

参考までにdockerでのpdfビルドの方法を記載します。まず、以下をトップディレクトリで実行してDocker環境を作ります。

$ docker pull ghcr.io/vvakame/review:5.4 (ghcrからのダウンロードの場合)
$ docker pull vvakame/review:5.4 (Docker Hubからのダウンロードの場合)
$ ./build-in-docker.sh

同じくトップディレクトリでこのコマンドを実行すると電子本のpdfが生成されます。

$ REVIEW_CONFIG_FILE=config-ebook.yml ./build-in-docker.sh

An ebook sample generated by ReVIEW template

同じ階層にあるconfig.ymlを指定して、同様のコマンドを実行すると、物理本のpdfを生成できます。

$ REVIEW_CONFIG_FILE=config.yml ./build-in-docker.sh

A printed book pdf generated by ReVIEW template

電子本と物理本では生成結果が異なります。

電子本は表紙と本文を全て含んでいますが、物理本は本文のみです。

また、物理本は「トンボ」と呼ばれる印刷用の枠がついています。技術書典事務局から公開されているRe:VIEWテンプレートでは、上記のconfig.ymlを指定してビルドするだけで、印刷会社さんに渡すための原稿をビルドできます。

設定についてはconfig.ymlにある、この部分を有効化しておけばOKでした。

# A5の設定(9pt 38文字×37行) - 紙版
texdocumentclass: ["review-jsbook", "media=print,paper=a5,serial_pagination=true,hiddenfolio=nikko-pc,openany,fontsize=9pt,baselineskip=13pt,line_length=38zw,number_of_lines=37,head_space=15mm,headsep=3mm,headheight=5mm,footskip=10mm"]

4. 表紙の作成

今回初めて知ったのですが、本の厚さによって印刷方法が変わります。平綴じ (印刷会社さんによって無線綴じと呼ぶこともあり、そうでないこともあるようです)、中綴じなどの印刷方法があります。

印刷方法については、この辺に解説があります。
www.lowcost-print.com

今回は120ページ近くあったのでホッチキスで製本する中綴じは使えず、平綴じで印刷を依頼しました。この場合、表紙・背表紙・裏表紙の3つを準備する必要があります。これらは1つのPhotoshopファイルで作成します。

表紙データは印刷会社さんの指定条件で作ります。今回は日光企画さんに依頼しましたので、本文と同じサイズのテンプレートファイル (psd形式) をダウンロードします。

【トンボダウンロード】オフセット用

こちらの記載を見て、メンバー内で背表紙の厚さを計算して表紙ファイルの中で調整しました。
背幅計算の方法

表紙については、上記のテンプレート枠内に収まるように記載すればOKです。
なお、もう1点、解像度には注意する必要があります。

日光企画 よくある質問

こちらによると、フルカラー表紙の解像度は350dpi推奨とされています。
PhotoshopやIllustratorでは、意識して350dpiにしておかないと低めの解像度になってしまうことがあります。低い解像度の場合、PC画面では違和感ないのですが印刷してみると粗く見えてしまう懸念があります。

また、表紙データにラスター画像を貼る場合、350dpiになっているかを注意する必要があります。もちろん、計算式によって描画するベクター画像 (例:拡張子がsvg) であれば気にしなくても大丈夫です。

5. データを入稿する

技術書典の場合、「日光企画」さんと「ねこのしっぽ」さんがバックアップ印刷所として指定されています。できるだけどちらかの会社さんに依頼することをお勧めします。 オンラインで入稿手続きが完結し、当日会場に納品していただけるためです。

基本的な準備や進め方は、こちらの記事がとてもわかりやすいです。

【技術書典】日光企画に持ち込み入稿する方法

この記事では、データを直接店舗に持ち込んでいます。完全オンラインで対応するには、以下のように進めます。
執筆が進み、ページ数が確定したら開始します。

・日光企画HPからアクセスできる「にこぷり.com」にアクセス
・必要事項を入力して見積もり依頼を出す。このとき、技術書典会場の住所、サークル番号 (今回は「こ10」)を指定欄に記載する
・入稿データを準備する (具体的には、自分のリポジトリで紙版として出力したpdfと、表紙・背表紙・裏表紙を全て描いたpsdファイル。不要レイヤーを削除し、全レイヤーを統合した状態)
・入金する (銀行振込だと5%オフになります)
・後日、日光企画さんからの「受付しました」メールを受け取ったら完了

「にこぷり.com」での申込み画面です。

An order form example of Nikopuri.com

「オンデマンド平トジフルカラーセット」とありますが、「フルカラー」は表紙のみです。

NPホワイトは、光沢がつく用紙です。
クリームキンマリは、本文の紙に使用しました。ほんの少しだけ黄色っぽい色の紙です。

なお、今回の申し込みを行ったときは、アクセス集中のためか「にこぷり.com」の画面遷移がものすごく遅かったです。1つの選択肢を選んでから30秒以上何も変化しないときもありました。

もしボタンクリックしても反応ない場合、待っていれば選択されて次のオプション選択にすすめるようになります。

また、途中で変更後の修正が間に合ってないためと思われますが、にこぷり.comの画面で指定された口座番号は使えませんでした。

こちらのページにある番号であれば振り込み成功しました。
Bank transfer info on NikkoKikaku

http://www.nikko-pc.com/sub/shiharai.html

入金すると、1日程度で登録したメールアドレスに返信が来ます。私の場合、Photoshopのレイヤー統合を忘れていたので修正してほしいという連絡がありました。

修正版を指定場所にアップロードして返信したところ、2日程度で受付ましたという返信が来ました。

以後は特に連絡はなく、技術書典14のオフライン会場イベント当日に、ブースへ印刷した本が置かれておりました。

「日光企画」で調べると、丁寧に対応いただけたという記事が出てきます。私も同じ感想でした。次回もお願いしたいと思いました。

6. おまけ: Babylon.js勉強会の出展内容

今回は、Babylon.js レシピ集 Vol.2を出しました。

techbookfest.org

このような内容です。

■目次
第1章 ChatGPTで気軽にBabylon.jsを体験してみよう
第2章 IoTとBabylon.jsによるデジタルツイン
第3章 業務アプリに3DCGを扱う事で生まれる可能性 2
第4章 バーチャルとリアルのピアノを同期して演奏する
第5章 お手軽実装 オンラインエディタのGlitchでBabylon.jsラクラク実装
第6章 Node Material Editorで自作シェーダを背景アートワークとして使用する
第7章 Figmaで作った画面レイアウトをBabylon.jsで表示させてみよう
第8章 あの最強物理エンジン Havok が Babylon.js で!

■著者
cx20 (@cx20)
かーでぃ (@_0447222690292)
ヤス (@Ykoba791)
turamy (@turamy3D)
ricky (@N1809031125)
にー兄さん (@ninisan_drumath)
Limes (@limes2018)
やまゆ (@akai_inu)

■表紙デザイン
ちょまど (@chomado)

技術書典14の期間中、5/21だけ現地会場イベントがあります。イベント当日は準備した物理本を無事完売できました。お買い上げいただいた方、ありがとうございました。

また、英語でイベントレポートを書いてフォーラムに投稿したところ、なんとBabylon.jsの生みの親であるDavid Catuheさんに購入いただきました。

■英語版レポート www.crossroad-tech.com

■Babylon.js Forumの投稿
2nd Babylon.js recipe book from Japan - #10 by Deltakosh - Off topic - Babylon.js

共同執筆者のかーでぃさんには、当日の売り子をご担当いただきました。かーでぃさんの参加レポートはこちらです。
note.com

7. おわりに

同人誌印刷が初めてだったので、直前の印刷関係準備や変更が少し大変でした。しかし、今回の流れでやり方はわかったので、次回はもう少し効率的にできそうです。

次回の技術書典15は2023/11/12予定のようです。

今のところ、Babylon.js レシピ集 Vol.3を出すような気がしています。Babylon.jsに興味がある方、ぜひBabylon.jsのDiscordにもご参加ください。また、毎回書籍執筆が初めてという方が含まれる中で共同執筆しています。執筆にご興味があればぜひご連絡ください。