ブラウザで動くアウトライナー「アウトラインメモ」を公開します



  ブラウザで動くアウトライナー「アウトラインメモ」をAIと一緒に作りました。
良い出来なので、広く使ってもらいたいと考え公開します。noteの「サカチン工房」でプログラムを公開してます。

はじめに
「アウトラインプロセッサー」は、「論理的な文章」や「データベース」の作成に最適なツールです。以前、Word版を作って紹介しましたが、「最近、Wordを維持するコストが高すぎる」と思いはじめ、代替を検討しました。しかし、適切なものがなかったので、「ならば、自分ので作るしかない」と思い、AI(Claude)をパートナーに、開発を行いました。常々、「もっと容易な環境で使えるもの」と思っていたのでHTML(JavaScript)版を作りました。その結果、ブラウザで動く、シンプルでパワフルな「アウトラインプロセッサー(名称;アウトラインメモ)」を作ることができました。OSを問わず、ブラウザが使えるPCやタブレットで使え、広く活用できそうです。

 以下はAIの作った宣伝文です。操作説明は別ページ「アウトラインメモ操作説明書」をご覧ください。

アウトラインメモ ─ あなたの思考を、自由に広げるツール


「もっと自由にメモしたい」と思ったことはありませんか?
アイデアは、いつも一直線には生まれません。
大きな構想から細部へ。気づいたら枝分かれして、また戻って。そんな「思考の動き」に、ぴったり寄り添うメモツールがあったらいいのに──
「アウトラインメモ」は、そのために作られました。
インストール不要。ブラウザで、今すぐ使える。
アプリのインストールも、アカウント登録も、クラウドへの接続も、一切不要。
HTMLファイルを開くだけで、完全に動作します。
データはすべてあなたのパソコンに保存されます。クラウドに情報が漏れる心配がなく、オフライン環境でも使えます。機密性の高いメモにも安心してお使いいただけます。
Windows でも Mac でも iPad でも動作します。
階層構造で、頭の中を整理する
思考には「大きな話」と「細かい話」があります。アウトラインメモは、その関係を視覚的に表現できます。
たとえば……
プロジェクトの全体像を第1階層に。
各フェーズを第2階層に。
タスクの詳細や備考を第3・第4階層に。
Tab キー1回で子階層へ。Shift+Tab で親階層へ。キーボードだけで、サクサク構造を組み立てられます。
「全折」ボタンで全体を俯瞰。「全展」で詳細を一気に開く。大きな文書でも、迷子になりません。
ドラッグ&ドロップで、考えを自在に並べ替える
「やっぱりこの話は先に持ってきたい」「この項目はあのグループの子にしたい」
そんなときは、ドラッグするだけ。上下の移動も、親子関係の変更も、マウスひとつで直感的に操作できます。
テキストの一部を選択して別の項目へドラッグすることもできます。文章を書きながら、気軽に推敲できます。
テキストだけじゃない。表も、画像も、リンクも。
📊 表(テーブル)機能
アウトラインのどこにでも表を挿入できます。列数・行数・ヘッダーを自由に設定。列幅もドラッグで調整。比較表・スケジュール・データ整理に大活躍します。
実際に使ってみましょう。下にサンプルの比較表を入れてみます。

主要メモツール比較

機能 アウトラインメモ 一般メモアプリ テキストエディタ
インストール不要 ❌(多数)
階層構造 ✅ 無制限 △ 限定的
表の挿入
画像の挿入
オフライン・ローカル完結 ✅ 完全 ❌(クラウド)
🖼 画像機能
アウトラインの項目として画像を挿入できます。キャプション・表示幅・配置(左/中央/右)を設定可能。クリックすれば拡大表示(ライトボックス)。
ビジュアルを混ぜながらアイデアをまとめる、ムードボード的な使い方もできます。
🔗 URLリンク機能
各項目にURLを設定できます。参考サイトや資料へのリンクをメモと一緒に管理。「↗」バッジをクリックするだけで新しいタブが開きます。
書くことに集中できる、こだわりの操作性
「考えながら書く」ストレスをなくすために
Enter で即座に次の項目へ。Ctrl+Q でカーソル位置から項目を分割。文の先頭で Backspace すれば前の項目と結合。
テキストエリアは内容に合わせて自動で縦に伸びます。スクロールせずに長い文章も書けます。
消してしまっても、すぐ戻せる
Ctrl+Z(元に戻す)はもちろん、Backspace で消した文字は Backspace+Shift で個別に復元できる独自機能も搭載。うっかりミスに強い設計です。
コピー&ペーストで、項目ごと複製
項目を Ctrl+C でコピーすると、子孫の階層ごとまるごとコピーされます。別のウィンドウで開いた別ファイルへも貼り付け可能。複数ドキュメント間のコンテンツ移動がスムーズです。
6種類の背景テーマで、気分に合わせてカスタマイズ
画面下のカラースウォッチをクリックするだけで、アプリ全体の配色が変わります。
落ち着いて集中したい日はホワイト。気持ちを上げたい日はラベンダーやピーチ。選んだテーマは次回起動時も記憶されます。

背景テーマ一覧

テーマ名 こんなときにおすすめ
デフォルト(ブルー) 知的・クリエイティブな作業。アプリ本来の雰囲気。
ホワイト シンプルに集中したいとき。資料作成・長文執筆。
ミントグリーン リフレッシュしたいとき。アイデア出し・ブレスト。
ピーチ 温かみのある雰囲気で。企画書・提案書の草稿。
ラベンダー 感性を大切にした作業。日記・創作・読書メモ。
レモン 元気よくポジティブに。目標設定・タスク管理。
書いたものを、様々な形で出力できる
アウトラインメモで作ったコンテンツは、用途に合わせた形式で出力できます。
🌐 HTML出力 ─ アプリと同じデザインのウェブページとして保存。折りたたみ機能付き。
📃 プレーンHTML ─ シンプルな構造のHTML。WordPressなど他のCMSへの転用に。
📄 RTF出力 ─ Microsoft Word・LibreOffice で開けるリッチテキスト形式。表もURLリンクも含まれます。
📝 Blogger出力 ─ Googleのブログサービス「Blogger」に直接貼り付けられるHTMLを生成。ブログ記事の下書きから公開まで、一気通貫。
💾 JSON保存 ─ アプリ独自形式で完全に保存・再読み込み。表も画像パスも保持されます。
こんな方に使ってほしい
✍️ ライター・ブロガー
記事の構成を練るのにぴったり。アウトラインが固まったら、そのままBlogger出力やHTML出力で公開へ。アイデア出しから入稿まで、ツールを乗り換えずに済みます。
💼 ビジネスパーソン・プランナー
企画書・議事録・プロジェクト計画の作成に。階層構造と表機能を組み合わせれば、複雑な情報もすっきり整理できます。RTF出力でWordへの受け渡しもスムーズ。
📚 学生・研究者
論文・レポートの構成案、講義ノート、文献メモの整理に。URLリンク機能で参考文献を一緒に管理できます。クラウドに情報を預けたくない方にも安心。
🎨 クリエイター・デザイナー
企画のアイデアボードとして、画像と文章を組み合わせた資料作りに。世界観やコンセプトを整理するのに役立ちます。
👨‍💻 エンジニア・技術者
設計ドキュメント・仕様メモ・コードメモの整理に。シングルHTMLファイル&ローカル完結の構造は、セキュリティポリシーが厳しい環境でも安心して使えます。
よくある「不満」を解消します
❌「クラウドに情報を置きたくない」→ ✅ 完全ローカル動作。情報はあなたのPCの中だけに。
❌「インストールが面倒」→ ✅ HTMLファイルをダブルクリックするだけ。
❌「月額料金がかかる」→ ✅ 完全無料。購読もサインアップも不要。
❌「ネットがないと使えない」→ ✅ 完全オフラインで動作。飛行機の中でも山の中でも。
❌「表やリンクが貼れるメモアプリがない」→ ✅ テーブル・画像・URL リンクをアウトラインに自然に混在できます。
❌「Bloggerへの投稿が手間」→ ✅ Blogger出力ボタン1つで、コピペ可能なHTMLを生成。
無料で入手できます
最新版は「Note」にて無料公開されています。「サカチン工房」で検索してください。
制作:サカチン工房(2026年)
あなたのアイデアと思考を、アウトラインメモが全力でサポートします。