COOKPAD さんとの勉強会（第１回）。 2014/04/24

1. How
tab for iPhone
is Made
Yoshihiro Akahira (tab inc.)

2. tab (iOS)
iPhone iPad
LatestVer. v2.10.0 v1.2.6
Support OS iOS6∼ iOS5∼
Release 1 / 2~3 week 2013/9/14
• 開発体制 3 ∼ 4 人
• ARC 使用
• Auto layout 不使用（iOS5サポートしていた時の名残）

3. 今日話すこと
• tab アプリの内側
• API通信処理
• UI 工夫しているところ
• iOS App 開発Tips
• デバッグ
• その他Tips

4. API通信処理
Server JSON Model
ネットワークライブラリ
どうする？
HTTPS Mapping
Dict
Parsing

5. ネットワークライブラリ
• 非同期実行
• キャンセルできること
• コールバックがブロックで書きやすいこと
• 安定していること

6. MKNetworkKit
• キャンセル可能
• 同じURLへのリクエストが複数あるとマージ
してくれる
• レスポンスキャッシュ機構あり

7. API通信処理
Server JSON Model
MKNetworkKit
採用！！
HTTPS Mapping
Dict
Parsing
パースはどうする？

8. Parsing
• Parser は特にこだわり無し
• 速くて、安定してて、使いにくくなくて
• じゃあ MKNetworkKit (NSJSONSerialization) で
いいか

9. API通信処理
Server JSON Model
MKNetworkKit
どうやって
保存する？
ライブラリは？
HTTPS Mapping
Dict
Parsing
MKNetworkKit
採用！！

10. Mapping
• ディスクに保存？ メモリに保存？
• CoreDataを使う？リスクは？？

11. ディスクに保存？
• アイテム等のデータは常に更新される
→ネットワークから送られたものが常に正しい
→揮発性で良い
• 一方、画像データはディスクキャッシュ必須
• 投稿下書きデータはディスク保存必須

12. メモリに保存？
• １ID ＝ １インスタンス のような構造
• 同じIDのインスタンスをメモリ上に複数持つのも無駄
→メモリ上でインスタンスを保持
• 注意
同じインスタンスを複数箇所で参照・変更すると
内容が意識外で変化することによる危険性がある

13. CoreDataのリスク
• マイグレーションのリスク
マイグレーションシステム、コードの理解が難しい
慣れていないと予期しない動作をする場合がある
• モデルのマージが難しい
複数人でいじりにくい

14. じゃあ、どうする？
• CoreDataを参考にして…
• メモリ上にデータをキャッシュできる構造（1ID=1インスタンス）
• CoreData は使わず
• RestKit でシリアライズ・デシリアライズする
• CoreData を適用しようと思えば適用できる構造を意識
• 投稿下書きデータは KeyedArchiver で実装（AutoCoding ライブラリ）

15. API通信処理
Server JSON Model
MKNetworkKit
RestKit
採用！！
HTTPS Mapping
Dict
Parsing
MKNetworkKit
CoreData

16. 今日話すこと
• tab アプリの内側
• API通信処理
• UI 工夫しているところ
• iOS App 開発Tips
• デバッグ
• その他Tips

17. UI

18. Tap!
Tap!
tab帳 アイテム

19. 工夫したところ
• ユーザを待たせない
• 見やすい地図を表示

20. ユーザを待たせない
• UIが反応しない時間を短く
NO!

21. ユーザを待たせない
• UIが反応しない時間を短く
• 前ページまでに得られている情報のみで、
遷移先のページをまず表示する
• アイテムタイトル、アイテム説明
• 画像（サムネイル→精細画像）

22. サムネイル

23. ユーザを待たせない
• 非同期取得・表示
• 別APIで取得するようなものは、非同期に
読み込み、読み込まれた時点で表示（更新）
• 地図、同じ場所の別アイテム他

24. 見やすい地図を表示
Apple Map に難あり…

25. 見やすい地図を表示
• アイテムのマップには
Google Static Maps API 使用
• API 上限＆遅延対策
Apple Map の上に Google
Static Map を乗せて、上限
に達した時は非表示にし
て下の Apple Map を表示

26. http://youtu.be/9NLVfE8NwxM http://youtu.be/gR1yuXGe93k

27. UI 系 ライブラリ
• AwesomeMenu
画面下のメニュー
• CMPopTipView
Tips吹出し

28. UI 系 ライブラリ
• EGOTableViewPullRefresh
PullTo Refresh
• MBProgressHUD
ローディング HUD

29. UI 系 ライブラリ
• PSTCollectionView
２列表示ビュー
• TSMiniWebBrowser
必要最低限の UI を持った WebView

30. UI 系 ライブラリ
• IIViewDeckController
サイドメニュー

31. 今日話すこと
• tab アプリの内側
• API通信処理
• UI 工夫しているところ
• iOS App 開発 Tips
• デバッグ
• その他Tips

32. iOS App 開発Tips

33. デバッグコツ
• BugSense でクラッシュ情報を収集
• パンくずリストを併せて送信
→どういった操作でクラッシュするのか
→Stacktrace が当てにならない時に有用

34. デバッグコツ
• MixPanel で統計的にバグを発見
• 新しいバージョンで ＊＊＊ボタンを押す人が減った
• 何か UI 変えた？ → 変えてない
→ ある条件だと「＊＊＊ボタンを押せない」等のバ
グ発見

35. 位置情報系デバッグ方法
• シミュレータで SignificantLocationChange を受ける方法
1.位置情報 無し に設定
2.シミュレータ終了
3.シミュレータ起動
4.位置情報を設定
→ 発生！
❌GPS
✅Wifi
✅Cellular
Battery
Precision

36. 位置情報系デバッグ方法
• 位置情報をログに出力
• 読み出し UI を用意
（DEBUGビルドのみ）
• UserDefaults に保存

37. 位置情報系デバッグ方法
• でも、やっぱり最終的には…
フィールドテスト
• デバッグのため山手線一周など
→荻窪駅周辺にバグを再現できるスポット発
見！

38. iBeaconデバッグ
（あしあと）
• シミュレータは iBeacon 不可
• あしあと確認画面を用意

39. 今日話すこと
• tab アプリの内側
• API通信処理
• UI 工夫しているところ
• iOS App 開発Tips
• デバッグ
• その他 Tips

40. Continuous Integration
Jenkins
Developer
GitHub
ModuleTest
UITest
TestFlight Build
TestFlight
UploadDistribute
Merge
社内
Polling
Trigger
Beta Users
Mail & HipChat
Download

41. コードレビュー
• 誰か一人にレビューしてもらう
• Git の pre-commit で Uncrustify （コードフォーマッタ）
→しょうもない指摘をしなくて済む
→スタイル論争が不要になる

42. Storyboard
• 複数人開発するとマージでコンフリクト

43. Storyboard
• 複数人開発するとマージでコンフリクト
• Storyboard を分割
同時に Storyboard をいじる可能性が減る
• マージの際 Classes を削除
• <inferredmetricstiebrakers> → 中の要素を削除
Git の pre-commit で自動削除

44. Apple Review Reject
• マップの Google ロゴの上に UI を乗せてしまってアウト
まだ Apple のマップがなかった時代
• ライセンスには気をつけよう
• Reject ではないけれど…
• どういうアプリかよくわからんから動画に撮って送って
くれ

45. 今日話すこと
• tab アプリの内側
• API通信処理
• UI 工夫しているところ
• iOS App 開発Tips
• デバッグ
• その他Tips
ご清聴、ありがとうございました