Slide 1

Slide 1 text

苦労が多かった多言語対応を Figmaで楽にした話 モバイル開発部2グループ 方波見 梨沙

Slide 2

Slide 2 text

2 自己紹介 方波見 梨沙(かたばみ りさ) 直接お会いできないので お写真の貼り付け お願いします! Androidの開発と技術広報のお仕事してます 好きなこと、得意なこと: ・愛犬(2匹)を溺愛してます。 ・クラフトビールが大好き! ・木村さんたちとお店検索アプリを作ってます(Flutter製)

Slide 3

Slide 3 text

3 Agenda Confidential 01 パイオニアと多言語 02 開発工程 03 開発チームが主体で改善したこと 04 まとめ

Slide 4

Slide 4 text

4 01 パイオニアと多言語 5つの地域に11カ国の会社があります 米州 アメリカ Pioneer Elecrtronics (USA) Inc. パナマ Pioneer International Latin America, S.A. ブラジル Pioneer do Brasil Ltda. 欧州 ベルギー Pioneer Europe NV 中東・アフリカ U.A.E Pioneer Gulf, Fze. アジア・オセアニア インド Pioneer India Electronics Private Ltd. オーストラリア Pioneer Electronics Australia Pty. Ltd. シンガポール Pioneer Electronics Asiacentre Pte. Ltd. タイ Pioneer Electronics (Thailand) Co., Ltd. 中国 Pioneer China Holding Co., Ltd. 香港 Pioneer (HK) Ltd. 主な海外のグループ会社

Slide 5

Slide 5 text

5 01 パイオニアと多言語 • 車載器とBLEやWi-Fiで通信を行い、リモコン部分をカスタマイズ・操作で きるアプリ • 開発フレームワークはFlutterでAndroid・iOSそれぞれ提供しています。 今年リリースしたPxLink

Slide 6

Slide 6 text

6 01 パイオニアと多言語 PxLinkが対応している言語数は何言語でしょう? • 6言語 • 15言語 • 30言語 クイズです A: PxLinkは30言語に対応しています。 一般的な多言語対応は5~10言語と言われており、30言語以上は世界中の幅広 いユーザーにリーチするためのサービス(SNSなど)で対応する言語数です。

Slide 7

Slide 7 text

7 02 開発工程 1. デザインを作る 多言語対応したアプリが完成するまでの流れ 2.仕様書&翻訳を作る 3.実装する 5. 現地メンバーが確認 4.実装したアプリを配る 6. 修正リクエスト 1つの言語で1箇所の修正でも 30言語対応しているため30箇所の修正になる

Slide 8

Slide 8 text

8 02 開発工程 1. デザインを作る 多言語対応したアプリが完成するまでの流れ 3.実装する 5. 現地メンバーが確認 4.実装したアプリを配る 6. 修正リクエスト 2.仕様書&翻訳を作る

Slide 9

Slide 9 text

9 02 開発工程 1. デザインを作る ボトルネックになっていたところ 5. 現地メンバーが確認 デザインデータと 仕様書の内容が あっておらず、実 装時の手戻りが多 い 文字効率が良い日 本語で作成してい るため、高確率で 見切れる 工程がかなり終盤 のため、1発でパ スできない場合は 必ず手戻りになる 2.仕様書&翻訳を作る

Slide 10

Slide 10 text

10 02 開発工程

Slide 11

Slide 11 text

11 03 開発工程

Slide 12

Slide 12 text

12 03 開発チームが主体で改善したこと Figma PluginのContext Switchを活用しよう

Slide 13

Slide 13 text

13 02 開発工程 1. デザインを作る 改善できたところ 2.仕様書を作る 5. 現地メンバーが確認 デザインデータで 一元管理になった ため、作業自体が 不要になった 文字効率が悪い言 語で見れるため、 事前にデザイン調 整が可能になった 工程が上流になっ たため、多少の手 戻りがあっても期 日に余裕が生まれ た

Slide 14

Slide 14 text

14 03 開発チームが主体で改善したこと 1. デザインを作る 4.実装する 2. 現地メンバーが確認 5.実装したアプリを配る 3. 修正

Slide 15

Slide 15 text

15 03 開発チームが主体で改善したこと • Figma上のテキスト欄にどんな ID(ルール)をつけるかをあらかじめ、 デザイナーさんと調整しておく必要がある • プラグイン実行にはEditor権限が必要になるため、費用面での調整が必要 • データテーブルをアプリに組み込める形にするには一工夫必要 • PxLinkではスプレッドシート&Google Apps Scriptを活用しました 活用する際に気をつけること

Slide 16

Slide 16 text

16 余談 • Android14では性別で文法が変わる言語(フランス語など)への対応が可能にな りました • 設定方法は国ごとの言語対応とあまり変わらない(性別のsuffixをつける)の で簡単にできそう Googleの傾向 出典: https://developer.android.com/about/versions/14/features?hl=ja#grammatical-inflection

Slide 17

Slide 17 text

17 04 まとめ • 課題を解決するにはプラグインの活用も大事 • 合わせて工程の見直しもするとなお良です • 多言語化は国だけに収まらず、性別でも変えることができるようになっている

Slide 18

Slide 18 text

Confidential