Noratetsu Lab

　久々にDynalistのカスタマイズの話。

　MarkdownやScrapboxを常用していると、Dynalistでも似たような形で書式が反映されればいいのに、と思うことがある。例えば引用やコードブロック。
　Dynalistでは各ノードに色を設定でき、そうするとノードのHTML要素にclassが適用されるので、CSSをいじれば「紫色設定は引用書式ということにする」みたいなことも可能である。最初はそうやっていた。
　しかしこのやり方だとその情報はDynalist上でしか有効でないし、未来永劫同じルールで運用しなければならなくなる。色の設定も微妙に手間だ。だんだん苦しくなってきたので、別のやり方を考えることにした。

　コピペで他のツールと行き来できた方が良いので、例えば引用は「> 」を頭に付けることで引用判定されるといい。つまり、本文が「> 」で始まるノードに引用スタイルを適用したclassを付けたい。
　これはDynalistの機能ではできない操作なので、自分でスクリプトを書いて実行する。具体的にはChrome拡張機能を作る。あるいはブックマークレットにしてロード時に手動で実行する。
　Chrome拡張機能開発については以前Chrome拡張機能を自分で作って活用する（Dynalist）でちょっと書いた。

　class付与のタイミングをイベントで判定するのは面倒な気がしたので、setIntervalを使っている（試していないがblur時とかでもいいかも）。実際に使っているコードの一部がこちら。

// styleを記述しやすいようにclassを整理しておく  
const IS_COMMENT = 'is-comment';  
const IS_QUOTE = 'is-quote';  
const IS_CODE = 'is-code';  
const IS_BODY = 'is-body';  
  
// スタイルを記述する（ここでは引用のみ例示）  
const style = document.body.appendChild(document.createElement('style'));  
style.textContent = `  
.${IS_QUOTE} > .Node-self .Node-renderedContent {  
    background-color: #f0f0f0;  
    padding: 2px 4px;  
    font-size: 12px;  
    border: 1px solid #888;  
}  
`;  
  
// 条件を整理しておく（今回は本文が何で始まるかで判定するものとする）  
const condition = [  
    { start: '🖋', className: IS_BODY },  
    { start: '//', className: IS_COMMENT },  
    { start: '> ', className: IS_QUOTE },  
    { start: 'Code:', className: IS_CODE }  
]  
  
// 毎秒各条件をチェックしてclassを付け外し  
setInterval(() => {  
    const lines = document.querySelectorAll('.node-line.Node-renderedContent');  
    lines.forEach(elm => {  
        condition.forEach(({ start, className }) => {  
            if (elm.textContent.startsWith(start)) {  
                elm.closest('.Node').classList.add(className);  
            } else {  
                elm.closest('.Node').classList.remove(className);  
            }  
        })  
    })  
}, 1000);  

　ここでは「何で始まるか」だけで判定しているが、何を含むかや何で終わるかで判定しても良い。こうすると本文次第でスタイルを変更できるので、Dynalist固有のメタデータに依存することもなく、また条件の数も無制限に設定できる。（とはいえあんまり複雑にすると後で嫌になってくる可能性がある。意味が自明なルールに限った方が健康的だろう。）
　現在実際に設定しているのはコード例に書いた四種だけで、それぞれ以下のような意味と見た目になっている。

（書き忘れたけどコードブロック風スタイルはフォントもコード用に変更している。）

　Webブラウザの仕組みに頼ったものなのでスマホアプリでは反映されないのが難点だが、今現在はほとんどPCで編集しているのでPCだけでも効果は高い。
　ちなみにこのようにしてからもう半年近く経っているけれど、今のところ飽きはないし便利に思っている。
　

　ずっとまともに使えていなかったDynalistのノート機能を使えるようになってきたという記事を先日書いた。

• ノート機能と仲良くなった（Dynalist）

　この記事を踏まえて、tksさん^[1]がノート欄で書き物を進めるというアイデアを実例付きでご紹介くださっている。

• Dynalistのノート欄を使って本文を書く - 公開練習場

　いいですね！　最初「ノート欄で本文を書く」という表現から私が想像したのは記事全体をひとつのノードのノート欄に書くことだったけれども（以前そうしようとしたことがあったせい）、tksさんは比較的小さめの塊で適宜ノート欄に書いていくという感じで、なるほど面白いと思った。とても実用的という感じがする。

　私は逆に、誰かの記事を保存する場としてノート欄を使ってみようと考えた。
　誰かの記事をクリップするツールとしては、例に漏れずEvernoteからスタートし、その後NotionやOneNoteを活用してきた。どれも「クリップする」ということ自体には不都合はなく、まあどれでもいいというのが正直なところだが、一方で、「クリップしたきり」になるというのも共通している。何かを書き加えたりして活用するのはどうも難しい。
　そのままクリップするのは消えた時のための保存という意味合いが大きいので、頻繁にアクセスするものでもないしそのページに何かを書き加えてもそれは活きないかもしれない。なのでまあ仕方ないというか、そういうものであるとして、必要な時にはクリップしたページへのリンクを別のアクティブな場所に貼ってメモを取ればいいという気持ちもある。

　ところで、Dynalistに知見を集めるファイルを作ったという話を数日前にした。

• 知見ノートを作る/タグ機能と仲良くなった②（Dynalist）

　技術的なもの、知識系のものの調べ物の場でもあるが、誰かの何かに対する見解もここにメモすることにしている。言い換えると、Web記事全般ここに入るようにしたということだ。
　最初は要点をまとめることだけを考えていたが、WebクリップとDynalistとで二重にデータを作るのはなんだか面倒な感じがした。そこでこれはという記事については「本文」という項目を作り、そのノート欄に記事本文の一部あるいは全部を貼り付けてみることにした。長い場合は見出しごとに分ける。

　必要に応じて、「本文」の兄弟項目か子項目にメモを取る。まあ長い本文を貼るとノート欄がべらぼうに場所を取るので、兄項目としてまとめを作ったほうが良さそうだ。なお何千字もの本文をノート欄に貼り付けても、親項目を閉じるかノート欄を非表示設定にするかすればすっきり片付いてしまう。
　そしてノート欄に貼り付けるとそれはアウトライン操作ができないので、自然と「そのまま保存」の形になる。また、検索をかけた時にも細切れにならずにひとかたまりでヒットするので、文脈がよくわからないということにもならない（自分自身の記述でない場合、文単位でヒットされても困る事が多い）。

　溜めるばかりになっても情報が活きないので、保存する対象を取捨選択する、要点をまとめる作業をするというのが前提の話だが、Dynalistに長文を保管してしまってもいいんじゃないかというのは自分の中で少し大きな気づきである。
　クリップ用の保管庫がドンとある形ではなく、アウトラインの下位の方に本文そのものもぶら下がっていることで、「確認しに行く」「取りに行く」みたいな手間が要らなくなるし、情報も分散しない。Webクリップ用の場所が別にあると自分の日常の記録から離れてしまう感があるが、日単位で作った知見ノートに収めてしまえば、自分の活動のタイムラインにきちんと紐づく。
　なかなか良いのではないかと思ったので、この形でいってみることにする。

---

1. tks - 公開練習場/tks | Substack ↩︎

　アウトライナー（Dynalist）と仲良くなったという話の続き。当初の予定としては前回で最後だったがまた書けそうなことができたので書いていく。連続で書くかはわからないが小ネタがまだ多少ある。

　アウトライナー（Dynalist）と仲良くなったという話。最後はChrome拡張機能の活用について。

　アウトライナー（Dynalist）と仲良くなったという話。四つ目はブックマークレットの活用について。

　アウトライナー（Dynalist）と仲良くなったという話。三つ目はタグ機能について。

　アウトライナー（Dynalist）と仲良くなったという話。二つ目はノート機能について。

　アウトライナー（Dynalist）と仲良くなったという一連の話の一つ目は、ファイル・フォルダ機能について。

　Dynalistの特徴の一つとして、「ファイル（ドキュメント）^[1]」そして「フォルダ」の概念が存在することが挙げられるだろう。他のアウトライナーだと、複数ファイルの概念がないとか、フォルダはなくてファイルを入れ子にできるとか、色々と違いがある。
　参考：Dynalistの基礎：ドキュメントとフォルダ | R-style
　フォルダによって整理可能なファイル一覧というのは、普通に編集するアウトラインの外に更にアウトラインを作るものと言える。Dynalistのメイン画面はプロセス型アウトライナーだが、ファイルとフォルダの部分もアウトラインとして考えると、プロダクト型アウトライナーにもなるわけである^[2]。
　この柔軟性の高さは長所でもあり、また使い方に必然性が生まれず混乱の元にもなるポイントだ。良くも悪くも自由で、それが「良く」働くのか「悪く」働くのかはユーザーの使い方にかかっている。

Dynalistはいつ使うか

　ファイルとフォルダの使い方の話に入る前に、まずそもそもDynalistをどういうタイミングで使うのかということを整理しておきたい。
　情報のすべてをDynalist上で扱うわけではないし（そもそも最近は一時的なメモにしか使っていなかった）、デイリーページ的なものもここには作らない。いくつかのアプリケーションによって成り立っている情報管理の「系」の、その一部を担うものとしてDynalistがある。
　今月からDynalistに担わせることにした領域は、一言で表すと「ケリがつくこと」。何かのプランを練る、問題の解決を図る、文章を書く、ToDoをまとめておく、…といったことだ。
　逆に、「担わせてはならない」と固く決めている領域が「蓄積させるもの」「永久保存版にしたいもの」である。別にアウトライナーはそういうものに合っていないとか言いたいのではなく、個人的に失敗が続いているのでやめておくことにしているだけのことだ。具体的には、日記[^3]、アイデア、引用集、自分にとっての○○ランキング的なリスト、…といったものである。

ファイルの粒度

　さて、「プランを練る」「問題解決を図る」「文章を書く」といったことに使うとして、ファイルはどうすればよいか。やり方は色々あり得るだろう。

• あれこれ開くのは煩わしいから一つのファイルに全部入れる
• 月単位や週単位などでファイルを作ってその中にその期間の分をまとめる
• 「プラン」「問題解決」「文章執筆」といったファイルをそれぞれ作る

　Dynalistとの付き合いは結構長くなるのだが、「やっぱりDynalistを使おう」と思い直す度に、それ以前とやり方を変えつつこれらの形を試してきた。
　で、試行錯誤の結果はというと、結局Dynalistを使うのをやめるということを繰り返してきたので、どれも自分にとってはいまひとつだったことになる。

　最近気づいたことがある。それはファイルの粒度のサイズ感についての囚われである。
　ファイルもフォルダも数や階層に制限がないのだから、全く自由に使って良いのだが、なんとなく、ファイルひとつはそれなりの規模になることを前提として考えていた。例えば項目が3つしかなくてもいいはずなのだが、そんなに小さい規模の話ならもっと大きい括りの中の一部にすべきだ、という感覚があった。「すべき」というほどの強さを自覚していたわけではなかったが、しかし粒度の小さいファイルを作ることを当たり前に却下していたので、強さで言えばかなり強い縛りになっていたと思う。
　そうなるとファイルはそれぞれそれなりに大きいサイズのものになるわけだが、するとフォルダを使うタイミングがよくわからなくなってくる。今までは「Archives」みたいなフォルダを作って過去のものをまとめて放り込むというような感じでしか使えていなかった。あとは別に括らなくていい分類のためにわざわざフォルダを作ってまとめることが多かった。フォルダ機能があるのだから共通項でまとめてみるか、みたいな感覚である。
　フォルダ機能があるということは、ファイルが大量になってもいい感じにまとめておけるということだ。そしてファイルが大量になるということは、基本的には粒度を小さく使うということになるだろう。粒度が小さくても大丈夫だよというメッセージをきっとDynalistは発してくれているのに、私はそれを全然キャッチしていなかった。

自分は何が欲しいのか

　ということで、結局どうするのか。ファイル一覧部分のスクリーンショットを貼ってみることにする。左が本来の見た目で、右は自分でCSSを適用した状態の見た目である。

　まだ活用し始めたばかりなのでファイルの数は多くない。日を追うごとにどんどん増えていくだろうし、用が済んだものは年単位とか月単位でアーカイブ用のフォルダを作って入れていくことになると思う。
　ポイントは、「継続的な課題」「イベント（計画）」「トラブルシューティング」をフォルダとして、その下に個々の案件をファイルにして配置していることだ。Dynalistを開くと常にこれらが全部見えていることになる。
　
　前回の記事（アウトライナー（Dynalist）と仲良くなった）で、ファイルとフォルダのことを「自分に必要なことの発見」に分類し、それをつまりは「自分は何が欲しいのか」だと書いた。
　自分は何を欲しかったのかと考えると、アウトライナーでやりたかったことはいつでも「自分の意識を占めているものを可視化したい」ということだった。それだけではないが、それがいつも核にあった。「思い出し直す」ということが大きなロスに思えて、それがなくなるようにしたかった。
　アウトライナーは可視化に貢献するツールであって、特定のファイル内のアウトラインで整理しても良いような感じがするが、私はどのくらい可視化を欲しているのかというと、「リストが入ったアウトラインを開く」というステップもなくしたかった。常時見えていてほしいのだ。1案件1ファイルにすることで、「My files」の欄に全て並べておけるようになった。
　一応これと同じことはObsidianやLogSeqでも可能だ。それらだと自分でリンクを書く必要があり、またその際に取捨選択できてしまうのが良いところでもあり微妙なところでもあるが、ともあれDynalistに限られた使い方ではない。RemNoteでもドキュメントを並べておける（こちらも良くも悪くも取捨選択の余地がある）。
　そういった他のツールだと比較的当たり前にやれることが、「ファイル」というものに対する余計な囚われのせいでDynalistではなかなかできないでいたとも言える。最近やっとその囚われを解除できて、気づいてみればなんということのない普通の使い方がようやくできるようになった、ということだ。

　ところで、スクリーンショットを撮るために本来のスタイルで表示してみて気がついたが、普通に表示したらファイルの各行が高さを取りすぎていて表示できる数が随分少ない。ファイルの粒度を小さくして一覧できるようにするというやり方は、CSSを書き換えないとひょっとするとあんまり有効でないかもしれない。

関連

• アウトライナー（Dynalist）と仲良くなった
• アウトライナー日誌：バレットを「┠」にしたらバレット感に邪魔されなくなった

---

1. Dynalist上では「file」と書かれたり「doc」や「document」と書かれたりしており、一覧部分は「My files」となっている。 ↩︎

2. プロセス型アウトライナーとプロダクト型アウトライナー
   デジタル日記の試み④～Dynalistに日記と日誌のファイルを作る～）、一瞬は良かったものの、やっぱりやめてしまった。 ↩︎

　今月に入ってから生活に少し変化があったからか、頭の働き方にもちょっと変わったところがあり、「いいことを思いつく」ということが急に増えた。新たな閃きを得るというのもあるが、妥当な決着への道が拓かれたというのがいくつかあった。
　そのひとつとして、Dynalistの「よい使い方」を急に思いついたというのがある。

　つい先日、ノートツール環境スナップショット（2023/09） の中で以下のように書いた。

「アウトライナーに分類されるアプリケーション」よりも、色々とやれるツールの中にアウトライン機能がある状態が私にとっては良いようだ。
　早くも手のひらを返す展開になりそうである。

何が変わったか

　さて、変わった点というのはいくつもある。

• ファイルとフォルダの構成・粒度を掴んだ
• ノート機能の使い方を見出した
• タグ機能の使い方を見出した
• ブックマークレットでjsonに変換してコピーできるようにした
• Chrome拡張でエディタ機能を補完した

　それぞれ記事一本分になる気がするので、詳しくは改めて記事にする。今回はちょっとだけ俯瞰を試みることにする。

　これらの五つのポイントは、分類すると以下のようになるだろう。

• 自分に必要なことの発見
  • • ファイルとフォルダについて
• 囚われからの解放
  • • ノート機能について
  • • タグ機能について
• 全く新しいアイデア
  • • ブックマークレットについて
  • • Chrome拡張について

　思い切って言い換えれば、「自分は何が欲しいのか」「自分は何に乗っ取られているのか」「自分にとって何が理想なのか」という三分類と言っても良いだろう。
　生活の変化で血流が良くなって^[1]たまたま（あるいは必然的に）全部同時に考えが進んだので、「アウトライナーのことがわかったのかも」という気分になったが、アウトライナーのことがわかったというよりは、多分「自分をわかる」という流れの中でDynalistに意識を向けていたから「自分とDynalist」という切り口で整理が進んだのではないかと思う。

自分を基準にするということ

　自分でアプリケーションを作るとすれば、機能というのは積極的に既存のものをコピーするのでない限りは自分が欲したものしか搭載しないし、自分の癖に沿った形でしか実装しない。技術的に自分の要望を完璧に満たすことができないことはあるにしても、自分の使い方から大きく離れたものをわざわざ作ることはまずない。
　しかし誰かが作ってくれたアプリケーションを使うとなれば、自分が欲しいかどうかとは関係なく、一般的に必要とされることが多いらしい機能が、一般的に使いやすいとされるらしい形で実装されたものを使うことになる。そうなると、一般的に有効らしい使い方をとりあえずしてみるということになりがちである。
　自分で作るという体験をしたのでこういう対比が可能になっているのだが、自分で作ってみるということをする前は「誰かが作ってくれたアプリケーションを使う」しか選択肢がなかったので、自分が何に陥っているのかもわからなかった。この形のアウトライナーを使うとすれば、ふつうどう使うもので、何が有効とされているのか、それをまずチェックしてみてその中から自分に合うものを選んでいこう、というのが当たり前の流れになる。しかし「その中」になかったらどうするのか。そして自分が欲したものが「その中」のものから大きく離れている時に、すんなり自分に従えるだろうか。
　見かける使い方というのが色々ある中で、全く見かけていないものを思いつくのは結構大変なことだ。自分が学習した「○○らしいやり方」にどうしても縛られてしまう。例えばアウトライナーは「アウトライナー」という名前でもう雁字搦めに縛られている人が結構多いと思う。例えばタグ機能は、他のツールとも共通する「タグらしさ」から離れがたい。

　で、きっと色々な条件が重なってのことだろうが、ふとそういった「印象」や「既知のこと」が自分から離れていく感じがして、そして今Dynalistを見て「普通に便利じゃん！」と思ったりしている。アウトライナーの基本機能についてはDynalistに限らずずっと使っていることで特に認識は変わっていないが、そこにプラスアルファで追加されている諸機能への感じ方が変わった。（よってアウトライナーというよりDynalistの話になるのだが、Dynalistだけでなく広く搭載されているものでもあるので、「アウトライナー（Dynalist）と仲良くなった」という曖昧なタイトルにしている。）
　事実としてDynalistの機能やHTML構造はどうなっていて、それをどう活用できるのか。そのことにフォーカスして考えるようになった。なんでそう切り替わったのかというのはよくわからないので「血流が良くなったんですよ」としか言えないのだが、ともかくそんな感じなので、それぞれのポイントについて追々ちょっと記事にしていきたいと思う。

---

1. 血流が良くなる ↩︎