ご機嫌で執筆が捗る!macOS向けWordPress専用デスクトップエディタを自作してみた。

Claude Codeのコーディング能力に脱帽、何かソフトウェアを開発したくなり、WordpressというブログサービスのmacOS向けのデスクトップエディタを開発した。Claude Codeが環境構築を含めて、実装からテストまでやってくれたから、コードの中身をまったく把握することなく、数日でプロトタイプが完成してしまった。

せっかく自作するのであれば、自分好みを全面に押し出すことに。最近は白やグレーを基調としたトバログさんの世界観にハマっており、Claude Codeにトバログさんのブログ記事を参照させてデザインしてもらった。その結果、ソフト名も「Tobalog-writer」と名付けられ、個人利用なのでその名称も踏襲させてもらっている。

自作エディタの画面は下のスクショの通り、自分の必要最低限の機能のみなので使い勝手は最高、文字の大きさやフォントも自分好みに仕上げた。

〈 Tobalog-writerの全体のUI〉

括弧で単語を囲む機能をトップバーに追加した。選択した文章を簡単に括弧で囲めるようになったので、手間が省けた。地味だけど個人的には嬉しい改善だ。BRUTUSなどのおしゃれな雑誌ではブランド名を矩形の括弧で囲っているのをよく見る。トバログの記事もそのようにしているから、エディタでも同じように再現できるようにした。一気に雰囲気が引き締まる気がする。

画像の挿入のサイズ変換、クロップ、色補正も本エディタで完結できるようにした。クロップの比率はシネマティックな雰囲気を醸し出す16:9に固定、色補正もSigmaのFOV Classic Yellowを意識したRETRO FILMを追加した。

〈 画像の挿入のサイズ変換、クロップ、色補正も本エディタで完結〉

生成AI機能も忘れてはいけない。下のスクショの右下の欄に注目して欲しい。選択した文書に対して、生成AIにて文章を推敲する機能を実装した。生成AIにはLocal LLMを採用しているので、オフライン環境で文章を簡単にレビュー、修正箇所はオレンジ(トバログさんはグレーxオレンジという組み合わせを多用)でハイライト、ワンクリックで本文に反映される仕様とした。尚、生成AIにはトバログさんのブログ記事の文体を解析させた上でプロンプトに反映しているので、トバログさんの雰囲気に近い推敲結果が返ってくる仕様だ。

〈 本文の文章を選択、生成AIの推敲機能を実装〉

あとは記事固有のURLの末尾のスラッグの生成AIによる自動生成、記事のローカル保存する機能、Wordpress上の記事の編集等の機能を実装している。

使っているうちに細かい改善点が出てくると思うけど、今のところは大満足だ。誰でもソフトウェアが開発できるなんて、すごい時代がやってきたものだ。