2022-09-11

ScrapboxとHelpfeelとともに

#

開発

#

Helpfeel

#

Scrapbox

#

Nota-Reborn-Calendar-2022

飯塚大貴

エンジニア

こんにちは。Helpfeelプロダクトオーナーのdaiiz (@daizplus) です。
Nota Reborn Calendar 2022の貴重な一日分を書くことになり、大変緊張しています。よろしくお願いします。

Helpfeelのサマーインターンで初めてScrapbox（略してスクボ）のコードを書いてから、気付いたらちょうど5年が経っていました。月日は過ぎましたが、同志社大学を一望できる京都オフィスに初出社して、スクボのコードを自分の手元で動かせたときの感動はいまでも鮮明に覚えてます。

憧れのウェブサービスのソースコードを読んで動かせる幸せに勝るものはないですよね！

今回は久しぶりにエンジニアとしてのScrapbox活用の魅力と、個人的な目線でのHelpfeelとScrapboxの関係性を語ってみようと思います。

Scrapboxの特長: リンクで繋いで考える

Scrapboxでは単語やフレーズを[]で括ってハイパーリンク化することで、ページ同士を繋ぎながら思考していくWikiシステムです。

リンクされた互いの事柄の関係性を説明するように書き進めていくことで、自然とページは簡潔にまとまり、結果的に、大きなグラフ構造のデータができあがります。

改めてこのグラフを観察してみると、「近距離にあるページ同士は関係性が高い」や「同じものを参照しているページ群は意味的に似通っている」のような、複数のページのかたまり間においても有益な関連性が見えてきます。

‍

Scrapboxではこのリンクの効果を利用して、2種類の方法で得られる関連ページを推薦することによって、各ページを意味的に補強しています。

具体例として上図では、page (黒色ノード) における関連ページを示しています。起点となるpageから直接リンクされたページ (丸で囲んでいない白色ノード) と、これらにリンクするページ群 (丸で囲んだ白色ノード) からなることが分かります。
後者を「2ホップリンク」と呼んでおり、page から見ると「自身と同じページにリンクしているページ群」とも言い換えられます。これらがpageを間接的に説明している存在となり、関連ページに深みを持たせていると考えられます。

このリンクによる関連付けのおかげで、スクボ空間に放り込まれた漠然としたアイデアも、次第に解像度が高まっていきます。時が経つにつれて他のページやリンクに揉まれていく過程で不純物が取り除かれ、アイデアのコアとなる部分だけを抽出できるのです。
こうして純度が高まったページがまた他のアイデアと有機的に接続するというのを繰り返すことで、密度の高い思考の場が整っていきます。

Scrapbox活用の魅力: 知識を自分のものにする

日々アイデアを精製していくことで、ソフトウェア開発や創作活動におけるあらゆるシーンで活躍するのはもちろんですが、必要に迫られて新しいことを勉強したり、いま直面している問題に対する丁度いい解を考えたりするときにも最適です。

Scrapboxでの関連ページの仕掛けを「推薦されているページ群も自身の説明の一部である」と捉えることで、「よく分からないもの」を無理して説明することなく扱うことが可能になります。つまり、その時点での浅い理解を書き下すのではなく、それを構成する他のページを充実させて繋いでいくことで、間接的に説明していく方針を取ることができるのです。これらのページもまたリンクによって補強されていくので、おのずと理解が深まっていきます。

Scrapboxでコードリーディング

開発に取りかかる準備として、インターン参加当時に、Scrapboxのコードを手元のScrapboxに貼り付けてひたすら読み漁っていたのを思い出します。これから自分が開発する機能に関連する関数やファイル単位でスクボにページを作り、これらをリンクしながら読み進めていくことで道が繋がっていきます。

箇条書きエディタでの共同編集の同期処理や、2ホップ先の関連ページを得るための華麗なMongoDBのクエリなど、気になるものを手当たり次第コピペして自分なりの考察を書き足していく。こうしたアウトプットを繰り返していくうちに、知識として自分の血肉になっていく感覚があります。

ぼんやりとした理解からスタートして、ブラケティングで関連付けし、さらに周辺を読み広げていくことで次第に全体像が鮮明になっていく過程が最高に面白いです。

思考の途中で、実行結果のスクリーンショットを挟んだり、手描きでメモしたりと、複雑な問題を考える上で、ほどよい自由度があるのも心地良さのポイントだと思います。

最近はGitHubのGUIでも、関数の呼び出し箇所をクリックして定義を把握したり、他からの参照を確認したりすることもできるようになりましたが、いまでもOSSリーディングなどで新しいコードに挑むときはこのスクボ方式を活用しています。

手間に見えるかもしれませんが、蓄積されたリンク資産の助けもあって、回数を重ねるごとに得られるものは多くなっていきます。

チームで運用するScrapboxの関連ページの威力

Scrapboxでは、過去に対処した問題への解決策だったり、途中まで出来上がっているようなアイデアだったりが関連ページとして芋蔓式に発見できます。
これらは、たったいま書いている内容に呼応して次々に推薦され、「完全に新しい問題はさほど無い」ということに気付かせてくれます。
Scrapbox上で考え始める前には全く独立して見えていた事象も意外な共通点を持っていることを見い出せたり、過去のチームメンバー（や自分）が挑戦していた記録から勇気をもらえたりします。
このような体験を重ねるなかで、組織内のあらゆることに親近感が湧き、自分ごと化されてきて、次の何かを生み出す原動力が生み出されていきます。

新たにHelpfeelに入社してスクボを使い始めたエンジニアや他職種の方々も、この不思議な力に遭遇できていると嬉しいですね。きっとできているはず！

ScrapboxとHelpfeel

現在はHelpfeelの開発を担当していますが、HelpfeelはScrapboxと密接に関連しており、設計思想にも通ずるところが多くあります。個人的には、ある意味いまでもスクボの開発に携わっているつもりでいます。両者の連携を少しだけ紹介します。

改めてHelpfeelとは

思いつくままの言葉で答えを探せる革新的な検索サービスです。曖昧な言葉やスペルミスはもちろん、幅広く拡張された表現での問いかけに応えられるアルゴリズムが搭載されています。FAQや社内ナレッジ検索など様々な分野で質問の意図を汲み取り、ユーザー自身での課題解決を導きます。そしてこのHelpfeelの編集作業はすべてScrapboxで行う仕組みになっています。

HelpfeelのCMSとしてのScrapbox

誰にとっても分かりやすいFAQを作るためには、データセット（回答となるページ群）の情報構造への理解が欠かせません。
制作時には、まずはHelpfeel化したい文書群をScrapboxに取り込んで整理するところから始まります。検索ヒット率の向上は、検索アルゴリズムの進歩と同等に、検索対象の質の良さが要になってきます。
見通しの良い姿に仕上げるために、専門用語を独立ページに切り出して解説を手厚くしたり、関係する説明に適切にリンクを貼ったりするといった操作を手軽に行えることが求められます。
また、運用開始後もコンテンツの鮮度を継続的に保つ必要があるので、Wiki的に気軽に編集できることも重要です。
ここでもページリンクと関連ページ機能をはじめとするScrapboxの機能が重宝されており、これらなくしては実現できないと思います。

Scrapboxの検索ビューとしてのHelpfeel

HelpfeelはScrapboxのビューの一種、「検索に特化したビュー」である、とも捉えられます。
Scrapboxでは自ら書いたリンクを介して物事への理解を深めていました。一方でHelpfeelでは、こうして作られた有益な知識のネットワークをより柔軟に検索しやすくしようという試みに取り組んでいます。
個々のページに独立したキーセンテンスを付けていくアプローチで、周辺知識に詳しくなくとも答えを探せるような仕組みを構築しています。よく検索される言葉を記述しておいて対象文書を半自動的に拡張したり、動詞や形容詞などの活用される語も含めて表現の揺れをうまく吸収したり、といった意図予測検索技術の探究がHelpfeel開発の醍醐味です。

ページに記述されたキーセンテンスの例。(x|y) のような正規表現を用いて検索表現を展開できる。ブラケット[]で括ることで検索トップ画面のキーワードリストに表示でき、入力の手間なく検索できるようになる。

登録した重要な単語が「言葉のヒント」として提示されている様子。ユーザーはこれらのキーワードをクリックすることで素早く検索できる。
選択したキーワードの関連語がハイライトされるので、聞きたいことに関するより適切な単語を簡単に選び直すことも可能。

Helpfeelについての技術的な話題に関しては、過去のNota Tech Confでの資料もぜひご参照ください。

知識を創り上げていくScrapboxと、直感的に知識を探し出すHelpfeelという感じで、ともに「知識」をいかに上手く扱うかを日々模索しています。

Scrapboxで本を書く

最後に、最近の個人的な趣味での開発事例として、Scrapboxを使って手軽に技術系同人誌を執筆する取り組みを簡単に紹介します。
ここでもスクボの別形態のビューを考えるというアイデアから派生して、電子書籍を作るツールを開発しています。このツールは、コンテンツをTeX記法に変換した後、LuaLaTeXのコマンドでPDFファイルを生成する、という一連の処理を提供します。

Scrapboxのシリアライズ

さらっと「コンテンツをTeX記法に変換」と書きましたが、ここに結構な工夫が込められています。実はかつて似たツールを作ったときには、変換ソースとして単一のページしか扱えませんでした。これだと全てを一つにまとめる必要があり、どうしても普段通りの自然なスクボの使い方ができないという問題を抱えていました。

技術的な詳説は別の機会に譲りますが、今回のバージョンでは、グラフ構造のページデータをそのまま入力として与えられます。

変換過程で [* [提案仕様]] のように書かれた強調リンクを \section{提案仕様} や \subsection{提案仕様} のように解釈し、参照先のコンテンツに適切な階層レベルを付与した上でセクションの本文として展開できます。

また、リンク記法として参照したものの、書籍全体を通して章立てに含まれていないものを自動で付録として添付できます。

グラフ構造データをシリアライズした結果の目次の例。自動でsectionやsubsectionとして章立てされた様子と、自動的に追加された付録の様子。

編集を繰り返して絶えず変化していくScrapbox。これに対する「スナップショットとしての書籍」という表現技法が確立しました。人生の節目節目で写真を撮るような感覚で、技術書典や技術書博覧会などのイベントにあわせて、自分の自由研究所としてのスクボをシリアライズして配るのは面白いのでおすすめです。

執筆のハードルを下げたい

「自分で作ったものをまず自分で使い倒す」というHelpfeelの精神のもと、この変換器も積極的にドッグフーディングをしています。最終的に出力されるPDFファイルは印刷所に入稿する条件を満たしているため、紙の本として仕上げて配ることもできます。
手前味噌ですが、下記の2冊はスクボで執筆、このツールで変換されて無事に頒布まで漕ぎ着けました。

運用を開始してみて「技術系同人誌即売会に参加したいが、本を書くのは億劫だ」という悩みが解決されつつあります。いまでは「毎日の技術調査や機能設計のメモなどのネタは無限にあり、これらを変換するだけだ！」という強い自信に変わってきており、とても良い傾向です。また、プロジェクト内の一部のページ群だけを固めてエクスポートするという、開発当初はさほど想定していなかった用途にまで広がって活躍しています。

今年もスクボライフがますます楽しくなってきていますね。

お知らせ

株式会社Helpfeelは、先日から開催されている技術書典13にシルバースポンサーとして協賛しています。
そしてなんとありがたいことに、スポンサーセッションとして、YouTube Live「技術書典書籍紹介コーナー」に出演させていただくことも決定しました。
9月20日（火）21時頃、私 daiiz がお届けします。お時間がありましたらぜひご視聴くださいませ！