iBeaconを使ってみよう!気軽に使える近距離無線通信

17,258 views

Published on

iBeaconでできること – Developers.IO Meetup 02 の発表資料です。
http://dev.classmethod.jp/news/developersio-meetup-02/

iBeaconの実装方法をデモも交えて出来る限り分かりやすく解説しました。
また、iBeaconを使う上での注意すべきTipsもご紹介しています。

Published in: Technology
0 Comments
36 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
17,258
On SlideShare
0
From Embeds
0
Number of Embeds
4,598
Actions
Shares
0
Downloads
237
Comments
0
Likes
36
Embeds 0
No embeds

No notes for slide

iBeaconを使ってみよう!気軽に使える近距離無線通信

  1. 1. iBeaconを使ってみよう! 気軽に使える近距離無線通信 ! underscore Inc.! 諏訪 悠紀
  2. 2. プロフィール • underscore Inc.
 (classmethodの子会社)! • iOS / Android アプリの
 企画 & 設計 & デザイン & 開発 & リリース & プロモ & 運用 & 保守! • Objective-C, Java, Ruby, ...
  3. 3. iBeaconアプリをみんなで作ろう! • iBeaconは注目されているが、上手く 活用しているアプリが少ない! • 機能はシンプルだが、うまく使うには ちょっとコツがいる(かも) iBeaconを上手く使って! 楽しいアプリを作ろう!
  4. 4. そもそも… iBeaconアプリを作るためには • Beaconを検知するアプリ! • Beaconとなる端末 Estimote iPhone Mac この2つのアプリの! 作りかたを解説します が必要
  5. 5. アジェンダ 1 iBeaconアプリの作りかた! • • 領域観測の手順! 距離測定の手順! 2 Beaconアプリの作りかた! 3 ハマりどころ! 4 まとめ
  6. 6. 1 iBeaconアプリの 作りかた
  7. 7. iBeaconの機能① 領域観測 Beaconの領域内(Region)への出入りを監視する !
  8. 8. iBeaconの機能② 距離観測 (Ranging) 各Beaconとの距離を約1秒おきに監視する 遠 A 近 B
  9. 9. 領域観測と距離観測の違い 距離観測の対象 領域観測の対象 Region Beacon Beacon Beacon それぞれが全く別な機能であると認識しておく
  10. 10. 実装する前に… • Xcode 5! • iOS SDK 7! • CoreLocation.framework
  11. 11. 領域観測してみる if ([CLLocationManager isMonitoringAvailableForClass:[CLBeaconRegion class]]) { ! // CLLocationManagerの生成とデリゲートの設定 self.manager = [CLLocationManager new]; self.manager.delegate = self; ! // 生成したUUIDからNSUUIDを作成 NSString *uuid = @"41282F26-524C-4F16-9E95-C06D90AF942A"; self.proximityUUID = [[NSUUID alloc] initWithUUIDString:uuid]; ! // CLBeaconRegionを作成 self.region = [[CLBeaconRegion alloc] initWithProximityUUID:self.proximityUUID identifier:@"jp.classmethod.testregion"]; ! // iBeaconによる領域観測を開始 [self.manager startMonitoringForRegion:self.region]; }
  12. 12. 領域観測してみる iBeaconに対応してい るか判定する if ([CLLocationManager isMonitoringAvailableForClass:[CLBeaconRegion class]]) { ! // CLLocationManagerの生成とデリゲートの設定 self.manager = [CLLocationManager new]; self.manager.delegate = self; ! // 生成したUUIDからNSUUIDを作成 NSString *uuid = @"41282F26-524C-4F16-9E95-C06D90AF942A"; self.proximityUUID = [[NSUUID alloc] initWithUUIDString:uuid]; ! // CLBeaconRegionを作成 self.region = [[CLBeaconRegion alloc] initWithProximityUUID:self.proximityUUID identifier:@"jp.classmethod.testregion"]; ! // iBeaconによる領域観測を開始 [self.manager startMonitoringForRegion:self.region]; }
  13. 13. 領域観測してみる iBeaconに対応してい るか判定する if ([CLLocationManager isMonitoringAvailableForClass:[CLBeaconRegion class]]) { ! // CLLocationManagerの生成とデリゲートの設定 self.manager = [CLLocationManager new]; self.manager.delegate = self; ! コマンドで生成可能 // 生成したUUIDからNSUUIDを作成 NSString *uuid = @"41282F26-524C-4F16-9E95-C06D90AF942A"; self.proximityUUID = [[NSUUID alloc] initWithUUIDString:uuid]; ! // CLBeaconRegionを作成 self.region = [[CLBeaconRegion alloc] initWithProximityUUID:self.proximityUUID identifier:@"jp.classmethod.testregion"]; ! // iBeaconによる領域観測を開始 [self.manager startMonitoringForRegion:self.region]; }
  14. 14. 領域観測してみる iBeaconに対応してい るか判定する if ([CLLocationManager isMonitoringAvailableForClass:[CLBeaconRegion class]]) { ! // CLLocationManagerの生成とデリゲートの設定 self.manager = [CLLocationManager new]; self.manager.delegate = self; ! コマンドで生成可能 // 生成したUUIDからNSUUIDを作成 NSString *uuid = @"41282F26-524C-4F16-9E95-C06D90AF942A"; self.proximityUUID = [[NSUUID alloc] initWithUUIDString:uuid]; ! // CLBeaconRegionを作成 アプリでの識別用 self.region = [[CLBeaconRegion alloc] initWithProximityUUID:self.proximityUUID identifier:@"jp.classmethod.testregion"]; ! // iBeaconによる領域観測を開始 [self.manager startMonitoringForRegion:self.region]; }
  15. 15. 領域観測してみる CLLocationManagerDelegateの実装 - (void)locationManager:(CLLocationManager *)manager didEnterRegion:(CLRegion *)region { } ! - (void)locationManager:(CLLocationManager *)manager didExitRegion:(CLRegion *)region { }
  16. 16. 領域観測してみる CLLocationManagerDelegateの実装 - (void)locationManager:(CLLocationManager *)manager didEnterRegion:(CLRegion *)region { } ! - (void)locationManager:(CLLocationManager *)manager didExitRegion:(CLRegion *)region { } Exitは20秒∼1分後に通知される! (バグではないので注意!)
  17. 17. デモ!① 入ったり出たりしたら 音を鳴らしてみる
  18. 18. Exitまで 長いですよね。。
  19. 19. 距離測定してみる - (void)locationManager:(CLLocationManager *)manager didEnterRegion:(CLRegion *)region { [self.manager startRangingBeaconsInRegion:self.region]; }
  20. 20. 距離測定してみる - (void)locationManager:(CLLocationManager *)manager didEnterRegion:(CLRegion *)region { [self.manager startRangingBeaconsInRegion:self.region]; } 領域内に入ったときに! 距離測定を開始する場合
  21. 21. 距離測定してみる - (void)locationManager:(CLLocationManager *)manager didRangeBeacons:(NSArray *)beacons inRegion:(CLBeaconRegion *)region { CLBeacon *beacon = beacons.firstObject; switch (beacon.proximity) { case CLProximityUnknown: NSLog(@"CLProximityUnknown"); break; case CLProximityImmediate: NSLog(@"CLProximityImmediate"); break; case CLProximityNear: NSLog(@"CLProximityNear"); break; case CLProximityFar: NSLog(@"CLProximityFar"); break; } }
  22. 22. 距離測定してみる - (void)locationManager:(CLLocationManager *)manager didRangeBeacons:(NSArray *)beacons inRegion:(CLBeaconRegion *)region { CLBeacon *beacon = beacons.firstObject; switch (beacon.proximity) { case CLProximityUnknown: NSLog(@"CLProximityUnknown"); break; case CLProximityImmediate: NSLog(@"CLProximityImmediate"); break; case CLProximityNear: NSLog(@"CLProximityNear"); break; case CLProximityFar: NSLog(@"CLProximityFar"); break; } } 配列で渡されるので! それぞれのBeaconの! 距離を判定する
  23. 23. デモ!② Beaconの状態を 監視してみる
  24. 24. Beaconの特定に使えるプロパティ proximityUUID double Regionの識別値 major NSNumber Beaconの識別値① minor NSNumber Beaconの識別値② proximity CLProximity 相対距離 accuracy double 精度 rssi NSInteger 電波強度
  25. 25. https://github.com/ suwa-yuki/ BeaconSample
  26. 26. 2 Beaconアプリの 作りかた
  27. 27. Beaconアプリの機能 A UUID = XXXX-...! major = 1! minor = 1 B UUID = XXXX-...! major = 1! minor = 2
  28. 28. Beaconアプリの機能 A UUID = XXXX-...! major = 1! minor = 1 B UUID = XXXX-...! 16ビット符号なし整数! major = 1! (0∼65,535) minor = 2
  29. 29. 実装する前に… • Xcode 5! • iOS SDK 7! • CoreLocation.framework! • CoreBluetooth.framework
  30. 30. Beaconになってみる - (void)viewDidLoad { [super viewDidLoad]; ! ! // 生成したUUIDからNSUUIDを作成 NSString *uuid = @"41282F26-524C-4F16-9E95-C06D90AF942A"; self.proximityUUID = [[NSUUID alloc] initWithUUIDString:uuid]; // CBPeripheralManagerを作成 self.peripheralManager = [[CBPeripheralManager alloc] initWithDelegate:self queue:nil options:nil]; // アドバタイズ開始処理 if (self.peripheralManager.state == CBPeripheralManagerStatePoweredOn) { [self startAdvertising]; } }
  31. 31. Beaconになってみる - (void)viewDidLoad { [super viewDidLoad]; ! ! // 生成したUUIDからNSUUIDを作成 NSString *uuid = @"41282F26-524C-4F16-9E95-C06D90AF942A"; self.proximityUUID = [[NSUUID alloc] initWithUUIDString:uuid]; // CBPeripheralManagerを作成 アドバタイズできる 状態か判定する self.peripheralManager = [[CBPeripheralManager alloc] initWithDelegate:self queue:nil options:nil]; // アドバタイズ開始処理 if (self.peripheralManager.state == CBPeripheralManagerStatePoweredOn) { [self startAdvertising]; } }
  32. 32. Beaconになってみる - (void)startAdvertising { // CLBeaconRegionを作成 ! CLBeaconRegion *beaconRegion = [[CLBeaconRegion alloc] initWithProximityUUID:self.proximityUUID major:1 minor:2 identifier:@"jp.classmethod.testregion"]; // NSDictionaryに変換 NSDictionary *beaconPeripheralData = [beaconRegion peripheralDataWithMeasuredPower:nil]; // アドバタイズ開始 [self.peripheralManager startAdvertising:beaconPeripheralData]; }
  33. 33. Beaconになってみる - (void)startAdvertising { // CLBeaconRegionを作成 ! 作りたいBeaconを 設定する CLBeaconRegion *beaconRegion = [[CLBeaconRegion alloc] initWithProximityUUID:self.proximityUUID major:1 minor:2 identifier:@"jp.classmethod.testregion"]; // NSDictionaryに変換 NSDictionary *beaconPeripheralData = [beaconRegion peripheralDataWithMeasuredPower:nil]; // アドバタイズ開始 [self.peripheralManager startAdvertising:beaconPeripheralData]; }
  34. 34. Beaconになってみる - (void)startAdvertising { // CLBeaconRegionを作成 ! 作りたいBeaconを 設定する CLBeaconRegion *beaconRegion = [[CLBeaconRegion alloc] initWithProximityUUID:self.proximityUUID major:1 minor:2 identifier:@"jp.classmethod.testregion"]; // NSDictionaryに変換 NSDictionary *beaconPeripheralData = [beaconRegion peripheralDataWithMeasuredPower:nil]; // アドバタイズ開始 [self.peripheralManager startAdvertising:beaconPeripheralData]; } 電波強度(rssi値)は! カスタマイズ可能
  35. 35. デモ!③ 1台の端末で Beaconを切り替える
  36. 36. テスト時に便利! 一家に一台 Beaconアプリ
  37. 37. https://github.com/ suwa-yuki/ BeaconSample
  38. 38. 3 ハマりどころ
  39. 39. ハマりどころ① アプリ起動時の領域観測 アプリ起動時(つまり領域観測開始時)に
 端末がBeaconの領域内に居ると didEnterRegion:が呼ばれない! [self.manager requestStateForRegion:self.region];
  40. 40. ハマりどころ① アプリ起動時の領域観測 - (void)locationManager:(CLLocationManager *)manager didDetermineState:(CLRegionState)state forRegion:(CLRegion *)region { switch (state) { case CLRegionStateInside: NSLog(@"CLRegionStateInside"); // 領域内に入ったときの処理 break; case CLRegionStateOutside: NSLog(@"CLRegionStateOutside"); // 領域内から出たときの処理 break; case CLRegionStateUnknown: NSLog(@"CLRegionStateUnknown"); break; default: break; } }
  41. 41. ハマりどころ① アプリ起動時の領域観測 いい感じに領域観測する手順 1. startMonitoringForRegion:で領域観測を始める! 2. requestStateForRegion:で領域内か判定する! 3. 領域内であれば入ったときの処理を実行する! 4. 領域外であれば何もしない (Enterまで待機)
  42. 42. ハマりどころ② Push通知に使いたい場合 • バックグランドでは、領域観測はできるが 距離観測はできない! • startMonitoringForRegion:はバックグランド OK! • startRangingBeaconsInRegion:はバックグ ランドNG (実行しても10秒くらいで終わる)
  43. 43. ハマりどころ② Push通知に使いたい場合 領域観測∼距離観測の手順 1. アプリを起動したら領域観測開始! 2. didEnterRegion:ではRegionに入ったことだけ通 知する(特定のBeaconに入った通知に使わない)! 3. アプリが表示されたら距離観測を開始する! 4. didRangeBeacons:で処理を行う
  44. 44. ハマりどころ③ 最も近いBeaconの判定 1. didRangeBeacons:は1秒おきに呼ばれる! 2. 取得できたBeaconのうち、一番近いBeacon を判定する! 3. 一番近いBeaconをアプリ内で保持しておく! 4. 次のdidRangeBeacons:で判定した一番近い Beaconと保持していたBeaconを比較する
  45. 45. ハマりどころ④ アプリ終了時の注意点 • startMonitoringForRegion:を呼んだあと
 マルチタスクからアプリを終了させると Beaconの領域内に入っても通知されない!! • マルチタスクから消す = ”アプリからの通知は 不要”というユーザーの行為であると捉える
  46. 46. 4 まとめ
  47. 47. まとめ • iBeaconは手軽!(のはず)! • 用法・用量を守って正しくお使いください! • Beaconが世の中に出回らないうちは、アプ リに組み込みましょう! • アイデアを広げて楽しく便利なiBeaconアプ リを作ってリリースしましょう!
  48. 48. おまけ iOSアプリリリース中! http://underscore-app.tumblr.com/
  49. 49. おまけ iOSアプリリリース中! iBeaconアプリは まだ ない… http://underscore-app.tumblr.com/
  50. 50. 最後までご清聴いただき 誠にありがとうございました!

×