マンダラートのWebアプリ作った

2025-12-15
自作ツール

マンダラートは発想法の一種で、「3×3のマスをつくり、メインテーマを中心マスに置き、周辺8マスにそれに関連するものを埋めていく」というもの。

参考: マンダラート - Wikipedia

考えを広げたり深めたりする手法としてたまに使っていたんだけど、Geminiで自分が使いやすいものを作ってみたくなった。

それで作ったのがこちら → 八方思案

Image

こだわったポイント

  • セルのドラッグ・アンド・ドロップ
    • マンダラートで発想を広げるうえで、上下左右の位置関係があることが重要だと思ってるので、それをいじれるD&Dは大事。手慰みにもなる。
    • スマホでも一応できる
  • 9×9モード
    • 書いたら広げて一覧、そこで編集も可能
    • 対応するセルのテキストは同期する
    • *スマホでは見にくいので切り替えボタン表示してない
  • 下位にテキストがあるセルの右上にマークがつく
  • ズームした時にその方向に移動するアニメーション
  • インデント付きのテキストとしてエクスポート
    • アウトライナーに階層を維持して貼り付け

操作

直感的に使えるようにしたけどショートカットキーは説明が必要なので書いておく。

  • Zoom: セルをダブルクリック、Alt+Enter、Alt+↓、セル右下の+ボタン
  • Zoom out: 中心セルをダブルクリック、Esc、Alt+↑、中心セル右下の↑ボタン
  • セルの移動: ドラッグ・アンド・ドロップ
  • セル間のカーソル移動: Tab、Shift+Tab