Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
苦労が多かった多言語対応をFigmaで楽にした話
Search
Pioneer
PRO
December 06, 2024
Design
690
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
苦労が多かった多言語対応をFigmaで楽にした話
Pioneer
PRO
December 06, 2024
More Decks by Pioneer
See All by Pioneer
Integration Testでテスト工数削減した話
pioneer_devrel
PRO
0
31
優しいPR文化を広め、1ヶ月250件 爆速でレビューを回した話
pioneer_devrel
PRO
0
42
仕様統合の難しさ ~ナビと音声コンテンツ、どっちが喋るかで悩んだ話~
pioneer_devrel
PRO
0
28
新卒研修から学んだこと
pioneer_devrel
PRO
0
82
ゴール設定におけるリーダーの心得
pioneer_devrel
PRO
0
78
エンジニア駆動でデザインツールの刷新ができた
pioneer_devrel
PRO
0
60
約1年間、SRE活動を通して感じたこと
pioneer_devrel
PRO
0
52
Other Decks in Design
See All in Design
デザインとフロントエンドの境界が融ける Claude Code × Figma
littlebusters
1
2.9k
絵や写真から学ぶ、要素がもたらす副作用
kspace
0
360
富山デザイン勉強会_デザイントレンド2026.pdf
keita_yoshikawa
3
230
プロダクトデザイナーに学ぶ、『見る気が起きる』ダッシュボードの作り方 / Creating Engaging Dashboards: Lessons from Product Designers
yamamotoyuta
2
850
つくり方を変えていく | change-how-we-build
mottox2
2
1.3k
decksh object reference
ajstarks
2
1.7k
Figma MCPを活用するためのデザインハンドブック
vivion
7
18k
From the Visible Crossroads: Turning Outputs into Outcomes
takaikanako
2
1.4k
コンテンツ作成者の体験を設計する
chiilog
0
180
TUNAG BOOK 2024
stmn
PRO
0
1.6k
20260309_3月ICTデザイン勉強会_地域創生2.0
a2k
0
130
AIでデザインをつくる:基礎編
kenichiota0711
4
3.1k
Featured
See All Featured
Making Projects Easy
brettharned
120
6.7k
Measuring & Analyzing Core Web Vitals
bluesmoon
9
860
AI Search: Implications for SEO and How to Move Forward - #ShenzhenSEOConference
aleyda
1
1.3k
Organizational Design Perspectives: An Ontology of Organizational Design Elements
kimpetersen
PRO
1
720
Marketing to machines
jonoalderson
1
5.4k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
31
3.2k
Into the Great Unknown - MozCon
thekraken
41
2.6k
Why Your Marketing Sucks and What You Can Do About It - Sophie Logan
marketingsoph
0
160
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
133
19k
How to Align SEO within the Product Triangle To Get Buy-In & Support - #RIMC
aleyda
2
1.5k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
231
23k
Agile that works and the tools we love
rasmusluckow
331
21k
Transcript
苦労が多かった多言語対応を Figmaで楽にした話 モバイル開発部2グループ 方波見 梨沙
2 自己紹介 方波見 梨沙(かたばみ りさ) 直接お会いできないので お写真の貼り付け お願いします! Androidの開発と技術広報のお仕事してます 好きなこと、得意なこと:
・愛犬(2匹)を溺愛してます。 ・クラフトビールが大好き! ・木村さんたちとお店検索アプリを作ってます(Flutter製)
3 Agenda Confidential 01 パイオニアと多言語 02 開発工程 03 開発チームが主体で改善したこと 04
まとめ
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. 主な海外のグループ会社
5 01 パイオニアと多言語 • 車載器とBLEやWi-Fiで通信を行い、リモコン部分をカスタマイズ・操作で きるアプリ • 開発フレームワークはFlutterでAndroid・iOSそれぞれ提供しています。 今年リリースしたPxLink
6 01 パイオニアと多言語 PxLinkが対応している言語数は何言語でしょう? • 6言語 • 15言語 • 30言語
クイズです A: PxLinkは30言語に対応しています。 一般的な多言語対応は5~10言語と言われており、30言語以上は世界中の幅広 いユーザーにリーチするためのサービス(SNSなど)で対応する言語数です。
7 02 開発工程 1. デザインを作る 多言語対応したアプリが完成するまでの流れ 2.仕様書&翻訳を作る 3.実装する 5. 現地メンバーが確認
4.実装したアプリを配る 6. 修正リクエスト 1つの言語で1箇所の修正でも 30言語対応しているため30箇所の修正になる
8 02 開発工程 1. デザインを作る 多言語対応したアプリが完成するまでの流れ 3.実装する 5. 現地メンバーが確認 4.実装したアプリを配る
6. 修正リクエスト 2.仕様書&翻訳を作る
9 02 開発工程 1. デザインを作る ボトルネックになっていたところ 5. 現地メンバーが確認 デザインデータと 仕様書の内容が
あっておらず、実 装時の手戻りが多 い 文字効率が良い日 本語で作成してい るため、高確率で 見切れる 工程がかなり終盤 のため、1発でパ スできない場合は 必ず手戻りになる 2.仕様書&翻訳を作る
10 02 開発工程
11 03 開発工程
12 03 開発チームが主体で改善したこと Figma PluginのContext Switchを活用しよう
13 02 開発工程 1. デザインを作る 改善できたところ 2.仕様書を作る 5. 現地メンバーが確認 デザインデータで
一元管理になった ため、作業自体が 不要になった 文字効率が悪い言 語で見れるため、 事前にデザイン調 整が可能になった 工程が上流になっ たため、多少の手 戻りがあっても期 日に余裕が生まれ た
14 03 開発チームが主体で改善したこと 1. デザインを作る 4.実装する 2. 現地メンバーが確認 5.実装したアプリを配る 3.
修正
15 03 開発チームが主体で改善したこと • Figma上のテキスト欄にどんな ID(ルール)をつけるかをあらかじめ、 デザイナーさんと調整しておく必要がある • プラグイン実行にはEditor権限が必要になるため、費用面での調整が必要 •
データテーブルをアプリに組み込める形にするには一工夫必要 • PxLinkではスプレッドシート&Google Apps Scriptを活用しました 活用する際に気をつけること
16 余談 • Android14では性別で文法が変わる言語(フランス語など)への対応が可能にな りました • 設定方法は国ごとの言語対応とあまり変わらない(性別のsuffixをつける)の で簡単にできそう Googleの傾向 出典:
https://developer.android.com/about/versions/14/features?hl=ja#grammatical-inflection
17 04 まとめ • 課題を解決するにはプラグインの活用も大事 • 合わせて工程の見直しもするとなお良です • 多言語化は国だけに収まらず、性別でも変えることができるようになっている
Confidential