Upgrade to Pro — share decks privately, control downloads, hide ads and more …

大規模サービスのUIデザインを管理する工夫

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers.
Avatar for tamai tamai
July 27, 2022

 大規模サービスのUIデザインを管理する工夫

Avatar for tamai

tamai

July 27, 2022
Tweet

Other Decks in Design

Transcript

  1. 2022/07/27 Figma Japan Community Event 大規模サービスの UIデザインを 管理する工夫 2022 Figma

    Japan Community Event Figmaの活用策をシェアしよう! 玉井 雄一郎
  2. 2022/07/27 Figma Japan Community Event 玉井 雄一郎 i クックパッド株式会社 レシピサービス開発部

    デザイナb i 2021年新卒入† i クックパッドアプリの体験設計・UIデザインに
 取り組んでいます5 i 自炊力向上に奮闘中。 自己紹介 @Tamaai2
  3. 2022/07/27 Figma Japan Community Event 毎日の料理を楽しみにする」 ことを 目標に料理に関する課題を解決できる プロダクトを開発 3部署、合計9人のデザイナー体制

    クックパッド 「 レシピサービス開発部 デザイナー 買物事業部 デザイナー ユーザーコミュニケーション部 デザイナー
  4. 2022/07/27 Figma Japan Community Event 代表者が企画に関することを 1つのファイルに集約させる ƒ スケジュールや資料、issueのリンクなどすべて掲T ƒ

    「ここを見ればいい」 という安心感 すべての情報が集まる場を作り、代表者が管理する バレンタインキャンペーンの場合 ※すべての施策で担当者がバラバラ 実際のバレンタインキャンペーン管理データ 関連リンク集 施策1 施策2 施策3 施策5 施策9 施策11 施策7 施策4 施策6 施策8 施策10 施策12
  5. 2022/07/27 Figma Japan Community Event 仕様メモを横に残し、遷移先のリンクや 条件を書き残す v みんなで見るので仕様考慮漏れがなくなu v

    なぜこのデザインにしたのかのメモも残せu v エンジニア同士の会話コストも削減 工夫1 バレンタインキャンペーンの場合 リンクやメモのコンポーネント
  6. 2022/07/27 Figma Japan Community Event 実装が画像になる部分はマスターコン ポーネントをUIデザインから切り分け ‘ UIデザインをAuto layoutで組んでおけば、


    後からのデザイン変更にも柔軟に対応できq ‘ エンジニアが任意のタイミングで画像を書き出して
 すぐ実装に着手できる 工夫2 バレンタインキャンペーンの場合 対応
  7. 2022/07/27 Figma Japan Community Event Y 施策/デザイナーが複数入り組んでいてトンマナ管理・仕様把握が大変...B Y 決済周りの仕様が複雑 &

    関係者が多い...B 9 Y 他デザイナーとの施策の把握がしづらく、バッティングが心配...B 9 9 すべての情報が集まる場を作り、代表者が管理す‡ UIをコンポーネント化し、画面遷移図のページを作‘ 施策やデザインを共有する「デザイン横断会」 をFigJamで実施 参考になれば幸いです ご質問等あればDMまで! おわりに 資料を公開しました ! 大規模サービスのUIデザインを管理する 工夫 たまい 2022/07/27 @Tamaai2