AIで文章を作った、その先を整えるMarkdownエディタ「Yomu」を作りました

ChatGPTやClaudeを使って文章を書くようになってから、記事の下書きを作るまでの流れはかなり変わりました。構成を考えたり、文章のたたき台を作ったり、見出しや箇条書きを整理したりと、以前なら一つずつ進めていた工程をAIと一緒に進められるようになっています。

自分自身も、ブログやWebサイトの記事を作るときにAIを使う機会が増えました。特にMarkdownで原稿を作ってもらうことが多くなり、文章を考えて形にするところまでは、以前よりかなり進めやすくなったと感じています。

一方で、実際にその原稿を公開しようとすると、別の作業が残っていました。

WordPressへ入稿するなら、見出しやリスト、表などを確認しながら、WordPress側で扱いやすい状態に整える必要があります。はてなブログではMarkdownモードを使える場合もありますが、これまで書いてきたはてな記法の記事へ追記したい場合には、原稿を別の形式へ合わせる必要があります。

同じ文章をWordやPDFでも使おうとすると、また別の形へ整える作業が発生します。

文章を作る工程はAIによってかなり変わった一方で、その文章を実際の公開先へ持っていく工程には、まだ手作業が残っていました。

この部分を自分なりに整理したくて作り始めたのが、Markdownエディタ 「Yomu」 です。

最初は、公開先の形式までAIに頼んでいました

Markdownで作った原稿を別の形式へ変えたいだけなら、ChatGPTやClaudeへそのまま頼むこともできます。

たとえば、はてなブログで使いたければ「このMarkdownをはてな記法に変換してください」と頼めますし、WordPress向けの形式に整えてもらうこともできます。短い文章であれば、この方法で十分なこともあります。

自分も最初はそうしていました。

ただ、ある程度長い記事を扱うようになると、変換後の原稿を確認する工程が気になるようになりました。見出しの階層は元のままか、リンク先は変わっていないか、表の中身は抜けていないか、コードや記号はそのまま残っているか。形式を変えてほしいだけなのに、本文そのものまで少し変わっていないかも確認したくなります。

生成AIは文章そのものを扱えるからこそ、こうした柔軟さがあります。一方で、「内容はそのままで、形式だけ変えたい」という作業については、毎回生成AIへ任せる必要はないのではないかと思うようになりました。

文章を考えることと、決まった形式へ変換することは、別の工程として扱った方が自分には使いやすそうでした。

AIにはMarkdownまで。その先をYomuで整える

そこから、今のYomuにつながる考え方ができました。

自分の中では、AIには文章の構成や本文を考えてもらい、Markdownとして原稿を作るところまでを担当してもらう。そして、そこから先の公開先ごとの形式変換は別のツールに任せる、という流れです。

ChatGPT / Claude
        ↓
    Markdown原稿
        ↓
       Yomu
        ↓
WordPress / はてなブログ / note
        ↓
   Word / PDF / HTML

MarkdownからWordPress向けの形式へ変える。必要な場合だけ、はてな記法へ変換する。WordやPDFとして使いたければ、その形式で書き出す。

このように役割を分けることで、公開先が変わるたびにAIへ細かい指示を出す必要がなくなります。元になる原稿はMarkdownとして残しておき、最後の部分だけ用途に合わせて変えるという考え方です。

自分が記事を扱う中では、この形が一番しっくりきました。

Yomuで対応している主な公開先・出力先

## なぜMarkdownを途中に置いたのか

Markdownを選んだ理由は、特定のサービス専用の形式ではなく、人がそのまま読める状態で文章の構造も残せるからです。

たとえば、

## Yomuを作った理由

AIで記事を作る機会が増えました。

- WordPressへの入稿
- はてな記法への変換
- WordやPDFへの出力

このような原稿であれば、普通の文章として読める一方で、見出しや箇条書きといった構造も分かります。

最初からWordPress専用の形式や、はてな記法だけで原稿を持つより、Markdownの状態を一つ残しておけば、あとから別の用途にも展開しやすくなります。

Yomuでは、Markdownを公開前の共通原稿として扱い、必要なときだけ使う場所に合わせて変換する形にしています。

もちろん、何でもMarkdownにすればよいとは考えていません。最終的にWordだけで使う文章なら最初からWordで作る方が自然な場合もありますし、短い文章をnoteへ一度貼るだけなら、そのままコピーした方が早いこともあります。

Yomuが役立つのは、Markdownで作った原稿を、その後も複数の場所で使う場面です。

Markdownエディタは既にたくさんある。それでも作った理由

Yomuは、Markdownエディタが世の中になかったから作ったものではありません。

Markdownを書くためのエディタも、ファイルを確認するためのViewerも、形式を変換するサービスも既にたくさんあります。自分自身も、そうしたツールをいくつか使ってきました。

ただ、実際に使い続けていると、それぞれ少しずつ自分の使い方とは合わないところがありました。

広告が目立って作業に集中しづらかったり、画面構成が自分には使いにくかったり、Markdownを確認したいだけなのに操作が多かったり。反対に、Markdownを書くところまでは使いやすくても、その原稿をWordPressやはてなブログへ持っていく部分は、自分の用途とは少し違うこともありました。

自分が欲しかったのは、Markdownエディタとして機能数が最も多いものではありません。

普段使うMarkdown原稿を開いて、確認して、そのまま使いたい場所へ持っていけるもの。

既存のものと全く違うサービスを作りたいというよりも、自分ならこちらを使いたいと思える形にしたかった、というのが一番近いです。

「書くためのツール」だけではなく、「その先」まで扱いたい

Yomuでは、Markdownを書いたり、.mdファイルを開いたり、プレビューを見ながら内容を確認したりできます。

編集画面では、Markdown原稿とプレビュー、目次を見ながら作業できるようにしています。ただ、自分の中では、編集機能そのものよりも原稿が完成した後にどこへ持っていけるかを重視しています。

現在は、WordPress、はてなブログ、note、Zenn、Qiita、Word、PDF、HTMLなどで使うことを想定しています。

Markdownを書くためだけの場所ではなく、Markdownを次の場所へ持っていくための場所にしたい。

Yomuというツールを作るうえで、ここは最初から大事にしている部分です。

Yomuの画面

---

WordPressへの入稿で残っていた作業

自分の中で特に大きかったのが、WordPressへの入稿です。

AIでMarkdown原稿を作っても、それだけでWordPressの記事更新が完了するわけではありません。原稿をWordPressへ移し、見出しやリストを確認しながら、必要に応じてブロックとして整えていきます。

もちろん、画像やCTA、サイト固有の装飾など、WordPress上で最後に調整した方がよい部分もあります。YomuでWordPressの更新作業をすべて自動化しようとしているわけではありません。

自分が短くしたかったのは、その一つ前にある**「Markdown原稿をWordPressで扱いやすい状態へ持っていく工程」**です。

そこでYomuでは、MarkdownからWordPressの標準ブロック向けの形式へ変換できるようにしています。仕上げはWordPressで行いながら、その手前の単純な変換や整形を減らす、という位置づけです。

WordPressでの使い方については、oka-project側でも詳しく整理しています。

ChatGPTのMarkdownをWordPressに貼ると崩れる？ Gutenbergブロックへ変換する方法

はてな記法への変換も、実際の運用から生まれました

はてなブログにはMarkdownモードがあるため、新しい記事をMarkdownモードで書くのであれば、そのままMarkdownを使えます。

自分の場合に困ることがあったのは、これまで書いてきたはてな記法の記事へ、Markdownで作った内容を追加したいときでした。

既存の記事の形式に合わせようとすると、Markdownをはてな記法へ変換する必要があります。毎回AIへ変換を頼むこともできますが、先ほど書いたように、変換結果を元の原稿と見比べる工程も発生します。

それなら、必要なときだけYomuで変換できるようにしよう、と考えて追加しました。

Yomuでは「何でもYomuを通す」ことを目指していません。Markdownをそのまま使えるなら、そのまま使う。変換が必要な場面だけYomuを使う。そのくらいの位置づけが、自分には合っています。

はてなブログでの使い分けについては、こちらにまとめています。

ChatGPTのMarkdownをはてなブログに貼る方法｜Markdownモードとはてな記法の使い分け

AIを使って作っているけれど、全部をAIにする必要はない

Yomuの開発そのものにもAIを活用しています。

実装方法を調べたり、設計を整理したり、コードを組み立てたりする場面では、AIを使うことで個人でも扱える範囲がかなり広がったと感じています。特に「アイデアを実際に動くものへ持っていく」という部分では、以前より試せることが増えました。

一方で、AIを使えるからといって、すべての処理をAIに任せる必要はないとも考えています。

文章の構成や表現を考えるような、答えが一つではない作業ではAIが強い。一方、Markdownから別の記法へ変換するような、ある程度ルールが決まっている処理では、通常のプログラムで処理した方が扱いやすいことがあります。

Yomuでは、AIが向いているところと、決まった処理として実装した方がよいところを分けています。

AIを使うこと自体を目的にするのではなく、その作業に合った方法を選ぶ。今のところ、自分にはこの使い方が合っています。

公開前の原稿を扱うので、本文の処理はブラウザ内で

Yomuでは、入力したMarkdown本文の編集や変換をブラウザ内で行っています。

変換処理のために、入力した本文をoka-projectのサーバーへ送信・保存する仕組みにはしていません。公開前の記事や下書きを扱うことが多いツールなので、サーバーへ送る必要がないのであれば、その方が自分自身も使いやすいと考えたためです。

ただし、これは「oka-projectで作るものはすべてブラウザ完結にする」という方針ではありません。

今後、アカウントやクラウド保存が必要なサービスを作るのであれば、それに合った構成を選ぶと思います。Yomuでは、現在の用途に対してブラウザ内で処理する形が合っていた、というだけです。

Yomuでのデータ処理

---

自分用から始めたものを、同じように使う人にも

Yomuは、最初から大きなMarkdownサービスを作ろうとして始めたものではありません。

普段の作業の中で、AIを使って原稿を作ることは増えたのに、その後の変換や入稿ではまだ手を動かしている。そのときに、「ここにもう少し自分が使いやすい道具があれば」と感じたことが出発点です。

まずは自分が使うために作り、実際に使いながら気になったところを直していく。せっかく形になったのであれば、同じような作業をしている人にも使えるように公開する。

Yomuも、その流れから生まれています。

oka-projectでは、今後も小さなWebツールだけに限定するつもりはありませんが、こうした実際の困りごとから作り始めるという部分は大切にしたいと思っています。

改善要望や不具合があれば教えてください

自分の使い方では確認していても、別の原稿や別の使い方では、自分では気づいていないケースがあると思います。

たとえば、変換結果が期待と違ったMarkdownがあった、WordPressへ持っていったあとにまだ手作業が多く残った、はてな記法でうまく再現できない表現があった、ほかにも対応してほしい公開先がある、といったものです。

操作していて分かりにくかったところや、「ここがこうなると使いやすい」といった内容も含めて、改善要望や不具合はoka-projectのお問い合わせフォームから送っていただけます。

Yomuの改善要望・不具合を送る

すべての要望をそのまま追加できるとは限りませんが、実際の利用場面でどこに課題が残っているのかは、今後の改善を考えるうえで参考にしたいと思っています。

Yomuを使ってみる

基本的な使い方は、Markdownを開く、または貼り付けて、プレビューで内容を確認し、必要な形式へ書き出すという流れです。

基本的な使い方

Yomuは現在、ブラウザから利用できます。

Yomuを使ってみる

現在は登録やインストールをしなくても利用できます。

ChatGPTやClaudeでMarkdown原稿を作ることがあり、その後WordPressやはてなブログなどへ持っていく工程に手作業が残っている方には、一度試してもらえればと思っています。

また、Markdownを共通の原稿として複数の場所で使う考え方については、oka-projectでも詳しくまとめています。

ChatGPT・Claudeの文章をnote・WordPress・Wordへ使い回す方法｜Markdownを原本にする

Yomuは、自分自身でも使いながら、これからも少しずつ改善していく予定です。