Figmaを離れてClaude CodeでUIデザインをするようになった話｜Hikari

久々のデザイン記事です。以前はFigmaでゴリゴリにコンポーネントを作ってUIデザインをしていましたが、生成AIの登場によってデザイン業務の進め方も大きく変わってきたように感じています。今回はそんな私の最近のデザイン業務についてまとめていきます。 現在私は業務委託としてSaaSプロダクトのソロデザイナーとしてプロダクトデザインに携わっています。AIが出てきてからというものPMからAIが作成した動くモックが仕様書として上がってくることが多く、それならこれを改造してデザインしちゃえばいいのでは？と思ったのがキッカケでした。 この運用が成り立つ前提環境まずエンジニアとPMに相談して現在の開発環境状況を把握しました。この体制に入る前に以下の部分が既に用意されていました。 GitHubに最初から揃っていたものアプリのリポジトリ（画面のコードがここにある） shadcnベースのコンポーネント群（デザイ

[strawberryhunter]

FigmaもAdobe XDも最初から無いわー。最終成果物の表現力が無い偽物を使うのは最終成果物を作るための知識やスキルが無いからでしょ？

[m4fg]

自分は逆にfigmaに回帰したな。figmaのコメントに書きまくって、llmにコメント対応して。が楽

[kijtra]

個人的には Claude Design の方がピンポイントの修正とかやりやすいかも。Codeにも連携できるし。

[yellowsoil]

UIデザイナーは海外で7〜8割くらい失業してると聞いた。

[syu-m-5151]

動くモックを作れても、そのコードを本番へマージするとは限らない。既存部品を使い、デザイン専用ブランチを仕様の参照先にする運用が具体的だ。確認する人に開発環境がなければ、別途プレビュー環境も要る。

[myaoko]

環境が揃わなくてすぐには真似できないけど、こういうの事業会社の内製でもできるようになっていかないといけない気がする…

[nguyen-oi]

文脈を三層に分ける設計思想が秀逸。デザインとコードの距離が完全に縮まってるな