Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.
Pebbleハッカソン 
@Bob_Mk2
流れ 
1. Pebbleとは? 
2. Pebbleと親機 
3. 開発方法に関して 
4. HelloWorld 
5. まとめ
Pebbleとは?
Pebble 
 腕時計型デバイス 
 長持ち 
 充電しなくても1週間くらい持つ 
 始まりはKickstarter 
 最近特定クラスタで熱い 
 開発環境が整ってる 
皆さん、もう買いましたよね?
時計盤(Watchface)の切り替えが楽しい 
 いろいろな人が作ってるので妙に種類が豊富 
YWeather 
PalmOS 
DIGIBORG V3 Rosewright D 
Flappy Bird 2
どんなWatchfaceがあるの? 
 多いのは時計+α(天気や温度)が分かるもの 
Real Weather SmartStatus+ 
 凝った見た目のもの(怒られそうなもの) 
Number Scanner Supre Mario L...
アプリ(WatchApp)もあります 
 便利系 
 ゲーム 
Evernote eBay Misfit 
PebblePong 2 Solitaire PebbleBan
Pebble内のFaceとAppの位置づけ 
Watchface 
Face 
1 
… 
Face 
8 
メニュー 
Watchapp 
Alarms 
Settings 
Watchapp A 
… 
Watchapp n 
App 1 ...
Pebbleと親機
親機? 
 Pebble単体だと本当にただの時計です 
 親機と繋がることで色々できることが増えます 
 親機=iPhoneやAndroid 
 WindowsPhoneは無理ぽ 
 Pebble ⇔ 親機間はBluetooth接続
親機がいると何ができるの?(1/3) 
 FaceやAppのインストールや設定 
 親機上の公式アプリを使うことで可能
親機がいると何ができるの?(2/3) 
 各FaceやApp の設定 
 ※設定画面はWebViewで開かれる 
 → ウェブ上のどこかに設定画面の配置が必要
親機がいると何ができるの?(3/3) 
 ネットワーク接続 
 天気や気温は何らかのAPIを叩いている 
 その結果をPebbleに流し込んでいる 
 取得した画像を加工してPebbleで表示も可能 
 位置情報取得 
 親機側の位...
つまり親機が頑張る 
 色々できる(ように見える)のは親機の頑張り 
 ネットワーク繋がるのは親機のみ 
 Pebble単体で取れる情報は現在時刻ぐらい 
 定期的に親機に情報要求するのが基本的 
 30分毎に天気の更新をする、など ...
開発方法に関して
そもそも何が作れるの? 
 Watchface 
 時計盤 
 シェイクのみ検知可 
 Watchapp 
 ゲームや便利アプリとか 
 ボタン入力が取れます 
 作り方はほとんど同じ 
 開発途中で切り替えるのも比較的簡単 
...
基本的な開発スタイル 
PC 親機(Android / OS X) 子機(Pebble) 
3. これ入れて 
2. ビルドす 
る 
1. 鯖立て 
る 
4. これ入れて 
ケーブル無しで開発できるのが 
GOOD
開発方法 
1. Pebble SDK 
 Pebble側はC、親機側はJavascript で書く 
 公式「あ、Windows の人はVM 入れてね^^」 
2. CloudPebble 
 ブラウザ上で全て完結するので楽 
 難し...
CloudPebble 
 クラウド上で開発が可能 
 開発環境をローカルに整える必要無し 
 やったぜ 
 基本的なことは全てできる 
 ローカルでやると手間な箇所も吸収してくれる 
 開発環境もプロジェクト毎に3種類から選べる ...
見た目
そこそこカスタマイズ可能 
 テーマ 
 入力補完方法 
 As-you-type, Ctrl+Space 
 キーバインド 
 Standard, vim-like, emacs-like 
 インデント形式 
 spaces,...
CloudPebbleで他にできること 
 Githubとの連携 
 プロジェクト開始時にGithub上からインポート可 
 後からGithub上に上げたくなっても大丈夫 
 ログの確認 
 ビルド時のログ 
 アプリ実行時のログ
つよい
もうCloudPebbleだけでいいじゃん 
 はい 
 必要になったときに環境を整えれば良い 
1. 外部ライブラリをばりばり使う場合 
 CloudPebble上だとコピペ必須(辛い) 
2. なんか調子悪い時 
 親機に流し込む際...
HelloWorld
流れ 
1. 事前準備 
2. CloudPebbleにログイン 
3. プロジェクトをつくる 
4. ビルドして実行 
5. 終わり
本当にこれだけ? 
 はい 
 テンプレートに「HelloWorld」がありました
1. 事前準備(1/2) 
 Pebbleアカウント 
 ここでの説明は割愛 
 親機のPebbleアプリが最新版か確認 
 Settings > Version から確認可能 
 iOS の場合は2.5 
 Android の場合...
2. 事前準備(2/2) 
 親機がPCと同じ箇所にWiFi接続しているか確認 
 PCと親機が同一LAN内にいる必要があるため 
 Pebbleアプリを開発用に設定変更 
 Setting > Developer Options 
...
2. CloudPebble にログイン 
 CloudPebbleを開く 
 https://cloudpebble.net/ide/ 
 右上のSIGN IN からログイン 
 Pebbleアカウントでログイン可能
3. プロジェクトをつくる 
 CREATEボタンを押す 
 よしなに項目を埋める 
 Project Name 
 Project Type 
 Template 
HelloWorld 
Pebble C SDK 
HelloWo...
4. ビルドして実行 
 hello_world.c を選択 
 画面右側に▶ボタンが出るのでそれを選択
しばらく待つと
Pebble上にに表示されるはず 
やったぜ
うまくいかなかった場合(Androidの人) 
 親機内のPebbleアプリが古い 
 左側のメニュー内にあるCOMPILATION を選択 
 最新版へのリンクが貼られてるので選択 
 apkファイルを落とす→ Androidにインス...
Android最新版へのリンク(2014/11/17時点) 
 V2.1.0-Beta9 
 https://www.dropbox.com/s/hjz0eoremh9m2g 
u/pebble-release-2.1.0-beta9- 
...
CloudPebbleの設定 
 テーマだけは変更をオススメ 
 デフォルトは警告行を範囲選択した時視認できない 
CloudPebble 
Blackboard(TextMate)
まとめ
Pebble 
 開発環境が整っているので捗る 
 CloudPebbleなら導入コストはほぼ0 
 PebbleはあくまでView 
 重たいことや複雑なことは親機にやらせよう 
 持っていない人はPebble買いましょう 
 今...
ハッカソン開始!! 
 導入にオススメ 
 Pebble 公式のチュートリアル(part1~part3) 
 天気APIを叩いて表示するところまでやります 
 http://developer.getpebble.com/getting...
Prochain SlideShare
Chargement dans…5
×

Pebbleハッカソン

2 378 vues

Publié le

Pebbleハッカソンで発表した資料です。
開発入門向けというよりも、Pebbleってなんやねんというところから話を始めます。

Publié dans : Environnement
  • DOWNLOAD THIS BOOKS INTO AVAILABLE FORMAT (Unlimited) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download Full EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... ACCESS WEBSITE for All Ebooks ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download doc Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Répondre 
    Voulez-vous vraiment ?  Oui  Non
    Votre message apparaîtra ici
  • DOWNLOAD THIS BOOKS INTO AVAILABLE FORMAT (Unlimited) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download Full EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... ACCESS WEBSITE for All Ebooks ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download doc Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Répondre 
    Voulez-vous vraiment ?  Oui  Non
    Votre message apparaîtra ici

Pebbleハッカソン

  1. 1. Pebbleハッカソン @Bob_Mk2
  2. 2. 流れ 1. Pebbleとは? 2. Pebbleと親機 3. 開発方法に関して 4. HelloWorld 5. まとめ
  3. 3. Pebbleとは?
  4. 4. Pebble  腕時計型デバイス  長持ち  充電しなくても1週間くらい持つ  始まりはKickstarter  最近特定クラスタで熱い  開発環境が整ってる 皆さん、もう買いましたよね?
  5. 5. 時計盤(Watchface)の切り替えが楽しい  いろいろな人が作ってるので妙に種類が豊富 YWeather PalmOS DIGIBORG V3 Rosewright D Flappy Bird 2
  6. 6. どんなWatchfaceがあるの?  多いのは時計+α(天気や温度)が分かるもの Real Weather SmartStatus+  凝った見た目のもの(怒られそうなもの) Number Scanner Supre Mario Land DOOM
  7. 7. アプリ(WatchApp)もあります  便利系  ゲーム Evernote eBay Misfit PebblePong 2 Solitaire PebbleBan
  8. 8. Pebble内のFaceとAppの位置づけ Watchface Face 1 … Face 8 メニュー Watchapp Alarms Settings Watchapp A … Watchapp n App 1 App n
  9. 9. Pebbleと親機
  10. 10. 親機?  Pebble単体だと本当にただの時計です  親機と繋がることで色々できることが増えます  親機=iPhoneやAndroid  WindowsPhoneは無理ぽ  Pebble ⇔ 親機間はBluetooth接続
  11. 11. 親機がいると何ができるの?(1/3)  FaceやAppのインストールや設定  親機上の公式アプリを使うことで可能
  12. 12. 親機がいると何ができるの?(2/3)  各FaceやApp の設定  ※設定画面はWebViewで開かれる  → ウェブ上のどこかに設定画面の配置が必要
  13. 13. 親機がいると何ができるの?(3/3)  ネットワーク接続  天気や気温は何らかのAPIを叩いている  その結果をPebbleに流し込んでいる  取得した画像を加工してPebbleで表示も可能  位置情報取得  親機側の位置情報が有効になってる必要有り  現在位置の天気はだいたいこれを使っているはず
  14. 14. つまり親機が頑張る  色々できる(ように見える)のは親機の頑張り  ネットワーク繋がるのは親機のみ  Pebble単体で取れる情報は現在時刻ぐらい  定期的に親機に情報要求するのが基本的  30分毎に天気の更新をする、など  AppMessageという仕組みでやりとり 情報ください! ほい
  15. 15. 開発方法に関して
  16. 16. そもそも何が作れるの?  Watchface  時計盤  シェイクのみ検知可  Watchapp  ゲームや便利アプリとか  ボタン入力が取れます  作り方はほとんど同じ  開発途中で切り替えるのも比較的簡単 シェイク 入力取れる
  17. 17. 基本的な開発スタイル PC 親機(Android / OS X) 子機(Pebble) 3. これ入れて 2. ビルドす る 1. 鯖立て る 4. これ入れて ケーブル無しで開発できるのが GOOD
  18. 18. 開発方法 1. Pebble SDK  Pebble側はC、親機側はJavascript で書く  公式「あ、Windows の人はVM 入れてね^^」 2. CloudPebble  ブラウザ上で全て完結するので楽  難しいことしないのであればこれだけでイナフ 3. Pebble.js (beta)  全部Javascript だけで書ける  まだ触れてないので何とも
  19. 19. CloudPebble  クラウド上で開発が可能  開発環境をローカルに整える必要無し  やったぜ  基本的なことは全てできる  ローカルでやると手間な箇所も吸収してくれる  開発環境もプロジェクト毎に3種類から選べる  Pebble SDK  Pebble.js  Simply.js
  20. 20. 見た目
  21. 21. そこそこカスタマイズ可能  テーマ  入力補完方法  As-you-type, Ctrl+Space  キーバインド  Standard, vim-like, emacs-like  インデント形式  spaces, tabs  タブ幅
  22. 22. CloudPebbleで他にできること  Githubとの連携  プロジェクト開始時にGithub上からインポート可  後からGithub上に上げたくなっても大丈夫  ログの確認  ビルド時のログ  アプリ実行時のログ
  23. 23. つよい
  24. 24. もうCloudPebbleだけでいいじゃん  はい  必要になったときに環境を整えれば良い 1. 外部ライブラリをばりばり使う場合  CloudPebble上だとコピペ必須(辛い) 2. なんか調子悪い時  親機に流し込む際に延々と「準備中」で進まなくなる  何が起きてるのかCloudPebble上からだと確認しづらい  最初はクラウド、後からローカルも可  必要なものはクラウド上からzipで落とせる とっかかりやすい!(大切)
  25. 25. HelloWorld
  26. 26. 流れ 1. 事前準備 2. CloudPebbleにログイン 3. プロジェクトをつくる 4. ビルドして実行 5. 終わり
  27. 27. 本当にこれだけ?  はい  テンプレートに「HelloWorld」がありました
  28. 28. 1. 事前準備(1/2)  Pebbleアカウント  ここでの説明は割愛  親機のPebbleアプリが最新版か確認  Settings > Version から確認可能  iOS の場合は2.5  Android の場合は2.1.0-beta9  Playストアのものだとダメな場合がある  ひどい…  最新版はCloudPebble にリンクが貼られてるので  とりあえず後まわしでOK
  29. 29. 2. 事前準備(2/2)  親機がPCと同じ箇所にWiFi接続しているか確認  PCと親機が同一LAN内にいる必要があるため  Pebbleアプリを開発用に設定変更  Setting > Developer Options  Enable Developer Connection にチェックを付ける  メニュー上にDEVELOPER が増えているので  その項目を選択して、Enable にチェックを付ける
  30. 30. 2. CloudPebble にログイン  CloudPebbleを開く  https://cloudpebble.net/ide/  右上のSIGN IN からログイン  Pebbleアカウントでログイン可能
  31. 31. 3. プロジェクトをつくる  CREATEボタンを押す  よしなに項目を埋める  Project Name  Project Type  Template HelloWorld Pebble C SDK HelloWorld ▼ ▼ よしなに デフォルト 要変更  CREATEボタンを押してプロジェクト作成
  32. 32. 4. ビルドして実行  hello_world.c を選択  画面右側に▶ボタンが出るのでそれを選択
  33. 33. しばらく待つと
  34. 34. Pebble上にに表示されるはず やったぜ
  35. 35. うまくいかなかった場合(Androidの人)  親機内のPebbleアプリが古い  左側のメニュー内にあるCOMPILATION を選択  最新版へのリンクが貼られてるので選択  apkファイルを落とす→ Androidにインストール  QRコード作ってAndroidで読み込むのがオススメ  ※Android 4.3 以上だけ
  36. 36. Android最新版へのリンク(2014/11/17時点)  V2.1.0-Beta9  https://www.dropbox.com/s/hjz0eoremh9m2g u/pebble-release-2.1.0-beta9- 515.apk?dl=0
  37. 37. CloudPebbleの設定  テーマだけは変更をオススメ  デフォルトは警告行を範囲選択した時視認できない CloudPebble Blackboard(TextMate)
  38. 38. まとめ
  39. 39. Pebble  開発環境が整っているので捗る  CloudPebbleなら導入コストはほぼ0  PebbleはあくまでView  重たいことや複雑なことは親機にやらせよう  持っていない人はPebble買いましょう  今なら$99 です  送料無料  スチール版だと$199
  40. 40. ハッカソン開始!!  導入にオススメ  Pebble 公式のチュートリアル(part1~part3)  天気APIを叩いて表示するところまでやります  http://developer.getpebble.com/getting-started/watchface-tutorial/ part1/  有志の方のチュートリアル  上のチュートリアルよりも少し発展  part3を終えると公式からオススメされる  http://ninedof.wordpress.com/pebble-sdk-tutorial/  SDK 2.0 Tutorial

×