コードを理解してないとけっきょく回り道になる

私はWebデザイナーで、コーディングはほぼできません。今までFigmaもほぼ使わず、Photoshopでサイトのデザインをしてきたタイプでもあります。

今回、あるクライアントのLPを自分で組まないといけなくなり、いろいろなAIツールを試しました。試した順番はこんな感じです：

1. Claude Designに design.md を渡してまるごと作ってもらう → うまくいかない
2. Figma Make に頼む → 同じく、うまくいかない
3. Google Stitch で叩き台を作る → Figma に貼って手で直す → 今のところこれが一番マシ
4. ある程度Figmaまで組んでからFigma Makeに頼む → わりと良いのが出る（ただし無料は1日1回のガチャ的な使い方になる）
5. Figma to Web系プラグインで「Figma → コード」してコードをAIに直してもらう → これもうまくいかない

ここで気づいたのは、シンプルな結論でした。

コードを理解しないままAIに作ってもらうより、ある程度コードを理解してAIに頼んだ方が結果的に早い。

Figmaも同じで、レイヤーが整っていないと、どんなAIツールに渡しても出力がブレます。結局、レイヤーは自分で整理する必要がある。

ただ、ここで「やっぱり全部手作業に戻る」かというと逆で、いまの作り方はこうなっています：

• Google Stitch：土台のレイアウト生成
• Figma Make：ガチャ的に整えてもらう
• 画像生成AI：イラスト・アイコン・部分レイアウト案
• Claudeなど：初期コードのたたき台

AIをパーツごとに使い分ける形に落ち着きました。

あと、地味に大きいのが コードを手打ちしなくて済むこと です。なぜなら私はブラインドタッチができないからです。（Webデザイナーをやっている人で、ブラインドタッチができないのは私くらいなんじゃないかというくらい、みんな当たり前にできていますよね。）コードを手で打たなくていいだけで、コード領域に踏み込むハードルがかなり下がりました。これは個人的に、AIの恩恵で一番大きい部分かもしれません。**

「AIに全部丸投げできるかも」と一瞬期待しましたが、現実は「AIに丸投げ」と「全部手作業」の中間のどこかに自分の居場所がある、という感じです。

【カジュアル面談をお待ちしています】

Webデザイナーとして10年ほど、制作会社と葬儀業界の事業会社にインハウスで勤め、2023年に独立しました。ずっと「デザインまでが自分の担当で、実装はエンジニアの仕事」だと思っていました。いまはAIに頼りながら、React / TypeScript / Tailwind を自分で読み書きして作れるようになるための学習中です。直近はスマホサイズで公開まで通しました。まだ途中です。

こういう「学習中の人間」が、採用する側からどう見えるのかを率直に知りたいと思っています。現在地を正しく知りたいです。

いまは事業側で、現場に入って人の声を聞きながら改修や制作をしていく方向に行きたいと考えています。ただ正直なところ手を広げすぎていて、専門性としてどう見せるのがよいか自分でも決めきれていないのが悩みどころ。