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
Pebble + JavaScriptでつくるスマートウォッチ
Search
kadoppe
November 24, 2014
Technology
0
230
Pebble + JavaScriptでつくるスマートウォッチ
2014/11/16に開催された「JSBoard勉強会東京#1」で発表した際に使用したスライドです。
kadoppe
November 24, 2014
Tweet
Share
More Decks by kadoppe
See All by kadoppe
一年間スタートアップのCTOをやってきて学んだこと
kadoppe
1
910
未知の顧客にとっても価値あるプロダクトを生み出す
kadoppe
2
1.9k
プレイド開発チームにおけるチーム・ジャーニー ver.202010
kadoppe
4
1k
不確実性の高い世界のなかで、非連続な成長を生み出す / Developers Summit 2020 Summer
kadoppe
1
2k
プレイド開発チームにおけるチーム・ジャーニー
kadoppe
12
7k
プレイドのエンジニアからみた「正しいものを正しくつくる」
kadoppe
0
2.2k
フラット型組織におけるエンジニアリングマネジメント
kadoppe
1
1.4k
Firefox OSでSVGをつかってみた
kadoppe
0
140
まだ間に合うHTML5 - Yeomanで追いつけ!高速Webアプリ開発
kadoppe
0
170
Other Decks in Technology
See All in Technology
経験がないことを言い訳にしない、 AI時代の他領域への染み出し方
parayama0625
0
290
Claude Codeが働くAI中心の業務システム構築の挑戦―AIエージェント中心の働き方を目指して
os1ma
9
1.5k
興味の胞子を育て 業務と技術に広がる”きのこ力”
fumiyasac0921
0
550
モバイルゲームの開発を支える基盤の歩み ~再現性のある開発ラインを量産する秘訣~
qualiarts
0
1.1k
【CEDEC2025】ブランド力アップのためのコンテンツマーケティング~ゲーム会社における情報資産の活かし方~
cygames
PRO
0
220
AI によるドキュメント処理を加速するためのOCR 結果の永続化と再利用戦略
tomoaki25
0
340
KubeCon + CloudNativeCon Japan 2025 Recap
donkomura
0
110
AI エンジニアの立場からみた、AI コーディング時代の開発の品質向上の取り組みと妄想
soh9834
8
640
AWS表彰プログラムとキャリアについて
naoki_0531
1
150
Mambaで物体検出 完全に理解した
shirarei24
2
200
【CEDEC2025】LLMを活用したゲーム開発支援と、生成AIの利活用を進める組織的な取り組み
cygames
PRO
1
2.4k
Power Automate のパフォーマンス改善レシピ / Power Automate Performance Improvement Recipes
karamem0
0
280
Featured
See All Featured
Building an army of robots
kneath
306
45k
Practical Orchestrator
shlominoach
190
11k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
126
53k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
Navigating Team Friction
lara
188
15k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
6k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
182
54k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
KATA
mclloyd
31
14k
RailsConf 2023
tenderlove
30
1.2k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
33
2.4k
Making Projects Easy
brettharned
117
6.3k
Transcript
Pebble + JavaScriptͰͭ͘Δ εϚʔτΥονΞϓϦ JSBoardษڧձ #1 / @kadoppe
@kadoppe Software Engineer
Question
Q1. PebbleͬͯΔਓʁ
Q2. Pebble࣋ͬͯΔਓʁ
Q3. PebbleΞϓϦ࡞ͬͯΔਓʁ
ࠓͷత JavaScriptϓϩάϥϚʹ PebbleͷΞϓϦ։ൃʹڵຯΛ ࣋ͬͯΒ͏
͓͜ͱΘΓ Pebble ≠ JSBoard
PebbleͬͯԿʁ • σδλϧ࣌ܭ Pebble Pebble Steel $99 $199 1FCCMF ࣸਅ
1FCCMF 4UFBM ࣸਅ
PebbleͰԿ͕Ͱ͖Δͷʁ
1. εϚϑΥͱͭͳ͕Δ 1FCCMF ެࣜΞϓϦ શͯͷ௨ ԻָϓϨΠϠૢ࡞ 1FCCMF
2. ΞϓϦͰΧελϚΠζ͢Δ 1FCCMF ެࣜΞϓϦ Πϯετʔϧ ΞϓϦετΞ ʢ࠷େ8ͭ·Ͱʣ 1FCCMF
PebbleΞϓϦ͕ѻ͑Δใ
1. ࣌ࠁ ࣌ܭͳͷͰͨΓલ
1FCCMF 2. ֤छηϯαʔใ Ճηϯα ిࢠίϯύε GPS 1FCCMF ެࣜΞϓϦ ΞϓϦ
1FCCMF 2. Web͔Βऔಘͨ͠ใ 1FCCMF ެࣜΞϓϦ ΞϓϦ ֤छ 8FC"1* Bluetooth
HTTP ը૾Ҿ༻ݩ: https://getpebble.com/checkout
৭ʑΈ߹ΘͤΔ͜ͱͰ Մೳੑແݶେ
PebbleΞϓϦͷछྨ
1. Watchface • ࣌ܭϞʔυͷσβΠϯςʔϚ • ࣌ࠁ͚ͩͰͳ͘ɺ༷ʑͳใ͕දࣔՄೳ
2. Watchapp • ࣌ܭϞʔυˠϝχϡʔ͔ΒىಈͰ͖ΔΞϓϦ • Pebbleຊମӈଆͷ̏ͭͷϘλϯૢ࡞Λ ΞϓϦ͔Βݕग़Ͱ͖Δ
PebbleΞϓϦͷͭ͘Γ͔ͨ
SDK • Pebble͕ఏڙ͢ΔSDKΛͬͯΞϓϦΛ։ൃ • େ͖̎͘छྨͷ։ൃํ๏͕͋Δ
1FCCMFެࣜΞϓϦ +BWB4DSJQU &OHJOF +BWB4DSJQU $ݴޠ 1. C & JavaScriptͰ։ൃ ɾUIදࣔ
ɾηϯαʔऔಘ ɾεϚϑΥͱͷ௨৴ ɾWeb APIݺग़ ɾGPSऔಘ ɾPebbleͱͷ௨৴ ը૾Ҿ༻ݩ: https://getpebble.com/checkout 1FCCMF
ํ๏1ͷ • Cݴޠͷ͕ࣝඞཁ • ௨৴ॲཧΛC & JavaScriptͰ࣮͢Δͷ͕खؒ
1FCCMFެࣜΞϓϦ +BWB4DSJQU &OHJOF +BWB4DSJQU 1FCCMFKTʣ 2. JavaScriptͷΈͰ։ൃ Ӆṭ 1FCCMF
ํ๏2ͷ • ిྗফඅྔ͕ߴ͍ & UIߋ৽ͷԆ͕ൃੜ • εϚϑΥଆͷJavaScript EngineͰUIߋ৽ॲཧ Λ͓͜ͳ͏ͨΊʢະௐࠪʣ •
β൛ͷͨΊಈ࡞͕ෆ҆ఆ • Ұ෦ηϯαʔใΛऔಘ͢ΔͨΊͷAPI͕ͳ͍
ΞϓϦΛͭͬͯ͘ΈΔ ʢϥΠϒίʔσΟϯάʣ
ඞཁͳͷ • Webϒϥβ • PebbleެࣜΞϓϦΠϯετʔϧࡁΈεϚϑΥ • Pebbleຊମ
͋Εʁ։ൃڥʁ
CloudPebble ϓϩδΣΫτ࡞ˠίʔσΟϯάˠίϯύΠϧ PebbleͷΞϓϦసૹˠϩά֬ೝ
Webϒϥβ͚ͩͰ։ൃՄೳ
ͭ͘Δͷ • Watchface • ࣌ࠁΛදࣔ • ݱࡏͷ͓ఱؾΛදࣔ • GPS •
OpenWeatherMap API
ϥΠϒίʔσΟϯάελʔτ (άμͬͨΒ͢Έ·ͤΜʣ https://github.com/kadoppe/pebble-gps-weather-watch
ϥΠϒίʔσΟϯά͓͠·͍
PebbleͷUIίϯϙʔωϯτ
Window • ͬͱجຊతͳUIίϯϙʔωϯτ • ࠲ඪɾαΠζΛࢦఆͯ͠ࢠཁૉΛஔͰ͖Δ • ςΩετ • ը૾ •
ۣܗɾԁ
Card • ߏԽ͞ΕͨใΛදࣔ͢ΔͨΊͷWindow • λΠτϧ • αϒλΠτϧ • ຊจ •
όφʔը૾
Menu • ϦετใΛදࣔ͢ΔͨΊͷWindow • ϘλϯʹΑΔεΫϩʔϧՄೳ
ͦͷଞUIίϯϙʔωϯτ • ը૾σʔλʢ2ը૾ͷΈʣͷදࣔ • Windowʹஔͨ͠ཁૉͷΞχϝʔγϣϯ • ۣܗ/ԁ
ࣗ༝ʹΈ߹Θͤͯૉఢͳ ΞϓϦΛͭͬͯ͘Έ͍ͯͩ͘͞
Pebbleͷ
ຊޠ͕จࣈԽ͚͢Δ • γεςϜʹຊޠϑΥϯτ͕Έࠐ·Εͯ ͍ͳ͍͜ͱ͕ݪҼ
ରࡦ1. ΧελϜϑΝʔϜΣΞ • Pebble ຊޠ ʢͻΒ͕ͳɺΧλΧφʣ ϑΝʔϜΣΞΛPebbleʹΠϯετʔϧ͢Δ http://www.texpress.co.jp/pebble_hiragana • ࣈදࣔ͞ΕΔʢ1200จࣈछʣ
• ࣗݾͰ
ରࡦ2. αʔυύʔςΟ௨ΞϓϦ • εϚϑΥͷ௨ʢຊޠʣΛPebbleʹදࣔ͢ΔͨΊͷΞϓ Ϧ͕ଘࡏ͢Δ • iOS: PebbleCCʢཁࠈʣ • Android:
YaNC PRO Pebble Notifications https://play.google.com/store/apps/details? id=com.runnerway.pebblenotification • ຊޠ͕දࣔ͞ΕΔͷαʔυύʔςΟΞϓϦͷΈ
ͦΜͳPebbleͰ͕͢ ·ͣຊޠʹґଘ͠ͳ͍ ΞϓϦ͔Β։ൃͯ͠Έ·ͤΜ͔ʁ
͓͠·͍ ͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠
ը૾ग़ల http://en.wikipedia.org/wiki/ IPhone_5#mediaviewer/File:IPhone_5.png https://getpebble.com/pebble