Making of "至って普通のWebカメラ"展示 - MFT2016出展記

2016年8月12日金曜日

MFT出展報告

8/6-8/7に開催されたMFT 2016(Maker Faire Tokyo 2016、図1)からぼちぼち1週間が経つので、忘れないうちに振り返りと反省と、そして夏コミ3日目で出る同人誌の宣伝をします。
図1 MFT 2016会場の図

出展したもの

中身のデジタル回路をScala+Chiselで一部自作したWebカメラ(図2)展示と、関連する12ページのコピー本(Scalaでハードウェアを設計するはじめの一歩!、図3)の無料頒布です。
図2 展示したWebカメラっぽいもの

準備にかかった期間

社内で最初に出展の話が出たのは4月の下旬だったと記憶しています。
実際の作業にかかったのは展示のおおよそ8週間前、そこからコミケの原稿準備と並行して休日を突っ込み続けて完成へ至った、というタイムラインです。

準備の流れ

基本的に「実現したい夢仕様」から現実的なラインまで仕様を削っていく作業でした。
お題の大本は4/25発売のFPGAマガジンNo.13掲載の記事です。TMDS変換と出力データのシリアライズをおこなう回路の作成を作成してあとは展示待ちというところでした。が、前日に「コピー本を作って配布したいなぁ」と思いました(図4)。
図4 Slackでふと思いつきを書いたところ
そういうわけで今回は物理パート、論理パート、勉強パートの3面、それと最後に加わったコピー本の順で準備段階のあれこれを紹介します。

物理パート

カメラモジュールを入手してブレッドボード用ワイヤなどで配線

最初にカメラモジュールを注文したのは6月上旬です。この時はOV5642という少々高性能なモジュールを入手しました(お高かったです)。軽く手元のワイヤを投入して接続、動作確認し、「これは配線ノイズでかいので基板を起こさないと厳しい」「早晩モジュールをぶっ壊す」と考えました。
OV5642よりもと、多少扱いの面でも楽(コマンド体系が8-bit列なので)なOV7670を1つ購入し、さきの仮組み状態で仮動作確認しました。これは、まあまあいい感じに動きました。OV7670はOV5642の半額程度で入手できるので、最悪破壊しても泣かずに済むというのもありました。

基板の設計と発注

KiCadで雑基板のスライドを読み、ついに「ああぁぁ、KiCadってこういうことだったの!!」というアハ体験(古い)をしました。
6月下旬、Elecrowへと基板の注文(注文オプションは4-7 days, Shenzhen DHL)をおこないました。なんと2日後には「発送したやで~」というメールが届き、その週内に入手できました。DHLのセンター(最近新しくなったっぽい)へ出向いて荷物をピックアップするという体験、個人的に割と楽しかったので、回を改めて書きます基板をピックアップした足でそのまま秋葉原へ向かい、秋月と千石を回ってコネクタを入手しました。今回は基板上に抵抗もコンデンサも実装しない、単純に可搬性と配線の確実性を確保するためのものなので、そういう感じです。
これ、実は技術書典の日なんですね。とにかく急いで確認せねばということで基板にコネクタをハンダ付けして動作させてみました。

基板の動作確認

OV7670をつないだところ、なんだか動きません。そもそもカメラモジュールの電源が入っていないような挙動です。
元々動いていたユニバーサル基板ベースのものに挿し替えてみても、どうにも反応がありません。
状況を追うこと数十分、コネクタの向きを完全に間違えていた事に気づきました。
これはカメラモジュールを破損させてしまったかなと、恐る恐る(何度も確認して)OV5642を逆向きに挿したところ、少なくともノイズ入りの映像は取得できました

基板失敗からの現実逃避

OV7670を破損させたショックと基板設計ミス(確認は何度かしたつもりだった)のショックでその日は作業をやめて、ひとまず技術書典へ向かいました。
余談ですが、途中で
のアナウンスを見て焦りました。
なんとかギリギリ整理券を確保できた図です。
技術書典から引き上げた後は、さきのショックの影響で数日呑んだくれました。

基板設計リトライ

翌週半ばに気持ちが復活し、直した版の基板設計を仕上げました。そして追加注文したOV7670(今度は念のため2つ買いました)を使って前の基板の表裏逆版がきちんと動作することを確認したうえで入稿しました。特に今回の場合は関係ないのですが、チュートリアル動画の出来がよかったので等長配線(差動ペアではない)とskew調整も込みでやってみました。
図5 KiCadでの回路設計リトライ版
余計なことをした結果またミスってたらどうするかというのは考えました。しかしここらはいろんな仕組みを試してはショット撃ってなんぼです。最悪ダメだったらもう一度いそいで作り直し、Elecrowの特急コースへ金の弾丸を叩き込む覚悟をしていました。PCBのCADデータ入稿時点で6月の末、今回はちょうど1週間程度で発送通知がきました。これで7月の上旬まで溶けた格好です。

リトライ版の動作確認

届いた基板の動作確認をして、問題ないことをあっさり確認できました。
展示の1ヶ月前にはハードウェア側をfixして残りはソフトウェアに充てたいと考えていたので、この時点で時間切れです。いい感じの筐体なども用意することなく、基板強度を活かして剥き出し展示でいくこともほぼ決まりました。コミケ向けの記事執筆に十分な時間を取らないとクオリティ面で問題が残りそうというのも見えていました。

論理パート

前半はコミケに向けて記事を書く傍らでほぼFPGAマガジンNo.13に掲載のままのコードを動作させていました。部品を注文して届くまでの間や基板を発注して届くまでの待ち時間は記事執筆にあてました。
ソフトウェアに関しては、NiosII/eプロセッサからSCCBの16-bitコマンドインタフェースでOV5642をコンフィグするあたりに結構時間を費やしました。しかし物理パートで述べたようにOV7660での動作を先に安定化しないとまずい状況になってきたため、結局コード的にはほぼ雑誌掲載コードのダウンロード版のまま開発を進める方針へと転換しました。
その後、夏コミ用の記事が進捗すると共に、Chisel版のTMDSコードも進捗しました。Chisel版のTMDS変換コードを書き上げてからしばらくは放っていて、休み(いわゆる毎年捨てられてしまう年休)を2日確保してシリアライズ回路のChisel化をおこないました。さらに、PCがなくてもコンフィグ済み状態でFPGAボードを起動できるようにpofファイルを作成してフラッシュメモリ領域へ書き込んで完成ということにしました。

勉強パート

Chiselの各種ドキュメントは、この期間中にあるだけ全部読みました。UCBでのアサインメントの資料なども参考になる部分は一定ありましたが、このあたりは今後紹介してみたいところです。

FPGAマガジン No.13

AlteraのMAX10シリーズFPGAをさまざまに利用するという特集号です。昨年購入したBeMicro Max10がちょうどそのまま使えるな、ということで展示物を考えるヒントになりました。

実用HDLサンプル記述集―まねして身につけるディジタル回路設計

知識と経験の不足を補うために最初に買った本が「実用HDLサンプル記述集―まねして身につけるディジタル回路設計」です。これは良い本なのですが、読み進めるうちに自分が必要としているのはもう少し手前から紹介している本じゃないかなー?と考え始めました。

HDLによる高性能ディジタル回路設計

その後、7月に入ったあたりで「HDLによる高性能ディジタル回路設計 - ソフトウェア感覚を離れてハードウェアを意識する」を買って読みました。
この本は、デジタル回路に関する理解の足りないところを補ううえで大変役立ちました。特にメタステーブル現象など回路動作を不安定にする要因の説明と対策の章が素晴らしいものでした。
また、これまでデジタル回路系はVerilog HDLで書いてきたため、読み始めには「えー、VHDLなのーー?」と思っていました。しかし読み終わる頃にはどっちでもよくなっていた(一定範囲のコードであればVerilog HDLでもVHDLでも問題なく読めるようになった)ので本当にありがたい本です。

コピー本から当日入場まで

思いつき

MFTの会場で新作のコピー本を配布して、あわよくばコミケでのTechBooster本(特にThe Web Explorer 2)の宣伝をしようと思い立ちました。思い付いたのが前日だったので、取り急ぎTechBooster代表のひつじ(@mhidaka)に「記事の冒頭4p収録したいんだけどよいかな?」と転載の打診をしました。結果は「52ページあるし、冒頭4pぐらい構わんじゃろ」という雰囲気だった気がします(記憶が曖昧)。okを得られたので、予告編4ページを含む12ページの冊子を作ることにしました。表紙と裏表紙を除くと新規に書くのは6ページで現実ラインです。ともかく、さっさと退勤して内容を詰めていくことにしました。

骨子を固める

まずは内容の骨子です。内容はコミケで頒布する本の中の記事を補完しつつ予告編となるようにしようと考えました。
また、先日SBT+Chisel向けの環境一式が入ったDockerイメージを作っていて、さらにChisel 3を試すためにそのChisel 3版も作っていました。リンク
これらを利用してサクッとお試し入門してみようという話と、加えてコミケ版でほとんど言及しなかったWindows環境でのChisel開発について補足することにしました。せっかくコピー本なので最新事情(GitHubのChiselリポジトリ上での当日の議論)についても言及し、Chisel 3の現プレビュー版を利用してビルドするとどの程度のエラーが出てくるのか、簡単に試せればそこから次のステップが見えてくるかも、と考えてそれも含めることにしました。

資材調達

書くことが決まったら、まずは資材の調達です。原稿が仕上がらなければ最悪ページ数を減らせば良いのですが、製本工程でつまづくと面倒そうだったので、コピー本向けの製本グッズを購入します。
コピー本といえば縦とじのできるステープラー(ホッチキス)なので、Amazon Prime Nowで買いました。なお、ステープラーだけだと500円ぐらいで、Prime Nowの最低額へあわせるために芯を大量購入すると何万本も手元に残ることになりそうでした。特に買いたいBlu-rayなどもなかったのですが、ちょうど手元在庫が切れていたアサヒのウィルキンソンタンサン(500ml)x24が1,900円だったので、渡りに船という感じでカートへ追加しました(図6)。
図6 Amazon Prime Nowで資材調達
私の出展物は写真中央あたりのモニタに映っているものです。
中央右に見える箱は@tenntennのVRゴーグルです。

原稿の大枠を整備

前述の骨子に従って書き始める前に、最後の段階で足をすくわれると面倒な下回り整備をおこないました。骨子を考えてから一旦頭の中をクールダウンしたいというのもあったので、雑務を先に片付けた格好でもあります。
ここで具体的にやったのはRe:VIEWで冊子を作る際のコンフィグです。まず、今回の冊子は12ページしかないので、目次に1ページ持って行かれては面倒です。表紙の2ページ先のトビラも当然無し、奥付も無し、という具合にconfig.ymlをいじって調整していきました。
この段階で書く内容ごとのページ数は決まっていたため、仮(アタリ)の内容を埋めてレイアウトをざっくり確認しました。とりわけ、Chisel 3のくだりはページ数が極端に少ない(1ページ)ため、なるべく不要な領域を詰めたいという事情がありました。多少レイアウトは不自然になりますが、この章はpostdef扱いにしました。
120ページ級の書籍とは綴じ方から何から違うため、本来は紙面レイアウトのパディングを減らしたいところでした。しかしコミケ版の原稿をそのまま4ページ拾ってきて掲載する都合上レイアウトが変わるのは避けたかったので、そのまま(いわゆるてくぶレイアウトを維持)にしました。
ひとまずその4ページを拾ってきて貼り付けたあたりで着地点が十分に可視化されて、テンションが上がってきました。

原稿執筆

ひたすら書きました。基本的にホームグラウンド(Dockerまわり)の話を中心に書くことにしたため、あまり手が止まらずに進みました。

表紙と裏表紙の作成

あまり手が止まらなかったとはいっても、さすがに途中で疲れてきたので現実逃避に表紙と裏表紙を作りました図7。
図7 頒布した本の表紙(左)と裏表紙(右)
最近はもっぱらAcrobat DC専用と化していたAdobe CCですが、Illustratorが大変役立ちました。
下敷きにしている画像は、今回作った「自称Webカメラ」の写真です。iPhoneでササッと撮りました。
裏表紙は普通に文章を書こうかと思ったのですが、Re:VIEWでは図への回り込みなどを扱いづらいので避けることにしました。Keynoteでぺたぺた貼り付ける策も考えましたが、なるべくWindows上で作業したかったのとKeynoteからPDFへのエクスポート時の画像解像度の扱いが少々不安だったのでやめました。裏表紙もIllustratorで作ることにしました。

完成から印刷・会場へ

表紙と裏表紙が完成して、いくらか追記をおこなって大筋完成後は、文章のおかしなところをセルフレビューしました。展示当日朝に全体を通して確認していくつか軽い変更を加え、「もうこれ以上はいじらない」と覚悟を決めてセブン-イレブンへ向かいました。まず1部出力したところ、サイズをミスって完成サイズがA5になったので慌てて完成がB5になるように設定変更しました。あとは問題なく出力できました。今回の展示物では、19インチモニタが多少持ち運びにくい程度だったので、ささっと荷詰めをして会場へ向かいました(図8)。
図8 さっさと荷詰め
途中で朝ご飯を食べて、展示ブースの下にべろんと貼り付けておく紹介資料をKeynoteでそいやっと作りました。内容は概ね冊子のサマリなのでサクサクできました(なお、これをA3横で作ってしまったため、6人出展のブースで幅を取り過ぎて周りの人に迷惑をかけてしまったりもしました)。あとは最寄りのファミマで印刷してめでたし、です。
ビッグサイトへ移動して設営を終えました(図9)。
図9 設営を終えた会社の有志6名ブース

出展中

トータルで1日目10部、2日目25部を配布しました。部数設定が少なすぎると感じるかもしれません。とにかく余らせたくなかったのと、コンビニのコピー機でそこそこ身軽に印刷できる規模の数にしたかったというのがあります
今回のゴールは「大量に配布する」ではなく、「余らせずになるべく興味を持った人の手に届ける」でした。
考えてみると、10部でもB5用紙60枚相当、15部だと90枚相当あるわけで、手元に残って破棄するよりは少部数にとどめておきたいと感じるものです。

1日目

1日目は10部+見本を作成して持ち込みました。
12時開場で、13時過ぎには残部がなくなっていたようでした(交代で展示番をしていたのですが、戻ってくる前に捌けていました)。
engadgetの方がTwitterで見て欲しかったんですよーと言って持って行ってくれましたよ、と後で教えてもらいました。ありがたや。
自分がブースに居る時はあれやこれやと説明したり、Chiselを布教したりしていました。
実現できているものが凄いとかそういう展示ではなく、こういう作り方(手法)があるよという紹介が主題の展示物というのが初めてだったので、難儀する部分もありました。相手がどういう方なのか分からない、完全なオープンコンテキストの中で説明するのって割とむずいな、みたいなことを今更のように思いました。
HDLでの開発者の方、PyCoRAMとSynthesijerを使ったことのある方、Scalaでソフトウェア開発をしている方など、多くの方と話せたのでよかったです。HDLや高位合成系の経験者の方にChiselの良さは割と紹介しやすいものでした

2日目

2日目は15部を持ち込みました。
なんかミスって最初にA4仕上がりを1部作ってしまいました。15部は例によって(2日目は開始が早いこともあり)13時ぐらいまでに捌けました。そういうわけで、増刷することにしました。幸い文字系のイベントではないためかビッグサイト内のセブン-イレブンの複合機は空き時間が多いことが前日に分かっていました。部数は10と決め打ちして印刷、製本作業をおこないました。
問題は配布方法です。前日から「読んでくれそうな人に届いてほしいな」というところが少々気になっていました。もちろん、気軽に1部持って行って欲しいし、読んでみてワンチャン興味を持って何かにつながれば良いというのが大半の気持ちです。
それでも、前日に興味を持って熱心に話を聞いてくださった方へ残部なしがゆえに渡せなかったという心残りがありました。
こういう場合、鉄板なのは有料頒布(たとえば100円、10円でも可)にすることです。「なんか無料で冊子を配ってるから、とりあえず持って帰って気が向いたら後で読もう」というところから、10円ないし100円という「金銭的に痛くないけれど、明確な意思を持って入手した」という状況へと大きく変わります。今回の場合は、MFT2016前日の告知時点で無料と言い切っていますし、そもそもがコミケ本のプロモーションという位置づけで書いた部分が大きいので、これはダメです。釣り銭の用意もありませんし、一緒に出展していた5人への周知とある程度の負担が必要になる点もあります。
次の策は「見本誌を手にとってくれた方へ無条件でお渡しする」です。自分がブースに居ないタイミングでも、ある程度オペレーションを回しやすい方法だと思います。少々迷いましたが、この時点で展示時間が残半分を割りつつあったので、他の人への周知その他を考えた結果、これも採用しないことにしました。
結果、「10部中の5部は従来通りブースへ置いておいて自由にとってもらえるようにする」「残5部は自分で持ち歩いて、会場内の他ブースの(主に旧知の)方へ挨拶ついでに押し付けたりして回る」ということにしました。これはとても重要な結果につながるのですが、その話は本題から逸れるので別の機会に書きます。最終的には、無事に残部なく(一緒に出展していた社内のメンバーへ渡すつもりだった予備まで含めて)配布できました。

反省

冊子の配り方は目的に応じてあらかじめ工夫を考えておくべき

あまり細かくセグメントすると感じ悪いというのもあって、今回は原則宣伝用と割り切りました。MFTの展示自体にどの程度お金をかけることを許容するかという話でもありますが、やはり効率的に多くの方に届けたいものです。

主要モジュールは2つ買うこと

2つ買うのは高すぎるから無理、というものはそもそも十分な経験を持って扱うのでない限り不適です。避けたほうが良いです。何がおかしいのかをトラブルシュートしていった際に最後にモジュール差し替えて確認という手段をとれるのはとても大きいです。

基板色を黒指定すると、基板パターンがよく分からないので要注意

Elecrowでは基板の色を緑以外に指定しても料金が変わらないので、ついつい他の色を試してみたくなります。
青ならば基板上のパターンが割と見えるのですが、黒を指定すると見えづらいです(図10)。
図10 黒基板でパターンが見えづらい
狙ってやるならば問題ありませんが、基板上のパターンを話のタネにしたい場合には大変な地味さゆえ「よくわからんな?」となります。

基本筋は真面目で良いので、フックになる要素を考える(ダメならダメで諦める)

今回、展示物が気持ちファンキーな見た目になっていたのは、来場者に興味を持ってもらう上で一定の意味があったと感じています。
お題はWebカメラっぽいものですが、本当に普通のWebカメラっぽい出力だと、なんか監視カメラで撮られてる感じがしてブースへ寄り付きたくない感じがします。
今回はカメラモジュール内のレジスタ設定をおこなわずに起動しただけの状態で画を出したので、なかなかファンキーな感じになりました。メディアアート作品?と聞いてくださる方も居たそうです(私がブースに居なかったタイミングで、後から知りました)。今回は半ば怪我の功名というところがあり、あまり意識しすぎるのも良くないのですが、次以降の展示でも「嫌悪感を引き起こさないもの」「なんか気になるもの」というのは意識してみようかな、と感じたところです。

ぼっち開発での戦い方

回路にしてもソフトウェアにしても、レビューしてくれる人が居てチームで組んでいくならば取れる策も一定あります。一人でやる場合、基本戦術は次のとおりです。
  • 慎重に進める。十分に勉強してから取り組む
  • 似た特性の安価なモジュール(壊しても泣かない)で仕組みを十分確立してから高価なモジュールを使う
  • トライアル間隔を狭める
    • 自信がない選択肢に行き会った場合、全ての選択肢に同時張りする(例えば基板設計なら、有力な全候補を書き上げてまとめて入稿する)
      • 片方は失敗してロスする可能性が高いのですが、十分な確信なしで物事を進めなければならない状況は時間的に切羽詰っていることが大半なので、やむなしです
  • 金の弾丸で全てのパーツを余分に購入してバッファを持つ

宣伝

コミックマーケット90(C90)の3日目(8/14)、TechBoosterという技術書サークル(西a-05ab)にて「The Web Explorer 2」という本が出ます。このなかに、私の書いた「Scalaでイージーにハードを設計する」という記事が収録されます。Scala言語とChisel(Chisel HDL)というライブラリを利用してデジタル回路を設計する入門記事です。
図11の、めちゃめちゃかわいい表紙が目印です。
図11 The Web Explorer 2の表紙(イラスト: Jecyさん、デザイン: siosioさん)

そういうわけで

ブースにお越しいただいた皆様、会場で話をできた皆様、運営スタッフの皆様、同僚各位、ありがとうございました。とても良い場でした。
今回作成した12ページの冊子は、コミケが終わって少々落ち着いたら何かしらの形で配布しようと思っています。

0 件のコメント:

コメントを投稿