iOSDC 2018 LT 資料

1. インドのインターネット環境
との戦い方

2. About Me
• 辰濱健一（Kenichi Tatsuhama）
• 徳島県神山町在住
• Sansan株式会社＠神山ラボ
• リモートワークで Eight アプリの開発
• GDG Shikoku スタッフ（Google Developer Group）
• Contacts
• Twitter : @tatsuhama50
• Facebook : kenichi.tatsuhama

3. 徳島県神山町
2
古民家再生や、サテ
ライトオフィスの進
出等で、地方創生の
事例になっている

4. Sansan 株式会社 神山ラボ
3

5. 9/15 Swift Tour in 神山
4

6. Agenda
5
• Eight のインド展開
• インドのネットワーク事情
• 分析
• 対応

7. Agenda
6
• Eight のインド展開
• インドのネットワーク事情
• 分析
• 対応

8. Eight のインド進出
7
https://jp.corp-sansan.com/news/2017/171122_8932.html https://jp.techcrunch.com/2017/11/22/sansan-eight-india/

9. 8
日本でそれなりに動いているので、
英訳をあてたら大丈夫！
と思ってました。。。

10. Global Feedback
9
日本では再現しない問題ばかり…
• ダウンロードがなかなか完了しない
• なかなか画面が遷移しない
• 名刺画像送信が1分経っても終わらない
• 「通信エラー」の表示が多発
• etc…

11. 10
これらの問題の
調査・解決のために…

12. Go India（3/12-24）
11

13. Go India（3/12-24）
12
↓エベレスト
ランチ約60円

14. Go India（3/12-24）
13
↓エベレスト
ランチ約60円 東京ランチ1回分
＝インドランチ
1ヶ月分！

15. Go India（3/12-24）
14
↓エベレスト
ランチ約60円
↑この人は片道切符
東京ランチ1回分
＝インドランチ
1ヶ月分！

16. Go India（7/9-22）
15

17. Go India（7/9-22）
16

18. Agenda
17
• Eight のインド展開
• インドのネットワーク事情
• 分析
• 対応

19. インドのネットワーク事情
18
• 3GB/Day で 約500円/月 （ 1.6 JPY / Rs ）
https://www.jio.com/

20. インドのネットワーク事情
19
https://iphone-mania.jp/news-222377/
月額240円で42Gデータ
電話かけ放題！！

21. インドのネットワーク事情
20
Google もかなり
力を入れている
（PWA も新興国がターゲット）
https://www.blog.google/technology/next-
billion-users/google-for-india-2018/

22. 21
インターネット人口急増中！

23. 22
インターネット人口急増中！
しかし、…

24. インドのネットワーク事情
23
https://www.sankeibiz.jp/macro/print/180406/mcb1804060500007-c.htm

25. インドのネットワーク事情
24
https://www.sankeibiz.jp/macro/print/180406/mcb1804060500007-c.htm

26. インドのネットワーク事情
25
• エリア半径数百mの弱い電波
• 町中でも電波にムラあり
• 細い回線をみんなで取り合い
• 瞬断も多い
• （町中の停電も多い）
https://opensignal.com/networks/%E0%A4%AD%E0%A4%BE%E0%A4%B0%E0%A4%A4/jio-
%E0%A4%B5%E0%A5%8D%E0%A4%AF%E0%A4%BE%E0%A4%AA%E0%A5%8D%E0%A4%A4%E0%A4%BF

27. インドのネットワーク事情
26
• 重たいアプリはそもそもダウンロードされない
• 100MB もあると、20% の人が離脱する
https://youtu.be/AdfKNgyT438?t=149
通信単価が高かった頃は
「100MB もあったら
無料アプリでも
実質有料アプリ」
と言われた…

28. 27
「ギガが足りない」…
ゆとりですね。

29. 28
「ギガが足りない」…
ゆとりですね。

30. 29
「サーバのレスポンスが、
必ず返ってくると思ってる？」…
ゆとりでした…orz

31. 30
「サーバのレスポンスが、
必ず返ってくると思ってる？」…
ゆとりでした…orz

32. インドの iPhone 事情
31
http://jbpress.ismedia.jp/articles/-/53824 https://iphone-mania.jp/news-219624/

33. インドの iPhone 事情
32
http://jbpress.ismedia.jp/articles/-/53824 https://iphone-mania.jp/news-219624/
iPhone のシェアが
わずか1% !!

34. Agenda
33
• Eight のインド展開
• インドのネットワーク事情
• 分析
• 対応

35. 分析
34
• 現地で受け入れられているアプリの UX
• New Relic Mobile による分析
• その他のツール

36. 分析
35
• 現地で受け入れられているアプリの UX
• New Relic Mobile による分析
• その他のツール

37. 現地で受け入れられているアプリの UX
36
• いずれも低速なネットワーク環境でも、さほど不自由ない
• 現地で受け入れられているアプリ
• Facebook
• Twitter
• Instagram
• WhatsApp（like LINE）
• Uber
etc…

38. Twitter の投稿 UX
37
• 通信終了を待たない UX
• Tweet 直後、即画面遷移
↓
• 送信状況の Progress 表示
↓
• 送信中の Tweet も UI に表示
↑Progress 表示
投稿中 Tweet
（網掛け表示）
普通の Tweet

39. LINE の自動再送
38
• オフラインでメッセージを送信しても
UI には送信中として反映する
• オンラインになったら自動で再送
• ユーザが再送する必要はない
送信中の UI 自動で再送完了
オンライン
になった

40. Instagram の読み込み UX
39
• 画像の読み込みが4段階ぐらいで行われている
動画

41. 40
現地で受け入れられているアプリは、
低速ネットワーク環境を
ちゃんと考慮できていました。

42. 分析
41
• 現地で受け入れられているアプリの UX
• New Relic Mobile による分析
• その他のツール

43. New Relic Mobile による分析
42
• https://newrelic.com/resource/mobile-monitoring-jp
• 30日間の無料トライアルもあり

44. New Relic Mobile による分析
43
• HttpRequest Sort
• Response time
• Requests per time
• Total Time
• Total size

45. New Relic Mobile による分析
44
• Geography Sort
• Response time
• Request per minute
• Total transfer size
• App launches
• Network failure late

46. New Relic Mobile による分析
45
• Interactions
• Memory
• CPU
• Network
• Threads

47. New Relic Mobile による分析
46
• Dashboard
• カスタムクエリで
View を作れる

48. 47
New Relic Mobile を使うと
様々な角度からの
分析・評価が可能になります。

49. 分析
48
• 現地で受け入れられているアプリの UX
• New Relic Mobile による分析
• その他のツール

50. Network Link Conditioner
49
• https://developer.apple.com/download/more/
• Mac の通信速度をコントロールできる
• インターネット共有をすれば、スマホの通信速度を低速にできる

51. Charles
50
• https://www.charlesproxy.com/
• プロキシをたてて通信内容をキャプチャできる
• レスポンスの書き換えも可能
• iOSDC 2018 でもセッションが
ありましたね！

52. ロケットモバイル（神プラン）
51
• https://rokemoba.com/
↑本家アカウントからの Like

53. ロケットモバイル（神プラン）
52
• https://rokemoba.com/
↑本家アカウントからの Like
毎日インドを
思い出せます！

54. 余談
53

55. 余談
54

56. 余談
55
恵まれた
ネットワーク環境！
（ゆとり）

57. Agenda
57
• Eight のインド展開
• インドのネットワーク事情
• 分析
• 対応

58. 対応
58
• アプリのバイナリサイズ削減
• 画像の送受信サイズを削減
• 通信結果を待たない UX に変更
• 通信に失敗しても、オンラインになったら自動リトライ

59. 対応
59
• アプリのバイナリサイズ削減
• 画像の送受信サイズを削減
• 通信結果を待たない UX に変更
• 通信に失敗しても、オンラインになったら自動リトライ

60. アプリのバイナリサイズ削減
60
• アプリ内画像の軽量化
• jpeg や png 画像の Optimize
• 77 MB → 70 MB（約 10% 削減）
• https://tinypng.com/ などを利用
• App Thinning を利用
• Ex. 70 MB → 30 MB（約 50% 削減）

61. App Thinning
61
• アプリを自動で最適化して配信してくれる仕組み（ WWDC 2015 ）
• App Slicing, On-Demand Resources, Bitcode の3種類がある
• App Slicing：その端末に必要なリソースのみをダウンロードできる
• App Slicing iOS 9.0 以上が対応
（それ以外は、Universal 版になる）
• アセットカタログ形式が不可欠
https://developer.apple.com/jp/documentation/IDEs/Concept
ual/AppDistributionGuide/AppThinning/AppThinning.html

62. 対応
62
• アプリのバイナリサイズ削減
• 画像の送受信サイズを削減
• 通信結果を待たない UX に変更
• 通信に失敗しても、オンラインになったら自動リトライ

63. 画像の送受信サイズを削減
63
• 送信
• 形式変更
• Jpeg → Webp（約 70% 減）
• Base64 → Multipart（約 25% 減）
• Quality:90% → 70% （約 50% 減）
• 必要十分なサイズにリサイズして送信
• 受信
• 表示に適切な画像サイズ（サムネイル / 中繊細 / 高画質）でリクエスト

64. 対応
64
• アプリのバイナリサイズ削減
• 画像の送受信サイズを削減
• 通信結果を待たない UX に変更
• 通信に失敗しても、オンラインになったら自動リトライ

65. 通信結果を待たない UX に変更
65
即画面遷移
撮影 送信
送信
完了
送信中も表示

66. 対応
66
• アプリのバイナリサイズ削減
• 画像の送受信サイズを削減
• 通信結果を待たない UX に変更
• 通信に失敗しても、オンラインになったら自動リトラ
イ

67. 通信に失敗しても自動リトライ
68
• SwiftQueue
• https://github.com/lucas34/SwiftQueue
• 実行可能条件（充電中、オンライン）やリトライ条件を指定できる Job Scheduler

68. 69
インド展開に向けて
日々日々改善施策を行っています

69. 70
まとめ

70. まとめ
71
インドの低速なネットワークの攻略法

71. まとめ
72
インドの低速なネットワークの攻略法
• バイナリを軽く
→ アプリ内画像の最適化・App Thinning 対応

72. まとめ
73
インドの低速なネットワークの攻略法
• バイナリを軽く
→ アプリ内画像の最適化・App Thinning 対応
• 通信結果を待たない UX に
→ 機内モードや低速通信環境での UX 確認を！

73. まとめ
74
インドの低速なネットワークの攻略法
• バイナリを軽く
→ アプリ内画像の最適化・App Thinning 対応
• 通信結果を待たない UX に
→ 機内モードや低速通信環境での UX 確認を！
• ツールを活用して分析＆改善を
→ NewRelic Mobile, Charles etc…

74. Fin.

75. 76
まだ時間がある！

76. 9/15 Swift Tour in 神山
77

77. 78

78. 宿泊先
79

79. 80
9/15 にまた会いましょう！！

80. Fin.