皆さんは最近なにかと話題の開発ツールのAIであるCodexやClaude Codeといったアプリを使っているでしょうか。
これらのツールを使うと、日本語で話しかけるだけで驚くほどいろんなものが作れてしまいます。
それこそ最初は簡単に動くWEBアプリを作っていたのですが、気がつけば動画編集用のツールや自動字幕生成アプリなど、あれもこれも作れることに気がつきました。
そして使い始めて1週間、なんとiPadのアプリの開発までできてしまいました。
僕自身は未だにコードも言語も一切なにもわからない人間なのですが、思い通りのものが作れるようにツールが発達していて驚きしかありません。
今回はここ数日時間をかけて制作を進めたノートアプリについて紹介します。
使ってみたいとか、ここがさらにこうなると良いみたいなご意見あれば是非教えていただきたいです。
無限ノートアプリを作った
今回自分で作ってみたのは無限キャンバスが使えるノートアプリ。
これまで感じていた自分の不満を取り除いた、今のところ自分専用のノートアプリ。
特徴としては下記。
- アプリ名：SeedNote
- 思考を整理する前の「種」を自由に書き残せる
- ノイズを減らした静かなUIで深い内省に集中できる
- ラフ・感情・アイデアを制限なく広げて思考できる
- ドットと余白を活かした、視認性の高い思考空間設計
- ノートを管理しやすいホーム画面
- タブでノートの即時切り替え
- サイドバーでノートを呼び出し可能
これからまだまだ実装したい機能はあるんですが、ひとまずこれくらいのことができる無限キャンバス系ノートアプリを自作できました。
描画性能は自作なので心配していたのですが、自分の使用では問題ないほどスラスラ動きます。
主に思考整理とかアイデア出しに使いたいと思っているので、刺激の少ない色味のUIで、シンプルに集中できるようなデザインに設定。
さらにノートアプリを使っていてあるとやっぱり便利なタブ機能、そしてノートの画面から移動せずに関連するノートを引っ張って来れるようにサイドバーでの検索を実装。
最後は画像やPDFで出力したり、AIに素早く投げられるようにしたり、適正な保存や活用ができることもこれから詰めていく予定です。
このように、思考をひたすら書き出すために、ツール側の都合で余計なことに悩まずアイデアや考えに没頭できるツールというのを目指しました。
使用ツール
今回の開発は主にCodexで進めました。
CodexはChatGPTから開発要素を分けたようなアプリで、無料範囲でも少し使えるそうです。
開発ガッツリやるなら課金がおすすめ。
そして、設計の初期段階や詰まったときに使ったのがClaude Code。
デザイン性などはこちらの方が丸投げしたときの品質が良いように感じたので、UIについてはClaude Codeに実装してもらうことが多かったです。
これら2つのアプリは最近話題なので聞いたことがある人も多いと思いますが、何ができるのかというと、日本語でやりたいことの指示をするだけで、思い通りの機能を開発してれるツール。
本当に日本語話すだけで作ってくれます、驚きすぎる。
今回の実装についてもコードは一切書かず（というか書けない）、日本語であれこれ指示をして実装や修正を繰り返して作り上げました。
最近のこれらのツールはデスクトップアプリを入れて日本語で伝えるだけでかなり満足度の高いツールを作り出してくれるので、一度さわって遊んでみることをおすすめします。
開発経緯
かなり書いて整理することが多く、これまで無限キャンバス系のノートアプリで思考整理をして生きてきました。
それこそ、やりたいこととか実現させたいこと、不満なこと、仕事の整理とか、いろいろなアイデアや本音はテキストというよりは書いた方が整理できることが多かったので、時間をとってひたすら内省を深めるとかアイデアを出すということをしています。
しかし、そこで壁になってくるのがアプリの性能。
これまでMapNote2というフリーボード的なアプリをメインで使っていろいろ書いていました。
これまでの何度か紹介したり、僕のiPadのホーム画面が映っている動画を見たりしてもらえればわかると思うのですが、ずっとdockの1番左側、Goodnotesよりも優先度の高いアプリとしてここに置いています。
このアプリはシンプルなUIでひたすら書き続けられるのが魅力で、思考をさまたげずにいろいろかけます。
自分の内省はもちろん、仕事関係としては教員時代は授業のスライドを作るときのラフとかコンテンツ制作職時代も記事制作のメモとか、いろいろ書き溜めていました。
しかし、このアプリ管理のUIが良いとは言えず、ノート機能は1番気に入っているものの、ノート以外に不満を抱えています。
ではフリーボードはどうなのかというと、管理のUIやノート自体の動きも良いのですが、Apple純正の挙動であるペンシルのツールの表示がどうしてもずっと気に入らなくて使えず。
Goodnotesはずっと無限キャンバスには対応していなかったのですが、昨年頃に対応したようで、挙動や拡張性としては現状の最適解とも言えるほどのクオリティ。
でもブルーのコーポレートカラーとか、他にもいろいろできる多機能さに気を取られてしまい落ち着かない。
アイデアベースだとどうしてもささいなことでも気が散って表出できなくなるので、なるべく集中できて途切らさず、そして使いやすいというのを追い求め、ずっと気になっていた不満をそれぞれ解消できるような自分にとって満点なアプリを作ってみました。
機能と開発について
どんな機能とどのように作っていったのかについても解説していきます。
まず使用ツールは先ほども伝えたようにメインはChatGPT系譜のCodex。
デスクトップアプリもあるのでPCある人は無料プラン範囲で使ってみて遊んでみると良いと思います。
そして、デザイン実装の仕様書や詰まったところの解決をClaude。
どっちが良いのかは僕には判断しかねるのですが、エンジニアの人とかはコード品質だったり、拡張性だったりでClaude Codeを選んでいる人が多い印象です。
構想
最初どのようなアプリをつくるかというところですが、この段階ですでに雑にCodexに「無限キャンバスのノートアプリが作りたい、作って」みたいなお願いをしてもなんとなくいい感じのアプリを作ってくれます。
それくらい簡単です。
とはいえ、それでは自分が満足できないので、基本的には最初はChatGPTやGeminiなど、もう今ではいろんな人が馴染み深いであろうチャット形式のAIと壁打ちを進めます。
僕は今回ChatGPTで行いました。
「フリーボード的な書き込み系のiPad用アプリを作るのは妥当？」みたいな簡単な質問から壁打ちを始めました。
そこからペンシルの遅延は問題なさそう？とか回答に出てきたことについて再度質問するとかして、だんだんアプリの開発仕様とかを詰めていきます。
ここでは遠慮する必要はなく、無理なら切ってとか無視してとか言っておくと、達成できるところだけ実装してくれました。
ひとまず情報を与えるとか気になるところを言い切ることが出来上がりにかなり影響出るなという感じ。
そして最後は仕様書を考えてというと、Codexにコピペすればアプリが仕上がる仕様書が簡単に完成します。
アプリ作るときはいつもこのフローで、仕様書を作ってもらってコピペで対応。
構想段階からAIに頼りっきりです。
機能
機能については「ノートの快適な管理」「スムーズな描画」「出力の多様性」などを意識しました。
まず気になったのはせっかく書いたアイデアの種がどこにいったかわからないという問題。これは絶対に避けなくてはいけません。
そのため、MapNoteでは課題だったフォルダ機能を重視して実装。
この辺りはGoodnotesが使いやすいと感じているので参考にしました。
フォルダを新規で作れて、ドラックアンドドロップでの操作にも対応。 そしてフォルダのなかにさらに下の階層のフォルダの作成にも対応。
これでかなり正確にノートを管理できます。
このデザインに関して、今回はChatGPTがいい働きをしてくれて、ホーム画面のモックアップなどをかなり良い感じに作り上げてくれました。
開発思想とかを壁打ちしたチャットにそのまま「ホーム画面のモックを作って」とお願いしたらかなり良いのが出来上がってきました。
Codexでポン出しのデザインやらせたときは微妙かと思ったのですが、ChatGPTの画像出力はかなり良くて驚いています。
そしてそのモックを参考にホーム画面を実装しました。
実装の際には一度チャットの方でカラーの読み取りとかデザインの情報について指示が狂わないように実装の仕様書を作って、みたいにお願いすると精度が上がりやすかったです。
ホーム画面はMapNote2の雰囲気を残しつつ、多機能さを追加しました。
機能性のポイントとしては「タブ機能」と「サイドバー」。
MapNote2はシンプルな1画面だったのですが、関連のノートを探して行き来する場合があり、そのときが本当に面倒でした。
これを解決できるのがタブ機能で、あらかじめ開いておけばサクサク切り替えができます。
さらに関連するノートをわざわざホーム画面に戻って探さなくても良いように実装したのがサイドバー。
ここにはフォルダやノートが表示され、タップするとタブに出現します。
そのおかげで、必要なアイデアとか、前に書いたものなどを素早く検索可能。
このサイドバーについてはGoodnotesにもない機能だと思っています。（設定調整するとできるとかあればすみません。）
書き出しにももちろん対応し、画像やPDFで共有できます。
共有関係ですが、notionのDBに接続することもできたので、書いたメモやボードの情報などを保存しておいて、notion側でもアイデアの管理をすることもできそうです。
この辺りの連携はもう少ししっかり連携できるように機能を詰めたいところ。
これから実装したい機能
アイデアの経過とかをピン留めとかだと忘れそうな気もするので、タグ機能をうまく使ってnotionのボードビューみたいな感じで、進行状況別に整えられるビューとかを作りたいなとかは思っています。
あとはnotion関係で、1つ1つのボードとnotionのページを繋ぐ設定。
内部リンクみたいなのを発行して、notion側からリンクをふむとメモのボードに繋げられるみたいな機能。
無理ではないっぽいのですが、実装がちょっと難しくて手が止まったので、理解が追いついたら実装したいと思っています。
理想のツールがつくれる
もう今は日本語で指示さえできればツールやアプリが作れてしまいます。
もちろん、配信するのであれば安全を担保しなくてはいけないので、簡単に配布ができるわけではないのですが、自分用で使うのであれば1日あればアプリができてしまうほど。
とはいえ、ここまでアプリの実装を詰めたのであれば、なんとか安全管理の面も突破して、リリースをしたいと考えてしまいます。
このアプリですが、現状Goodnotesとかフリボードとも重なるところはあるのですが、勝ってるところもあると思いますし、使いやすさはかなり自信があるので、なんとかリリースみたいなこともやってみたいなと思っています。
気になる人は気になるところとか、そもそも使ってみたいかとか教えてもらえると励みになります。
まとめ
ここ数日かかり切りになっていたアプリの報告でした。
もうここまで実装できて作り出せてしまうことが本当に驚きです。
意外と簡単に使えるし作れるので、ぜひ開発アプリを使ってみて、できたアプリとか使いやすいものとかあれば教えてください！
コメントを残す