Railcodeのデベロッパーが、コーディングエージェントを使用して自社のウェブサイトを構築した詳細な記録を共有した。これは、AIがいかにして低品質な「スロップ」を生成するのではなく、洗練されたデザインのために活用できるかを示すものである。
クリエイティブなプロセスには、ClaudeやFableといったエージェントを用いたいくつかの反復的なステップが含まれていた。最終的なデザインをすぐに生成するのではなく、デベロッパーはエージェントを使用して、ASCIIデザインやミニゲームを含むさまざまなコンセプトを探索し、クリエイティブなビジョンを確立した。このプロセスでは、ゲーム『Rollercoaster Tycoon』にインスパイアされた要素を取り入れたり、色の遷移やアニメーションを試したりするなど、特定の審美的な目標を実現するためにAIを使用することに重点が置かれた。
デザインのコントロールを維持するために、デベロッパーは、後にReactコンポーネントに変換される単一のHTMLファイルを用いるワークフローを活用した。これにより、エージェントによる効率的なフォークや並行編集が可能になった。さらに、理想的な視覚的トーンを見つけるために、異なる配色や変数をテストするための「プレイグラウンド」が作成された。既存のデザインから得たインスピレーションと、AIによる反復的な洗練を組み合わせることで、プロのデザイナーではないにもかかわらず、デベロッパーは一貫性のある意図的なウェブサイトを作り上げることができた。
出典
- How our vibe coded website looks like a designer made it （Hacker News Frontpage, 2026-09-29）