はじめに

いま超話題のClaude Designを雑に試してみました。

Claude Designを試してみた結論

とりあえず実際に触ってみた結果をまとめていきます。

今回リデザイン対象としたアプリ：

Claude Designの画面から新しいプロトタイプを作成します。

「コードベースを添付する」を選択します。

「翻訳アプリのUIデザインを行けてる感じにしてほしい。」（誤字）とプロンプトに入力して動かしてみました。

「デザイン案を何通り提示するか」などいろいろ質問されるため回答していきました。

今回は４～５案を提案してもらった中から選択しました。

以下がClaude Designで作成したデザインになります。

おお！カッコいい！！イケてますね！
これはキャプチャですが、実際は動く様子を見せてくれます。
デザイナーの仕事はわかりませんが、これを基の顧客とデザインを詰めていくことができそうです。

デザインが確定したので、このデザインで実装してもらおうと思います。

・・・と、実装を開始したところで、残念ながら利用料上限を迎えてしまいました。（早）

モデルを確認したところ、Opus4.7がデフォルトで選択されていました。あー、なるほどねぇ…
とりあえずSonnetに変更しました。

24時間後にリトライしてと書かれてましたが、24時間後ではダメでした。
何度かリトライしていたら1週間後の火曜日にリトライして、とポップアップには出ましたが、何故か土曜日には使えるようになってました。

以下の画面で現在の使用量が確認できます。
使用量

時が経ち、使用制限が解除されたため実装を開始してもらいました。

ローカルフォルダへのアクセスを許可しました。

実装が完了したかのような表示が出て処理が止まりました。
ワクワクしながら画面を更新しましたが、デザインが変わらないため聞いてみました。

さっきローカルフォルダへのアクセス許可したのは何だったのか分かりませんが、書き込めないようです。
提示されたファイルをダウンロードしてローカルのファイルに上書きしました。

おお！！なんかデザイン変わってる！！
　
　

・・・あれ？デザインこんなんだっけ。。

↓最初に提示されたデザイン

全然違う。。
ほぼ色しか変わってないじゃん。。

再びファイルの差し替えを指示されたのでやってみましたが、あまり変わりませんでした。

この後、何度かリトライした結果が↓こんな感じ。

うーん、最初のデザインを上辺だけパクッて作ったようなデザイン…。
単純に見づらくなったのとバグが出てきました。

Claude Designの利用上限に達したため、今回の検証はここで終わります。

リデザインは大量のコードを読ませるため、やはり難しそうです。
最初にClaude Designでデザインを決めてからClaude Codeでコーディングすればもっとうまくいくと思います。

私もまだ全然試せていませんが、いったん現状で情報共有しておきます。
まだClaude Designの情報があまり出回っていない理由は、
すぐに利用上限を迎えてしまい試しきれていない人が多いためと予想します。
自分もまさにその状態でした。

私の検証が誰かの役に立てば幸いです。