デザイナー目線でClaude Codeを使って気づいたこと
Claude Codeと一緒にアプリやサイトを作ってきた中で見えてきた「コードを書かない開発」の本質について。
コードは書いていない、でも作っている
ここ数ヶ月で、いくつかのプロダクトを形にしました。
- コーポレートサイトの WordPress → Astro 移行
- Figmaファイルを検索できる React アプリ
- 数百件の制作物の棚卸しと一覧化
- 自分のポートフォリオ
どれも「開発」と呼ばれる領域の作業を含んでいます。でも、自分はコードを一行も書いていません。すべて Claude Code との対話で実現しました。
「コードが書けなくてもいい」は半分正しい
よく「AIがあればコードが書けなくても大丈夫」と言われます。それは半分正しいけれど、半分は誤解です。
コードを書く能力の代わりに必要だったのは、設計意図を言語化する力でした。
「こういう画面にしたい」「この色はこう変えて」「検索はこう動いてほしい」「下書きを公開前に確認したい」——やりたいことを具体的に伝えられないと、Claude Code もどう実装すればいいかわかりません。
デザイナーは日頃から「なぜこのレイアウトなのか」「なぜこの色なのか」を言語化する訓練をしています。それがそのまま、Claude Code への指示の精度につながりました。
フィードバックループが開発そのもの
実際の作業は、こんなサイクルの繰り返しです。
- やりたいことを伝える
- Claude Code がコードを書く
- ブラウザで確認する
- 違うところを伝える
- 修正される
- 繰り返す
これはデザインのレビュープロセスとほとんど同じです。デザインカンプを見て、フィードバックして、修正して、また確認する。開発者に実装を依頼するときのコミュニケーションとも似ています。
違うのは、相手がAIなので応答が速いことと、何度やり直しても嫌な顔をされないこと。
つまずくのは技術ではなく判断
開発で一番困ったのは、技術的な問題ではありませんでした。
- 「SSRモードに切り替えたほうがいい」と言われたとき、それが何を意味するのかわからなかった
- 選択肢を提示されたとき、どれを選べばいいか判断できなかった
- エラーが出たとき、それが重大なのか無視していいのかわからなかった
技術的な知識がゼロだと、判断を Claude Code に委ねることになります。結果的にはほぼ正しい判断をしてくれましたが、「なぜその選択なのか」を理解できないまま進む場面もありました。
少しずつ、繰り返しの中で「ああ、こういうことか」と腑に落ちていく感覚があります。コードが読めるようになったわけではないけれど、構造の理解は確実に深まっています。
デザイナーにとっての Claude Code
Claude Code は、開発スキルを代替するツールではなく、設計意図を実装に翻訳するパートナーです。
デザイナーが持っている「どうあるべきか」の感覚——それをコードという形に変換してくれる。逆に言えば、「どうあるべきか」がない状態で Claude Code を使っても、何も生まれません。
作りたいものの解像度が高ければ高いほど、Claude Code のアウトプットの精度も上がる。それは、優秀な開発者に仕様を伝えるときと同じです。
これからやりたいこと
まだ「Claude Code が書いたコードを自分でも理解したい」という気持ちがあります。全部を理解する必要はないけれど、構造を把握できれば、もっと的確なフィードバックができるはず。
このブログ自体が、その学びの記録になればいいなと思っています。
