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

Figma with Cookpad

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for kenshir0f kenshir0f
July 15, 2021
Design
17k
16

Figma with Cookpad

Figma見せ合いっこ 2021/07/15 で登壇したクックパッドのFigmaの運用のスライド資料です。
https://show-figma-20210715.peatix.com/

Avatar for kenshir0f

kenshir0f

July 15, 2021

More Decks by kenshir0f

See All by kenshir0f
How Cookpad use Figma
Avatar for kenshir0f kenshir0f
3
910
Easy Semantic HTML Structure for Komerco Team
Avatar for kenshir0f kenshir0f
5
6.2k
Cookpad Spring Internship 2019 Service Development Course
Avatar for kenshir0f kenshir0f
2
1.3k
Cookpad TechConf 2019 Komerco Service Dev
Avatar for kenshir0f kenshir0f
14
10k
Introduce Atomic Design with small rework
Avatar for kenshir0f kenshir0f
3
320
Basic css note for Komerco Team
Avatar for kenshir0f kenshir0f
6
8.2k
Design for Behavior and Impact
Avatar for kenshir0f kenshir0f
9
5.1k
tech-kitchen-#16-komerco-design
Avatar for kenshir0f kenshir0f
4
5.8k
s-dev-talks#2-komerco-team-building
Avatar for kenshir0f kenshir0f
4
940

Other Decks in Design

See All in Design
もう迷わない！“なんとなく”を卒業するフォントの選び方【村田俊英】
Avatar for 村田俊英 toshihidemurata
0
510
デザインを信じていますか
Avatar for sekig(ojiee) sekiguchiy
1
1.2k
ISO 9241-171:2025っていうのがあってな
Avatar for Shoji Ohashi shosira
1
160
Storyboard Exercise: Chase Sequence
Avatar for Mandalyn Teo lynteo
1
310
生成AIの不確実性を価値に変える、「ビズリーチ」の体験設計 / KNOTS2026
Avatar for Visional Engineering ＆ Design visional_engineering_and_design
6
1.2k
20251217リビングラボ・トークin尼崎（尼崎おせっかい会議＆オトナテラコヤ）
Avatar for Kimura Atsunobu a2k
0
120
AIスライドデザインを生成する仕組みを社内共有する
Avatar for 太田賢一 kenichiota0711
7
5.5k
つくり方を変えていく | change-how-we-build
Avatar for mottox2 mottox2
2
1.3k
test deck title
Avatar for Shota Matsuo shotamatsuo
0
1.5k
JBUG大阪#9_登壇資料_引き継ぎで困らないためのBacklogWikiの整え方_ミスと属人化を防ぐために、 “次の人が動ける状態”をどう残すか
Avatar for WebNAUT by Beeworks webnaut
1
120
AI時代、デザイナーの価値はどこに？
Avatar for Ryotaro Takahashi tararira
2
1.1k
Drawing for Animation
Avatar for Mandalyn Teo lynteo
2
300

Featured

See All Featured
The untapped power of vector embeddings
Avatar for Frank van Dijk frankvandijk
2
1.7k
The #1 spot is gone: here's how to win anyway
Avatar for Tamara Novitovic tamaranovitovic
2
1.1k
Typedesign – Prime Four
Avatar for Hannes Fritz hannesfritz
42
3.1k
Why Mistakes Are the Best Teachers: Turning Failure into a Pathway for Growth
Avatar for Umar Saidu Auna auna
0
150
DevOps and Value Stream Thinking: Enabling flow, efficiency and business value
Avatar for Helen Beal helenjbeal
1
210
Technical Leadership for Architectural Decision Making
Avatar for Kenny Baas-Schwegler baasie
3
380
The agentic SEO stack - context over prompts
Avatar for schlessera schlessera
0
790
sira's awesome portfolio website redesign presentation
Avatar for ElsiraPls elsirapls
0
270
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
Avatar for Marc Duiker marcduiker
35
2.5k
jQuery: Nuts, Bolts and Bling
Avatar for Doug Neiner dougneiner
66
8.5k
ピンチをチャンスに：未来をつくるプロダクトロードマップ #pmconf2020
Avatar for Aki / @LoveIdahoBurger aki_iinuma
128
55k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
Avatar for Tammy Everts tammyeverts
55
3.4k

Transcript

  1. クックパッドのFigmaの運用 Figma見せ合いっこ / @kenshir0f 2021.07.15

  2. 自己紹介 C 藤井 謙士朗(ふじけん# C デザイン戦略部 デザイン基盤グループ G@ C デザインシステムの整備などを担当

    2021.07.15 Figma 見せ合いっこ/ @kenshir0f

  3. クックパッド @ 私たちは「毎日の料理を楽しみにする」会社で @ 料理に関する課題を解決するプロダクトを開発しています 2021.07.15 Figma 見せ合いっこ/ @kenshir0f

  4. 今日の内容 q クックパッドが Figma をどう活用しているA I 開発フローでの運用方法を中心に紹C q レシピサービス「クックパッドa q

    大人数が絡む開発での運用ルー q デザイン共有の取り組み 2021.07.15 Figma 見せ合いっこ/ @kenshir0f

  5. クックパッド と Figma 2021.07.15 Figma 見せ合いっこ/ @kenshir0f

  6. クックパッドとFigmaの話 q 2018年頃から Figma を利V q 全社で Figma を活用していE q

    大規模サービスから新規事業まd q 営業や人事なども利V q 契約プランは Organizations Pla# q 先月アップグレードしました 2021.07.15 Figma 見せ合いっこ/ @kenshir0f

  7. プロダクトごとにチームを管理 9 運用方法はチームごとに 任せていB 9 全体の整備をデザイン戦略 部がサポート 2021.07.15 Figma 見せ合いっこ/

    @kenshir0f

  8. プロダクトごとにチームを管理 2021.07.15 Figma 見せ合いっこ/ @kenshir0f

  9. 2021.07.15 Figma 見せ合いっこ/ @kenshir0f

  10. V 月間5,900万人以上が利用している大規模なレシピサービh V 複数の部署が連携して同時に開w ) iOS/Android/We  今回は iOS のデザインで

    Figma の活用方法を紹介 2021.07.15 Figma 見せ合いっこ/ @kenshir0f

  11. iOS の Figma のデータ F master データがあ9 F iOS アプリの全画面が入ってい9

    F 施策は全て master から派 F 常に最新のデザインをコピー 2021.07.15 Figma 見せ合いっこ/ @kenshir0f

  12. デザインフロー 2021.07.15 Figma 見せ合いっこ/ @kenshir0f master 画面をコピー 必要な (仮) 検索画面の改善

    (仮) ログイン画面の改善 #057 (仮) 検索画面の改善 施策B 施策A #177 (仮) ログイン画面の改善

  13. 施策のフォーマットを統一 5 部署ごとに施策を管' 5 治安を守るためにサムネイルを揃えている 2021.07.15 Figma 見せ合いっこ/ @kenshir0f #057

    (仮) ログイン画面の改善 (仮) ログイン画面の改善 タイトル GitHub の issue番号
  14. None

  15. 一覧性を重視

  16. 施策のテンプレートファイル

  17. None

  18. 施策ファイルの中身 2021.07.15 Figma 見せ合いっこ/ @kenshir0f (仮) ログイン画面の改善 #177 (仮) ログイン画面の改善

  19. 施策ファイルの中身 2021.07.15 Figma 見せ合いっこ/ @kenshir0f (完成したデザイン) エンジニアが実装時に見る場所

  20. 施策ファイルの中身 2021.07.15 Figma 見せ合いっこ/ @kenshir0f デザインを考える場所 プロトタイプがたくさんある

  21. 施策ファイルの中身 2021.07.15 Figma 見せ合いっこ/ @kenshir0f ミーティングなどの共有用 議事録やメモなど

  22. 2021.07.15 Figma 見せ合いっこ/ @kenshir0f

  23. 2021.07.15 Figma 見せ合いっこ/ @kenshir0f 仕様に関するメモを 必要に応じて貼る

  24. メモで仕様を共有 2021.07.15 Figma 見せ合いっこ/ @kenshir0f

  25. 2021.07.15 Figma 見せ合いっこ/ @kenshir0f 関連するリンクも載せる

  26. リンクのコンポーネント 2021.07.15 Figma 見せ合いっこ/ @kenshir0f (仮)検索をいい感じに改善する #7011 書き出した画像はここ

  27. 2021.07.15 Figma 見せ合いっこ/ @kenshir0f

  28. 2021.07.15 Figma 見せ合いっこ/ @kenshir0f

  29. 2021.07.15 Figma 見せ合いっこ/ @kenshir0f 時系列ごとにデザインをまとめて、 なぜ今のデザインになったか辿れる 時系列

  30. 2021.07.15 Figma 見せ合いっこ/ @kenshir0f

  31. 2021.07.15 Figma 見せ合いっこ/ @kenshir0f インタビュー結果やレビューをまとめ、 なぜそのデザインになったかを辿れる

  32. 施策リリース後  毎週のリリースタイミングで master を更E  何がいつリリースされるかはデザイン横断会で共有 2021.07.15 Figma 見せ合いっこ/

    @kenshir0f #057 (仮) ログイン画面の改善 施策A master master へマージ (仮) ログイン画面の改善

  33. デザイン横断会 h いろんな施策の状況を Figma で共C h リリースされる予定のものを全て貼2 h いつ・なぜやるのかも伝え2 h

    全体の品質チェックとしても機 h デザインガイドライン警察の出動 2021.07.15 Figma 見せ合いっこ/ @kenshir0f

  34. 2021.07.15 Figma 見せ合いっこ/ @kenshir0f

  35. おわりに u クックパッドのFigmaの活用事例を紹介しまし9 u 本当はもっとネタを用意してましたが割3 u cookpad mart の事Y u

    社内用のプラグインの u 何か真似できるところがあればぜひ活用してください！ 2021.07.15 Figma 見せ合いっこ/ @kenshir0f