遠近法ノート(移転してきた)

本好きのデザイナー、西岡裕二の日記帳なのです。デザインと読書について書くはず。

『WEB+DB PRESS総集編[Vol.1-72]』が出たので、自分とWEB+DB PRESS編集部との関係をちょっと書いてみる。

表紙と中面のデザインを担当した『WEB+DB PRESS 総集編〔Vol.1~72〕 (WEB+DB PRESS plus)』が出ました。
技術評論社WEB+DB PRESS編集部さんとは、もうずいぶん長いおつきあいになるのですけど、この機会にちょっとその辺のいきさつをまとめておこうかなと思います。

ごにょごにょの事情で……

最初に担当させていただいた本が何だったのかよく憶えていないのですけど、転機になったのはこれ。『Debian GNU/Linux Expert』(2004年)。表紙と中面のデザイン・DTP作業まるごと担当しました。

Debian GNU/Linux Expertデスクトップユーススペシャル

Debian GNU/Linux Expertデスクトップユーススペシャル

受注に当たって、ごにょごにょの事情があり「全部InDesignで作ってよければ」等、いくつかの条件を出したのです。結果、引き受けることになったんですけど、それはすなわち「誰の協力も得られない」ということも意味していました。当時、勤めてたデザイン事務所内でInDesignを使っていたのは、自分一人だったので……。
作業は大変ではあったのですけど、そこはそれ、タグ付きテキストの自動処理、表組みなど、InDesignで作る利点をバリバリ生かして、結果としては、効率よくきれいな誌面を作ることができました。
2004年に雑誌(書籍だけど)丸ごと1冊をInDesignで作ったのは、まあまあ早いほうだと思います(講談社の『ファウスト Vol.1』が2003年でしたね)。
当時の限界で使用書体がヒラギノと小塚に限られていたりするものの(モリサワパスポートはなかったけどフォントワークスLETSはあったので、アウトライン化して少し使ってる)、今見ても我ながらよく出来てます。
自動処理に関しては、Jeditで置換テーブルを用意し、支給されたテキストに入っていた全角記号等をInDesignタグに一括置換して流し込みしていました。
ほぼ一人でよく作れたもんだ。
表紙の写真も自分で撮ったもので、わりと気に入ってます。
あと、まったく余談なんだけど、眼鏡っ娘理系美少女編集者(当時)なんてほんとにいるんだなーと思いました。

体調崩した

これに続いて同系統の『Linuxソフトウェアアンテナ』(2005年)、『LDAP Super Expert』(2006年)や、いくつかの書籍を担当させていただきました。

Linux ソフトウェアアンテナ

Linux ソフトウェアアンテナ

LDAP Super Expert

LDAP Super Expert

しかし、いろいろとうまくいきそうだった2006年、過労から体調を崩してしまいました(いま考えるとなんかわかりやすいなぁ)。以後、仕事を減らしてもらって、社内的には半分ドロップアウトしたような立場になりました。勤務時間が短くなった(それでも9時5時じゃないんだけど)おかげでアニメ見たりできるようになった、というか、当時の自分にはそういうのが必要だったんですね、ええ、たぶん……。これ、30代で深夜アニメ見始めるという典型的なパターンですよ。

さて、体調を崩して各所にご迷惑をおかけしたものの、ありがたいことに技評さんにはだいぶ信頼されてきたようで、この頃にはご指名(?)で仕事がいただけるようになっていました。
WEB+DB PRESS総集編[Vol.1-36]』(2007年)は、『Debian GNU/Linux Expert』からの流れで表紙と中面のデザイン・DTP作業を担当。表紙に「総集編」の文字をでっかく入れたのがミソです。

WEB+DB PRESS 総集編 [Vol.1~36]

WEB+DB PRESS 総集編 [Vol.1~36]

それから、WEB+DB PRESS plusシリーズ。『小飼弾のアルファギークに逢ってきた』(2008年)などの単発書籍に、今やWebエンジニアの皆さんにはおなじみとなった「支える技術」や「実践入門」は、『Googleを支える技術』(2008年)以降、カバーと中面のデザインを担当してます。以前の仕事と違う点は、plusシリーズでは自分が本文組版をやらず中面はフォーマットデザイン提供のみということ(←ここ重要です)。plusシリーズについてはたぶん別の機会に書くと思います。
Googleを支える技術 ?巨大システムの内側の世界 (WEB+DB PRESSプラスシリーズ)

Googleを支える技術 ?巨大システムの内側の世界 (WEB+DB PRESSプラスシリーズ)

WEB+DB PRESS』本誌について

……とまあ、こういう実績の積み上げがありまして、2008年に『WEB+DB PRESS』本誌のほうのリニューアルというかInDesign移行の相談を受けました。
具体的には、InDesignで作成した中面のフォーマットを納品しました。
2008年のVol.45から、見た目はあまり大きく変えずに(本文書体等は変更しています。ご興味をもたれた方は、収録PDFでそれ以前のものと見比べてみましょう。ちなみに、はまちやさんの連載が始まったのがVol.44、竹原さんがマンガ描いてて驚きましたよね?)、InDesignでの制作にほぼ移行完了しています。そういったわけで、このVol.45以降、目次に「本文フォーマットデザイン……西岡裕二」と入っています。本誌の仕事はこのときだけで、名前は入っているものの、毎号何かをしているわけではありません(←あんまり儲かってない)。

WEB+DB PRESS Vol.45

WEB+DB PRESS Vol.45

それでは、僕が納品した「本文フォーマット」とは何かというと、本文の級数、書体、字詰めその他諸々のルールを設定してあるInDesignの書類、です。自動処理がしやすいよう、後の作業がしやすいよう、版面がきれいに見えるよう、これまでに得たノウハウをぎっしり詰めこんでいます。
この書類、ぱっと見に表れないところを作り込んでいるので、たぶん、普通の編集者さんだと、どれほどの価値があるのか分からないと思います。フォーマットと称して、見た目それっぽいだけのデザインラフが支給されたり、知らないうちに流用されたりということが起こる世界ですから……。
ともあれ、WEB+DB PRESS編集部では、僕が設定した本文フォーマットを運用して、効率よく誌面を作り上げているわけです。その手法は先頃GitHubにて公開されており、さらに、マークダウン記法からInDesignタグへと置換するプログラムを伊藤直也さんが作っています(今号の誌面を見るとまだ若干問題が残ってるようですけど次号では修正されると思われます)。
WEB+DB PRESS』の本文フォーマット、納品してからもう5年経つので、ほんとはいろいろ手入れしたいんですよねー。


フリーランスになった

デザイン業界では、30過ぎて会社を移るのはほとんど不可能のようです。だから、20代で下地を作って30くらいで独立、というのが、まあ、暗黙のお約束なんですね。少なくとも90年代まではそうだったようです。が、ゼロ年代はなんだか独立するという空気でもなくって、仕事が忙しすぎて何かを考える余裕もなく、おまけに体調を崩したりなんかして、僕はずるずると会社に居続けてしまった。でもやっぱり、睡眠時間4時間で平気な社長の下で長くはやっていけないし、半端仕事ばかりが降ってくる状況ではデザイナーとして未来が見えませんでした。
もともとあまり独立願望はなかったんですけども、そんな事情で2011年にフリーランスになりました。
ちなみに、社長は僕が辞めた半年後に亡くなりました。

最初のお仕事

で、フリーになって1年くらいは仕事がなくてもしょーがないだろうなーとか思ってたんですけど、ありがたいことにお仕事の依頼はありまして、ほぼ初仕事になったのが『WEB+DB PRESS総集編[Vol.1-60]』(2011年)でした。あれからもう2年かー。

WEB+DB PRESS 総集編 [Vol.1?60]

WEB+DB PRESS 総集編 [Vol.1?60]

はてなーなので

いつのまにかWEB+DB様御用達(もしくはギークの皆様御用達?)みたいになってますけど、プログラマでもない自分がついていけてるのは、はてなーだからなんです。いやほんとに。
業界の動向とかおおよそわかる(あまり詳しく知ってる必要はない)から、だいたい話が通じるし、InDesignで段落スタイル作るの、あたかもCSSを編集するように操作しています(←仕様が違いますので、そのつもりでやるとケガします)。
CSSといえば、2004年ごろには、はてなダイアリーの公式テーマを作っていまして(バイト代も出ました)、いいのか悪いのか、あれでバグ回避のコツを身につけたような気がします。当時のそれはブラウザの制約が厳しくCSSハックだらけなので、今となってはあまり使って欲しくないんだけども……。

WEB+DB PRESS総集編[Vol.1-72]』

そんなこんなで『WEB+DB PRESS総集編[Vol.1-72]』です。例によって表紙と中面のデザインを担当しました。
今回は、表紙にバックナンバーの書影をずらっと並べてみました(小さいですけど)。「この号買い逃してた」とか、「先輩に借りて読んだっけ」みたいな感じで、あらためて手に取ってもらえればいいなと思います。

WEB+DB PRESS 総集編〔Vol.1~72〕 (WEB+DB PRESS plus)

WEB+DB PRESS 総集編〔Vol.1~72〕 (WEB+DB PRESS plus)

以上、WEB+DB PRESSと自分の関係を書いてみました。
誤解のないように付け足しておくと、僕は技評の中の人でも専属でもありませんので、他の仕事もやってます! ご依頼歓迎なのでよろしくなのです!

最近手がけた本『アニメーショングラフィックス 2013』

CGWORLD誌のアニメ記事をまとめたメイキング本です。
表紙と中面のフォーマットデザインを担当しました。姉妹本である『ゲームグラフィックス 2012』を踏襲しつつ、新しく工夫も入れて、いい感じの誌面に仕上がってると思います!

さてさて、ほんの数年前まで日本のアニメにおいて3DCGは、画面の賑やかし、ある種の省力化として、部分的に使われていたものでした。
それがここ数年のうちに、絵作りに欠かせない要素となってきました。CGエフェクトや3Dでアニメの絵がだんだんリッチになってきているのは、素人目にも明らかですよね。
特に、今年放映されたいくつかの作品では、3DCGの使い方が日本アニメ独自の方向に照準を定めてきたと感じます。
それは、手書きの作画がリアルな3DCGに取って代わるのでは、まったくありません。
リアルな3DCG……というのは、ルネサンス遠近法の延長線上にある「作図」の技法です。作図はいわば数学的な問題であって、いかに精確に描いたとしても、それはそれだけのもの。その行き着く先はまあ、FPS的世界でしょうか*1
日本のアニメは、もとから、そうじゃない方向に舵を切っています。ウソのないリアルではなくて、虚構的なリアルのほうを取る。3DCGも、より「ウソをつく」方向へと、確信を持って進んでいるわけです。
過渡期の作らしく二つの世界の半分を3DCGで描いた「ブラック★ロックシューター」、MMDっぽくてなおかつ手描き絵のように見える「スマイルプリキュア!」ED、背景を動かすことで情感を表現した「おおかみこどもの雨と雪」、ウソをつくのが難しい3D立体視に挑戦した「009 RE:CYBORG」などなど……*2
一視聴者に過ぎない僕は驚きつつ見守るばかりなんですけども、まだまだこれからの進化が楽しみでもあります。

*1:もちろん、そっちはそっちで突き抜けた作が出てきてますが。

*2:本書には出てませんが「記憶の映像」を描いてみせた「ねらわれた学園」も印象的でしたね。

最近手がけた本『ゲームグラフィックス2012』。

ゲームグラフィックス 2012 CGWORLD特別編集版 (Works books)

ゲームグラフィックス 2012 CGWORLD特別編集版 (Works books)

ロゴタイプ、表紙と中面のデザインを担当しました。

ロゴはオリジナル描き起こしです。
普通の明朝体っぽく見えるかもしれませんけども……


これに賭けるっ

ぐらいな気分で描いたつもり。
このころちょうど『デザインのひきだし16』のもじ部に参加したあとでしたので、フォントワークスの藤田さんがおっしゃっていた、
「アンカーポイントを少なく」
「曲線の頂点にアンカーポイントを置かない」
を意識しながら曲線を引きました。


▲つまりこうじゃなくて、

▲こうってことです。

こうすると曲線がきれいに書けて、調整もしやすいの。

最近手がけた本『例解小学 四字熟語辞典』。

三省堂 例解小学四字熟語辞典

三省堂 例解小学四字熟語辞典

こちらは本文デザインのみ手がけました。
『例解小学 国語辞典』『例解小学 ことわざ辞典』などに続くお仕事です。
本文デザインというのは、この場合、InDesignで見本組みを作って指定(いわゆる写植指定)を書き込む、というもの。最終的には専用機で作っているようです(詳しいことは分かりません。知ってても僕が書くわけにもいかないので)。
実際には使用しない見本組みではあるものの、十数ページはできあがりと見た目そっくりに作ります。ルビも入ってないと雰囲気がつかめないから、それなりに大変。
本文以外のページではInDesignで作ったデータをそのまま入稿してるとこもあります。
三省堂 例解小学国語辞典 第五版

三省堂 例解小学国語辞典 第五版

三省堂 例解小学ことわざ辞典

三省堂 例解小学ことわざ辞典

三省堂 例解小学漢字辞典 第四版

三省堂 例解小学漢字辞典 第四版

このあいだ読んだ『舟を編む』の流れで行けば、次はもっと本格的な辞書の仕事が……来ればいいんですけども!

最近手がけた本『データベース技術[実践]入門』。

Webエンジニアのための データベース技術[実践]入門 (Software Design plus)

Webエンジニアのための データベース技術[実践]入門 (Software Design plus)

例によってカバーデザインと本文フォーマットを担当してます。
Amazonで見る限り、売れ行きは好調のようです。連載がまとまるのを待っていた人も多かったのでしょうか。

さて、今回は本文設計について少しだけ。
よくある技術書の一冊に見えるかもしれませんが、僕が手がけている本はそこいらの技術書とは違いまして、あらゆるノウハウを投入しています。いや、ほんとです。
そのひとつが……ノド*1を広めに取ってあること。
こちらはこうなってます。

横組み本だと、下のような感じがありがちなんですけど、これではどう見ても読みづらいですよね。

だいたいにおいて、横組みの本はノドが狭すぎ。というか、横組みの本って、そもそもデザインされてない本が多すぎる気がします。そのへんは僕が変えていきたいと思っているところではあります(まあ読む本は9割がた縦組みの本なんですけどね……)。

*1:本の綴じてる側、開いたときの真ん中のことです。

最近手がけた本『Emacs実践入門』。

Emacs実践入門 ?思考を直感的にコード化し、開発を加速する (WEB+DB PRESS plus)

Emacs実践入門 ?思考を直感的にコード化し、開発を加速する (WEB+DB PRESS plus)

例によってカバーデザインと本文フォーマットを担当してます。
Emacsといえばギークの皆様に愛用されてるエディタですよね。
自分の理解によれば、WebではEmacs派とVim派がきのこ派たけのこ派のようにDisりあってるというイメージなのですが、間違っておりますでしょうか……。
冗談はさておき、とりあえず、

これで勝つる!

……という感じのデザインにしたつもりです。ええ。
あまり深い意味はないのですけど(強いて言えば例のロゴとEとmのかたちとか環境とか速さとか、そんな連想から)、三本の線を川の流れっぽく入れました。

最近のお仕事。

『日本語入力を支える技術』はそろそろ店頭に並び始めたよう。『Jenkins実践入門』は紹介が遅れましたが去年の発売でした。
おなじみな人にはおなじみの、WEB+DB PRESS plusシリーズです。
カバーデザインと本文のフォーマットデザインを担当させていただいています。
シリーズものということで、レイアウトはあまり変化ないのですが、毎回、帯のところには何かしらのビジュアル要素を入れることにしています。
これはまあ「何か入ってるな」という程度の目立たない飾りなんですけど、何もないと他の本と見分けがつきにくくなるわけで。本の内容と結びついて記憶に残るようなイメージがいいなぁと、それなりに考えているんです、はい。

日本語入力を支える技術 ?変わり続けるコンピュータと言葉の世界 (WEB+DB PRESS plus)

日本語入力を支える技術 ?変わり続けるコンピュータと言葉の世界 (WEB+DB PRESS plus)

で、こちらは楓の絵図。
言葉とか、分岐するイメージで葉っぱがいいかなと思い、調べるうちに、イロハモミジというのがありました。分かれた葉をイロハニホ……と数えるのだそうで。
楓(紅葉)は和歌にもよく詠まれてますし、日本語を想起するものとしてふさわしい感じがしてきて、これを採った次第。
Jenkins実践入門 ?ビルド・テスト・デプロイを自動化する技術 (WEB+DB PRESS plus)

Jenkins実践入門 ?ビルド・テスト・デプロイを自動化する技術 (WEB+DB PRESS plus)

歯車の図が入っています。ただし、歯車そのままではありがち過ぎますので、飾り罫線を円にして入れました。Jenkinsの公式キャラ(?)は執事ということで、某ミステリなどを思い浮かべたりなんかしながら、配色もどことなく英国を感じさせるふうに作っています。