AI×VRT SSOTな UIカタログで手戻り抑制
>100 Views
July 09, 26
スライド概要
https://increments.connpass.com/event/387592 で登壇させていただきました。
Web エンジニアやってます
関連スライド
Meta XR SDK(V66-74)でQuestアプリを開発
あうぜん
1.2M
各ページのテキスト
AI×VRT SSOTな UIカタログで手戻り抑制 Motone Adachi | x.com/waritocomatta (撮影/SNS: OK)
お礼 と 自己紹介 - エンジニアやってます👨💻 ㈱ビザスク と ナイトランプ(同) に所属 システムリプレース や 社外技術支援 等 ← 2社とも Qiita 投稿 や AI 活用 💪 企業アドベントカレンダー完走 / AI関連の記事多数
https://github.com/fumiya-kume/ai-in-japan
🎨 Figma上にあるUIコンポーネ ントがプロダクトに実装されて ない / 見た目が違う こんなお悩みは ございませんか？ とくに デザイナ / エンジニア / PdM 👻 プロダクトに実装されてるが Figma に存在しない幽霊UIコン ポーネントの存在 🔥 依存ライブラリの更新で見た 目が崩れないか心配 & デグレの チェックも大変
🎨 Figma上にあるUIコンポーネ ントがプロダクトに実装されて ない / 見た目が違う これらを解決したい メンテナンスコストやコミュニケー ションコスト、動作確認の手間 👻 プロダクトに実装されてるが Figma に存在しない幽霊UIコン ポーネントの存在 🔥 依存ライブラリの更新で見た 目が崩れないか心配 & デグレの チェックも大変
よくある手法 UIカタログの構築/維持
よくある手法 UIカタログの構築/維持 は大変
よくある手法 UIカタログの構築/維持 は大変
よくある手法 UIカタログの構築/維持 は大変
よくある手法 UIカタログの構築/維持 は大変 → 自動メンテ
構成 (対象アプリ)
構成 (UIカタログ専用リポジトリを別途用意)
構成 (対象アプリとUIカタログを同期させる部分)
✨️プロダクトには一切手を加え ない → 直ぐ導入できる 利点 同期待ちや PRレビュー待ち で、 若干同期インターバルはある🙏 💰️実装やメンテナンスコスト → プロダクトへの影響を切り離し す & AIに思いっきり 動いていただいて人的には 低コストで実現
出来上がったもの
出来上がったもの
出来上がったもの
✨️プロダクトには一切手を加え ない → 直ぐ導入できる 利点 同期待ちや PRレビュー待ち で、 若干同期インターバルはある🙏 💰️実装やメンテナンスコスト → プロダクトへの影響を切り離し す & AIに思いっきり 動いていただいて人的には 低コストで実現
✨️これも自動化したい 同期待ちや PRレビュー待ち で、 若干同期インターバルはある🙏
✨️これも自動化したい → VRT (Visual Regression Test) 同期待ちや PRレビュー待ち で、 若干同期インターバルはある🙏
左 (現在のソースコードから作った正となるUIの画像) 右 (わざと正と異なる状態にしたコードから作られた画像) → 画像処理で全自動間違い探し → PRレビュー/動作確認短縮💪
左 (現在のソースコードから作った正となるUIの画像) 右 (わざと正と異なる状態にしたコードから作られた画像) → 画像処理で全自動間違い探し → PRレビュー/動作確認短縮💪
✨️これも自動化したい → ✌ 同期待ちや PRレビュー待ち で、 若干同期インターバルはある🙏
ご清聴ありがとうございました！ AI×VRT SSOTな UIカタログで手戻り抑制 Motone Adachi | x.com/waritocomatta (撮影/SNS: OK)