デザイナーとして体験を磨き込むためのエンジニアリング / Engineering as a Designer: Polishing the Experience

登壇者名：avocadoneko
登壇したイベントタイトル：KomeKaigi 2026
登壇したイベントのURL：https://fortee.jp/komekaigi-2026/proposal/62ec8355-635d-4a39-8f1c-1dd5e51a8cb5

Transcript

1. デザイナーとして 体験を磨き込むためのエンジニアリング あぼねこ / 株式会社ビットキー 2026.10.31 Kome Kaigi 2026
2. Profile あぼねこ @avocadoneko 株式会社ビットキー iOSアプリをメインに、さまざまなプロダクトの体験 改善や新機能開発などを担当。 2019 新卒1年目：エンジニア 2020 デザイナーにキャリアチェンジ 2024 ビットキーに入社 ←イマココ
3. 柏崎市
6. ？ AIで仕事の幅が広がった人？
7. わたしの現在地
8. 2025 2026
9. 2025 2026 し い な く ご す に 別 意味􀄩がない り ま あ
10. × デザイナーとして生み出したい価値は、 エンジニアの代わりになることではない。
11. じゃあ... デザイナーが実装まで関わると 何が変わるのか？
12. 実装に関わることで、変わった2つのこと 01 体験の磨き方 02 PJメンバーとの 関わり方
13. わたしにとっての「実装」は デザインを磨き込むための手段。
14. 実際の業務での動き方
15. 事例 ①： 体験の磨き方 さわって確かめ、細部を磨く
16. 置き配サービス ペットシッター 会議室・座席予約 入退室 施設利用 無人受付 入退室 賃貸契約 エレベーター連携 権限管理
18. Before After Liquid Glassに対応しました
19. 以前の進め方 実装前 このデザインの実装お願いします この画面はどう動く想定ですか？ エンジニア ここではダイアログを出したいです ではこの画面はどうしますか？ ここではコンポーネントを使って… 確認が繰り返される 実装後 実装できたので、 確認をお願いします ここは余白をもう少し大きくして… 修正します！ こっちは色をここに揃えてください 修正します！ 確認と修正が繰り返される
20. 現在の進め方 実機で確かめながら、修正を繰り返す AI 修正意図を 伝える コード修正 実機確認 コードレビュー エンジニアが確認
21. 気づいていた小さな違和感を、見送らずに直せる これまで 気づいていても 依頼せず、 見送ることがあった 色が違う..い.けいど や... 時間ないし いま 自分で調整し、 納得いく仕上がりまで 磨き込める 自分で ！ なおすぞ
22. 体験の磨き方の変化 自分でも手を動かし、
 使い心地を確かめながら磨けるようになった
23. 事例 ②：PJメンバーとの関わり方 相談から実装まで一緒につくる
24. スマートロックデバイスの設定を 新しいデバイスへ引き継ぐ Old New
25. 動くものをたたき台に、仕様を詰める AIでモックを試作 PdM・CS・エンジニアに ヒアリングしながら仕様を固める Figmaで画面・遷移を整理 解像度を上げて話せるようになった
26. デザインした画面を自分で実装する Figma 実装してみて分かった制約をもとに UIも調整 実装
27. 分担してつくりこんでいく エンジニア UI・細かな 挙動を実装 バックエンドを 実装
28. PJメンバーとの関わり方の変化 仕様を考えるところから実装まで、 チームの中で自分が関わる範囲が広がった
29. 課題に合わせて
 使う道具も、自分が担う範囲も選択肢が広がった 事例 ①：Liquid Glass対応 では... 自分で直接調整し、実機で確かめる 事例 ②：デバイス交換 では... 動くモックで仕様を検討して、 画面・遷移をFigmaで整理してから実装する
30. AIに任せる作業と、自分で手を動かす作業を選ぶ過程で 自分の好きや強みが見えてきた。 りょ！ コードの修！正は まかせた
31. 関わり方が広がって得られたこと 2つの変化 得られたこと 体験の磨き方 形にするまでのスピード チームとの関わり方 プロダクトの品質
32. この進め方を支えているもの
33. エンジニアに支えてもらう 的 環境構築 技術的な相談 コードレビュー
34. エンジニアに支えてもらう 的 環境構築 技術的な相談 コードレビュー
35. レビューしてもらいやすくするために はいぃ... ここ ちがうぞ AIで実装してもPRの内容は エンジニアと同じ 自分で説明できるように レビュー用のSkillを使う
36. つくりながら、実装への理解も深める 分からないことをAIに聞きながら進める コードの書き方も学び、 UIの細部は自分でも調整できるようにする
37. 個人の経験からみんなの選択肢へ
38. それぞれの仕事や課題に合わせて AIの取り入れ方が広がっている たとえば... コードから 仕様を確かめる モックをつくる 業務を助ける プロダクトをつくる
39. 関わる範囲が広がっても、専門性はなくならない 専門性 専門性 デザイナー エンジニア
40. 関わる範囲が広がっても、専門性はなくならない with AI with AI 専門性 専門性
41. × 専門性を持ったまま、最後まで一緒につくる