ページの繋がりの視覚化 (daiiz)
Scrapbox Drinkup #6 Kyoto での発表資料です
当日のこの発表について、
さんが記事にしてくださいました。
こんばんは
Notaに入社してもうすぐ1年
Scrapbox実験コーナー
バックナンバー
今日はScrapboxプロジェクト内のページの繋がりを視覚化します
視覚化の簡単なルール
pageの繋がり
pageをnode、page動詞の参照関係をedgeとしたグラフ構造を考える
pageの参照数、被参照数の合計
＝ 矢印の本数の合計
＝ 3
矢印の候補
[文中リンク] #ハッシュタグ 空ページへの参照も含む
オレンジ色のリンク
存在しないけど関連ページは通るページ
ざっくり雰囲気
上下キーを押して、矢印数の閾値N (左下の数字) を変化させながらグラフを観察する様子
→ N個以上の繋がりを持つnodeを描画できる
nodeをつまんで振ってみる
繋がっているページが大まかにわかる
摘んでいるpageに到達した人は、ページ内リンクや関連ページUIを辿っていれば繋がりの末端まで行ける、ということが大事
のちほど実演
nodeをダブルクリックしてページを開ける
漠然と眺めてページを見つける体験
デモ
誰でも試せます🎉🎉🎉🎉🎉
昨日頑張った 
手順. 1
プロジェクトのページのjson dataをダウンロード
または、Settings > Page data画面から
手順. 2
Google Chromeでscrap graph を開く
先程入手したページデータを読み込む
グラフを描画するまでの処理はすべてclientで完結
network通信しないのでprivate projectも安心して試せる
手順. 2
ページが多いプロジェクトでも (いまのところ) 問題なし
4900ページを与えても動いたので大丈夫
読み込み〜加工〜描画の待ち時間はConsoleを眺めていると退屈しない
デモ
デモで見えてくるもの
まだ繋がっていないページ
ランドマーク的なページ
いろんなpageと繋がっているページは大きな円 (ハブページ?)
複数人利用ケースと、個人利用ケースでのグラフの見た目の違い
アクティブな書き手ごとにクラスターができるイメージ
リンク、ハッシュタグを別々に見る
リンク
/daiiz N = 5
/scrapbox-drinkup N = 3
数個のハブページ
長く繋がっているパスが多い
小さい円同士も繋がっている傾向あり
ハッシュタグ
/daiiz 同条件
繋がりに広がりがない
ハッシュタグによる繋がりに頼るとハブページが孤立しやすい
まとめ
ハッシュタグ
ある程度のグループを作るのは得意
だが、それら同士は繋がりにくい
そのページに辿り着いても遠くまでは行けない
最初に思いついた小さな枠組みの中で無意識に分類しようとしている
無意識にページ内のタグ数を減らす方向に働く
所属グループをパッと思いつかないときはハッシュタグを書かなくなる
→ ページは繋がらなくなる
まとめ
リンク
深く考えずにページの文脈上キーワードや出来事を
[リンク] で書いていくと結果として繋がりやすい
文中リンクを使おう
文中リンクを使う方がよいという話
これらの裏付け的な図になったかも？
おもろそう
やってみたいー