・プログラムは、noteの「サカチン工房」のページでダウンロードできます
「アウトラインメモ」の特徴
ワープロのように使え、使い方はすぐ理解できます。ショートカットはほぼ一般的。
どこに置いても、既定のブラウザで立ち上がります。ブックマークに登録すると便利です。
直感的な項目操作（Tab、Shift＋Tab、Ctrl＋X,C,V、マウスによる移動）
強力なテキスト操作（Ctrl＋X,C,V、ドラッグ＆ドロップ、BackSpace・del消去の復活）
表・画像の挿入が可能。
出力は「HTML」「プレーンHTML」「リッチテキスト」「ブログ用出力」。
書類の色調の設定が可能で、見た目に綺麗で見やすい。
ブラウザの機能を活用できる（検索はありがたい）。
開発は「windows11；Chrome」で行いました。Macでも動くと思いますが確認はしていません。また、ipadでは、「LiquidLogicのプレビュー」上で動作を確認しましたが、詳細には検査していません。
入力の始め方
プログラムを立ち上げると、入力できる状態になります
保存が終わったら、ウインドを閉じる、別のwebページに飛ぶなどで終了します。
複数の文書を書く場合、複数のウインドで「アウトラインメモ」を立ち上げます。
項目ごとに文章を書いて、項目を親・子レベルに設定しグループ化し、並べ替えて文章を作ります。
使用法（特別な注意事項のみ）
項目の「折りたたみ」・「展開」は、行先頭の小さな（▸）をクリックします。
項目の移動は先頭の「●」を掴んで、ヒント線を見ながら、同レベル移動・親・子移動を行います。
項目を操作する時には、項目内にカーソルが落ちているほうが動作が安定します。
項の先頭でBSを押すと、前項目が同一レベルなら結合し、レベルが違えば無視します。
最後の１項は消去できません（ステータスバーに警告表示）。
テキスト内での改行、Tabが使えます（ショートカット参照）。
元に戻す・やり直し（Undo/Redo）は５回まで可能です（回数をステータスバーに表示）。
テキストのドラッグ＆ドロップに対応
「backspace」BSで消したテキストは、「Shift＋BS」で復活
「delete」で消したテキストは、「Shift＋Delete」で復活
ツールバーのボタンのヒントには、「機能とショートカット」が表示されます参考にしてください。
文章の画像は一つのフォルダに入れる必要があります。文章ファイルと同一のホルダに画像を置くことをお勧めします（詳細は後述）。
保存するとボタンが「塗りつぶされ」、次のテキスト操作で「白抜」に戻るので、保存状態が分かります。
保存時のファイル名に関する操作はブラウザの仕様で特殊です（詳細は後述）。ファイル名の初期値は「outline.json」です。
ブラウザの機能が使えます（特に便利なのは→検索、ウインド分割でアウトラインメモとwebを表示）。
ショートカット（スムーズな操作に必須）
項目の追加→「Enter」
項目とテキストの削除・コピー・ペースト→「Ctrl＋X、C、V」（共通）
項目の分割→「Ctrl+Q」
項目を子レベルへ移動→「Tab」
項目を親レベルへ移動→「Shift＋Tab」
テキスト内での改行→「Shift+Enter」
テキスト内でのTab→「Ctrl+Shift+space」
カーソルの項目移動→「Shift＋↑↓」
BS消去したテキスト復活→「Shift＋BS」
保存→「Alt＋S」
背景色について
下のステータスバーに表示される色の中から選択してください。
カーソルが最上位の項目（h1）にある時には、h1行の背景色を変更できます。（透明＋6色）。
カーソルがh1行以外にある時には、h1行以外の背景色を変更できます（6色）。
リンクの設定
リンクの機能を活用できます。各項目の最後のリンクマーク「🔗」を押すと、設定ウインドがひらきます。
「パス」や「アドレス」を入力します。ブラウザのアドレスバーからコピペすると楽です。
PC内部のファイルには「C:\Users\～」や「file:///C:/Users/～」形式
外部のサイトでは「https://～」形式
表項目について
ツールバーの「表ボタン」を押すと表項目が生成します。
表項目のレベル操作は、ツールバーのボタンからしかできません（表のセル移動にTabを使うので）。
表内でのショートカット；「次のセル→Tab」、「前のセル→Shift＋Tab」
画像項目について
文書内における画像の取扱いについて
画像はリンクで表示しています。文章中に画像データを置いていません。これはファイルサイズを小さく保つためです。
プログラムでは画像フォルダへのパスが一つ設定できます。したがって、一つの文章に関する画像は一つのホルダーに入れる必要があります。文書と画像ファイルホルダは別の場所でもかまいませんが、同一のフォルダにしたほうが便利でしょう。
ツールバーの「画」を押すと、画像項目が生成します。画像ファイルを選択し、キャプション、サイズ、位置を指定します。
画像を含むファイルを開くと、はじめはパスが繋がっていないので、画像が正しく表示されません。文章ファイルを読む際に、そのディレクトリを自動的に入手したいのですが、ブラウザの仕様でそれができません。従って、手動でパスを設定する必要があります。その役割をするのが、ツールバーの「📂画」ボタンです。このボタンから画像ファイルのあるホルダーを設定し、読み込みを許可します。
画像のディレクトリを取得すると、「📂画」ボタンが塗りつぶされ、状態が分かるようになっています。ボタンにマウスを載せると、ディレクトリが表示されます。異なっていれば、ボタンを押して修正したほうが良いでしょう。
出力について
ツールバーの「出」を押し、出力形式を選んで出力します。
HTML出力
階層情報は、HTMLの「見出し１」「見出し２」等に対応し、折畳・展開が可能です。（間違えて編集しそうになります。ご注意！）
Wordで読込めば「アウトライン機能」が使えます。
ブラウザの印刷でPDF化できます。見た目通りに印刷するには、印刷の詳細設定で「背景とグラフィックス」をONにしておきます。
HTML出力の場合、画像は、Base64の埋め込みになります。
プレーンHTML出力
見出し情報のみ残したHTMLファイルです。加工を加えたい場合利用してください。
RTF（リッチテキスト）出力
そのままWordで読込むことができる形式なので、ワープロに移行する時に便利です。
このファイルもWord等でPDF化できます。
画像は省略されます。
Blogger出力
Google Bloggerの投稿様式に合わせたHTMLファイルを出力します。ファイルを全部コピーし、「投稿」「ページ」のHTML編集モードで張り付ければ、一切の変更なしに原稿ができます。
ファイルの保存に関して（重要）
ブラウザの保存は、「ダウンロードフォルダだけ」と思ってませんか？ （機種にもよりますが）それは違います。ブラウザの機能で変更できます。Chromeの場合、右上の三点リーダーから→設定→ダウンロード→「ダウンロード前に各ファイルの保存場所を確認する」をONにすると、任意の場所に保存できます。この設定で保存前にファイル名を指定したり、保存場所を指定できるようになります。
このプログラムは、ブラウザ上で動くので、「ファイル名」は「ブラウザ内でのファイル名」と「プログラム内でのファイル名」の２種が存在します。この２種は一致させる必要がありますが、ブラウザでファイル名を変更した場合、プログラムにその情報を渡せません。そのため、ファイル名の修正が必要な場合があります。この点を配慮して、ブラウザにファイルを渡す「前」と「後」で、ファイル名を修正できるようにしてあります。これは、ブラウザの設定が、下のどちらになっているか分からないからです。
「保存場所がOFF(ダウンロードフォルダに自動保存）」の場合、初めに出るファイル名の画面で修正します。その後、保存は指定されたファイル名で保存されます（括弧番号が付くこともある）。保存後に、「ファイル名の修正」が出てきますが、その時点では修正は不要です。
「保存場所を確認するがON」の場合、はじめに出るファイル名画面での設定は自由で（設定しても良い）、その後にでるブラウザの保存画面でファイル名を変更します。ファイル名を変更しない場合、ブラウザが勝手に括弧数字を付けます。上書を希望する場合には、上のファイルリストから選んで、ファイル名を同じにして上書してください。上書きが可能な点でこの方法は便利です。保存後に「ブラウザで変更したか」を問われますので、必要に応じ変更してください（括弧数字は無視）。
プログラムは、JSONファイルを読み込む際、「最後の括弧番号」を除去してファイル名にします。
4. 実際に使ってみての感想
「アウトラインメモ」は予想以上に便利でした。ブラウザのタブに「アウトラインメモ」があり、思いついたことをすぐに書き留めることができます。ToDoを書き留めるには最適です。リンク機能により、「PC内外の写真やサイト」を表示することができます。例えば、旅行計画の文章の場合、ホテルの予約サイトに飛ぶように設定すると便利です。ファイルの保存には少し慣れが必要で、試しに保存して規則性を学ぶと慣れてきます。背景とh1行の色が選べるので楽しく、見やすいです。色の選択はとても良い機能と思いました。テキストのドラッグ＆ドロップも便利です。出力の「blogger」投稿用の出力は、私にはとても便利です。私は、こんなアプリを待っていたのです。
出力形式は、いろいろなニーズがあると思います。プログラムのHTMLファイルは、公開しています。入手して、各自、AIに頼んで作ってください。
最後に
数日にわたり、AIに「そうではなくて、こう」と言いながら軌道修正してプログラムを作りました。その結果、今の自分のプログラム作製能力では作ることができないと思える気の利いたアウトラインプロセッサーを作ることができました。AIの時代ですね。「何をしているのか分からないけど、できてしまう」。常々、「こんなアウトラインプロセッサーがあったらいいなあ、でも、作れないから市販品を使うしかない」と思っていたのですが、ついに、思い通りのアウトラインプロセッサーを作れる時代が来ました。素晴らしい！
自分は要求を出す人で、日本語でAIに伝え、AIはそれを正確に実現する。なんというか、ツールを使っているような感覚ではなく、超優秀な日本人プログラマーと一緒に仕事しているという感じでした。ただ、全体を見渡したような問題提起は行ってくれません。プログラム作りの進行は100％自分の能力だけにかかっていて、AIはそれを超優秀に支えてくれる存在と感じました。それでも、AIに感謝の念が芽生え、時々、「ありがとう」や「おやすみなさい」って入力するようになりりました。
AIに本プログラムのセキュリティ対策を行ってもらいました。文書の操作・保存・出力はすべてローカルに処理され問題はなく、URLのリンクでは、URLの先頭がjavascript、vsscriptでないかチェックをし、画像パス、エクスポートHTMLに対しても外部から侵入がないようにしたとのことでした。
プログラムの公開
プログラムは「note」のサカチン工房でダウンロードできます。下のボタンからジャンプして、ページに飛んでください。noteで「サカチン工房」と検索しても出てきます。是非、使って、感想をお聞かせください。