「150件のUIフィードバックをぜんぶデザイナーで直すことにした」の裏側で、エンジニアは何をしていたのか

■ イベント
Claude Code時代の「職能越境」を支える、環境構築とワークフロー設計
https://levtechlab.connpass.com/event/396162/

■登壇概要
タイトル：「150件のUIフィードバックをぜんぶデザイナーで直すことにした」の裏側で、エンジニアは何をしていたのか
登壇者：技術本部 Data Intelligence Engineering Unit 茂木 慎之舗

■ 技術本部 採用情報
https://media.sansan-engineering.com

Transcript

1. Claude Code時代の「職能越境」を支える、環境構築とワークフロー設計 「150件のUIフィードバックをぜんぶデザイナーで直すことにし た」の裏側で、エンジニアは何をしていたのか 技術本部 Data Intelligence Engineering Unit 茂木 慎之舗
2. 茂木 慎之舗 Sansan株式会社 技術本部 Data Intelligence Engineering Unit Sansan Data Intelligence のプロダクト開発エンジニア フロントエンド〜バックエンド領域を担当 同期のプロダクトデザイナーの来住と非エンジニアが自走できる環境の 整備もしている
3. https://note.com/sansan_cpo/n/nd19651274fe8
4. Q. 裏側でエンジニアは何をしていたのか？
5. A. 何もしていない
6. 越境のコストは、本人の努力ではなく、 環境が引き受ける
7. なぜ150件も溜まったのか？
8. 当時の開発環境に必要だったもの
9. バックエンドを物理的に消す Before: フロントエンド → バックエンド（Go）→ Spannerエミュレータ After: フロントエンド → モックトランスポート （バックエンドは存在しない） モックトランスポート
10. 舗装する - 所要時間 30〜60分 - すべてコピペで完走 - つまずきポイント先回りの トラブルシュート付き > この手順書をClaude Codeにそのまま投 げても動く
11. 新しく作ったものは、ほぼない（流用する） - - 新しく作ったもの - mock mode - 手順書 既にあったもの - CLAUDE.md / コーディング規約 - ADR - PR自動レビュー（claude code action） - デザイントークン / デザインシステム > AIも新規メンバーも「コンテキストを持たないでやってくる」点で同じ
12. 教えたのは Shell/Gitだけ - 人間が教えたこと 以上
13. 自走の軌跡 初期のcommit 3ヶ月後のcommit
14. 安全も、環境が引き受ける デザイナーが安全に修正できるのは、ガードレールが敷いてあるから ①そもそも触れない 物理的なデータ隔離とモックトランスポート 手元に実データなし ②壊れたら機械的に気付く VRT: 人間がUIを壊したら、 人間よりも先に機械が気付く CI: Build / Lint / UT / Playwright / VRT ③危険を持ち込ませない 脆弱性と依存関係の自動ガード Trivy スキャン / pre-commit ④二重レビュー AI+人間のレビュー AI自動レビュー 人間のレビュー AI+人間のレビュー
15. 環境が引き受けられないもの - 線を引いたもの - レビュー：デザイナーのPRでも特別扱いしない。 AI自動レビュー＋エンジニアのレビュー（通常のPRと同じ基準） - 領域：バックエンドが絡む変更、複雑なドメイン（検索条件周りなど）は デザイナーの領域にしない - 線は今も引き直し続けている
16. 越境して起こった変化 ー 個人が得たもの ① a11yの意識 ー 見た目だけではなく、使う人全体を意識した判断が可能になった ② アーキテクチャの意識 ー 実装の背景を踏まえた上で、あるべき形を考える ③ エンジニアとの対話 ー 共通言語ができ、一方的な依頼ではなく対話ができるように
17. 越境して起こった変化 ー 組織が得たもの ① 詰まりの解消 ー デザイナーの修正がエンジニアを経由しない ② 横展開 ー デザイナーが教える側になり、環境をセットアップするデザイナーが増えた ③ ユーザー体験の向上 ー 技術的制約やアクセシビリティなどを会話しながら進められる ④ デザインシステムの開発が、デザイナー主導で始まった
18. まとめ - デザイナーに教えたのは、Gitの基礎だけ - 越境のコストは、本人の努力ではなく、環境が引き受ける - 越境の結果、UX向上・職種間の円滑なコミュニケーションが可能に