Slide 1

Slide 1 text

© 2024 Cookpad Inc. iOSDC 2024 スポンサーセッション 新卒のiOSエンジニアが "クックパッドの今"を紹介! Haruta Yamada

Slide 2

Slide 2 text

© 2024 Cookpad Inc. 2 プロフィール Haruta Yamada (paruru) - 2024/04~ 新卒入社 (レシピ事業部) - 2019/06~ 就業型インターン - 領域: iOS, Webfrontend - 趣味: ☕ 🍳

Slide 3

Slide 3 text

クックパッド (レシピ事業部 )が今取り組んでいること © 2024 Cookpad Inc. 3

Slide 4

Slide 4 text

© 2024 Cookpad Inc. 4 One Experience

Slide 5

Slide 5 text

© 2024 Cookpad Inc. 5 日本と海外向けレシピサービスの統合 🎉

Slide 6

Slide 6 text

© 2024 Cookpad Inc. 6 アジェンダ ● OneExperienceとは? ● Globalでの開発について紹介 ○ 開発環境の違い ○ 多言語対応 ○ デザインシステム

Slide 7

Slide 7 text

© 2024 Cookpad Inc. 7 クックパッド Global Cookpad

Slide 8

Slide 8 text

© 2024 Cookpad Inc. 8 ● ユーザー体験を統一するプロジェクトが始動(2023/10~) ● 日本のシステムをグローバルのシステムへ移行(iOS, Android, Web) ○ 日本のプロジェクト、リポジトリはコードフリーズ予定 ○ 多言語対応やレシピを取り込む仕組みが整っている 統合プロジェクト(One Experience)

Slide 9

Slide 9 text

© 2024 Cookpad Inc. 9 見た目や機能も かなり違う e.g.  • 食べ方提案(日本)  • 今日作る(日本)  • コメントでのやりとり(海外)  • リアクション(海外)

Slide 10

Slide 10 text

ブラッシュアップして アプリを統合する © 2024 Cookpad Inc. 10 新アプリ クックパッド Cookpad

Slide 11

Slide 11 text

8/21~ 新アプリがリリース開始 🎉 ※新規インストール+一部ユーザーのみ © 2024 Cookpad Inc. 11 ブースにて触れます !!

Slide 12

Slide 12 text

© 2024 Cookpad Inc. 12 Globalでの開発について紹介 (苦労話)

Slide 13

Slide 13 text

ios-cookpad (日本) - VIPER - SwiftUIの導入 - GraphQL(一部) - モバ基による 開発環境の整備 © 2024 Cookpad Inc. 13 https://techconf.cookpad.com/2019/kohki_miki.html 開発環境の違い

Slide 14

Slide 14 text

Domain, Data Layer Presentation Layer Flow Logic global-ios (海外) - MVVM-C - UIKit - OpenAPI © 2024 Cookpad Inc. 14 ViewModel Interactor Model ViewController View Coordinator Datastore Model Repository Service Service Service 開発環境の違い

Slide 15

Slide 15 text

多言語対応 © 2024 Cookpad Inc. 15

Slide 16

Slide 16 text

© 2024 Cookpad Inc. 16 多言語対応(翻訳) - OneSkyでフレーズと翻訳を管理(iOS, Android, Web) - 英語でフレーズを追加し、後から日本語などの翻訳を取り込む - 日本限定の機能でも翻訳対象 (あとから他の国に展開することもあるため ) https://www.oneskyapp.com/ 33個のLocalizable.stringsが存在(被り有り) 日本語、英語、スペイン語、ドイツ語、アラビア語、ウクライナ語、、

Slide 17

Slide 17 text

© 2024 Cookpad Inc. 17 多言語対応 (翻訳) Github OneSky フレーズの追加、削除 翻訳の追加、削除 コンポーネントの変更による フレーズの追加、削除 Bitrise(CI/CD) 各リージョン向けの 翻訳を追加 エンジニア 各リージョンの翻訳者

Slide 18

Slide 18 text

© 2024 Cookpad Inc. 18 多言語対応 (翻訳) Cooksnap つくれぽ Today 今日つくる 人気のキーワード Today’s popular searches

Slide 19

Slide 19 text

© 2024 Cookpad Inc. 19 RTL(Right to Left)対応

Slide 20

Slide 20 text

© 2024 Cookpad Inc. 20 RTL(Right to Left)対応

Slide 21

Slide 21 text

© 2024 Cookpad Inc. 21 RTL対応

Slide 22

Slide 22 text

© 2024 Cookpad Inc. 22 多言語対応 スペース区切りで単語を分割したい “鶏胸肉 牛乳” -> “鶏胸肉”, “牛乳” スペース区切りで単語を分割できない “鶏胸肉” -> “鳥”, “胸” 言語や商習慣によってコンテンツや動作に違いが出る

Slide 23

Slide 23 text

© 2024 Cookpad Inc. 23 機能出し分け A/B Testing ios-cookpad: - user-features(feature flag) - パターンにマッチしたユーザーに機能を提供可能 - Redshiftで抽出したユーザーグループに対して提供可能 global-ios: - FeatureToggle - アプリのバージョンやリージョンに絞って提供 - APIの1機能として柔軟に変更ができる Picture 画像の最大幅はガイド線に準じて配置してください Picture 画像の最大幅はガイド線に準じて配置してください ※どちらもローカルのフラグをコード上で定義可能

Slide 24

Slide 24 text

© 2024 Cookpad Inc. 24 多言語対応•品質管理

Slide 25

Slide 25 text

© 2024 Cookpad Inc. 25 多言語対応•品質管理

Slide 26

Slide 26 text

デザインシステムへの対応 © 2024 Cookpad Inc. 26

Slide 27

Slide 27 text

© 2024 Cookpad Inc. 27 デザインシステムへの対応 Apron (日本) Mise (Global)

Slide 28

Slide 28 text

© 2024 Cookpad Inc. 28 デザインシステムへの対応 https://note.com/fjkn/n/nf73742ec925a

Slide 29

Slide 29 text

© 2024 Cookpad Inc. 29 デザインシステムへの対応

Slide 30

Slide 30 text

© 2024 Cookpad Inc. 30 ダークモード • ハイコントラストモードへの対応

Slide 31

Slide 31 text

© 2024 Cookpad Inc. 31 ダークモード • ハイコントラストモードへの対応 ※実際にはマークダウンからカラーセットを作る仕組みが整備されている

Slide 32

Slide 32 text

© 2024 Cookpad Inc. 32 ダークモード • ハイコントラストモードへの対応

Slide 33

Slide 33 text

© 2024 Cookpad Inc. 33 ダークモード • ハイコントラストモードへの対応 デザインシステムから逸脱した 色指定が増加 ライトモードの色指定はそのままに、このコンポーネントだけ変えたい、、、

Slide 34

Slide 34 text

© 2024 Cookpad Inc. 34 OneExperienceを進めてみて ● これからは海外にいるユーザーにも向き合っていく ○ ローカライズが前提の開発になっていく ● 移行により負債を生み出してしまった ○ リリース後の課題 ● 今が一番面白いタイミング ○ 新卒関係なく様々な挑戦できる ● iOSDCに間に合ってよかった 移行後初めてのレシピ投稿

Slide 35

Slide 35 text

© 2024 Cookpad Inc. 35