人間がアプリのロジックを作って、Claude Codeがデザインを当てる

人間がアプリのロジックを作って、Claude Codeがデザインを当てる

まずhata6502が、デザインを当てずにReactアプリを作る

Claude CodeCatalyst UI Kitを渡して、デザインを当ててもらう
リポジトリ直下にcatalyst-ui-kitディレクトリを置いておく

一発でここまでデザインを適用できた
横幅が揃ってなかったり、手直しは必要

hata6502による手直し後


この方法なら、ある程度の独自っぽさを保ちながらデザインを当てていけそう
たとえば以下の3サイトは、雰囲気を似せている
Catalyst UI Kitのようなお手本を与えずにデザインを当てると、毎回バラバラになりそう

こんな役割分担
精度の高いシステムを作るのはhata6502
写真内のマツボックリ検出 → OpenCV.jsのコーナー検出
Claudeが生成した雰囲気コードでは、まともな精度を出せなかった
表向きの文言やデザインは、正直hata6502よりClaude Codeのほうが親しみあると思った
「素晴らしいマツボックリ探索でした!」とか思い浮かばなかったけど
ゲームっぽい言い回しな気がする


2025/7/13 くっきりレンズの開発でも、いい感じにデザインを当ててくれた
before
after
ボタンが紫色なのがいい感じ
hata6502はいままでprimary buttonには黒を使ってたけど、彩度高めの紫だと見慣れたアプリっぽく感じられた
Powered by Helpfeel