UI/UX に影響の大きい watchOS 2 の新機能 3つ
-
Upload
shuichi-tsutsumi -
Category
Mobile
-
view
9.009 -
download
0
Transcript of UI/UX に影響の大きい watchOS 2 の新機能 3つ
![Page 1: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/1.jpg)
UI/UX に影響の大きい watchOS 2 の新機能 3つ
堤 修一 @shu223 2015.6.17 UI Crunch #5
![Page 2: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/2.jpg)
• iOS専業フリーランス
• ブログ『Over&Out その後』
• 著書
- 『iOS×BLE Core Bluetoothプログラミング』
- 『iOSアプリ開発 達人のレシピ100』
堤 修一
![Page 3: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/3.jpg)
お手伝いしたプロダクト(BLE関連)
Music for the Deaf
![Page 4: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/4.jpg)
お手伝いしたプロダクト(Watch関連)
よしだっち(DLE)
鷹の爪団の吉田君を育成するアプリ
WatchMe(Pocket Supernova) Watch に最適化されたビデオメッセージングアプリ。ウォッチで動画メッセージのプレビュー、素早い返信ができる
※お手伝いしたのは開発の初期、ウォッチ側
メール、Facebookメッセージ、TwitterのDM等を一元管理するアプリ
Swingmail(BHI)
※ウォッチ機能は現在開発中
![Page 5: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/5.jpg)
watchOS 2 とは?
![Page 6: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/6.jpg)
• Mac の OS = OS X iPhone / iPad / iPod touch の OS = iOSApple Watch の OS = watchOS
![Page 7: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/7.jpg)
• Mac の OS = OS X iPhone / iPad / iPod touch の OS = iOSApple Watch の OS = watchOS
• 先週のWWDC15で「watchOS 2」が発表された
![Page 8: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/8.jpg)
• Mac の OS = OS X iPhone / iPad / iPod touch の OS = iOSApple Watch の OS = watchOS
• 先週のWWDC15で「watchOS 2」が発表された
- 以前のものは「watchOS 1」ということになった
![Page 9: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/9.jpg)
• Mac の OS = OS X iPhone / iPad / iPod touch の OS = iOSApple Watch の OS = watchOS
• 先週のWWDC15で「watchOS 2」が発表された
- 以前のものは「watchOS 1」ということになった
• ネイティブ動作するアプリがつくれるように
![Page 10: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/10.jpg)
• Mac の OS = OS X iPhone / iPad / iPod touch の OS = iOSApple Watch の OS = watchOS
• 先週のWWDC15で「watchOS 2」が発表された
- 以前のものは「watchOS 1」ということになった
• ネイティブ動作するアプリがつくれるように
- 以前のウォッチアプリの「処理」はiPhone側で行われていた
![Page 11: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/11.jpg)
• Mac の OS = OS X iPhone / iPad / iPod touch の OS = iOSApple Watch の OS = watchOS
• 先週のWWDC15で「watchOS 2」が発表された
- 以前のものは「watchOS 1」ということになった
• ネイティブ動作するアプリがつくれるように
- 以前のウォッチアプリの「処理」はiPhone側で行われていた
- ネイティブアプリ・・・ウォッチ側で「処理」されるアプリ
![Page 12: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/12.jpg)
• Mac の OS = OS X iPhone / iPad / iPod touch の OS = iOSApple Watch の OS = watchOS
• 先週のWWDC15で「watchOS 2」が発表された
- 以前のものは「watchOS 1」ということになった
• ネイティブ動作するアプリがつくれるように
- 以前のウォッチアプリの「処理」はiPhone側で行われていた
- ネイティブアプリ・・・ウォッチ側で「処理」されるアプリ
• 多くの新機能も追加された
![Page 13: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/13.jpg)
watchOS 2 の新機能
※スクリーンショット類は全てAppleの公開ドキュメントからの引用です
![Page 14: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/14.jpg)
ピッカー
![Page 15: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/15.jpg)
ピッカー
メディア再生
![Page 16: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/16.jpg)
ピッカー
メディア再生 マイク録音
![Page 17: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/17.jpg)
ピッカー
メディア再生 マイク録音
アラート
![Page 18: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/18.jpg)
ピッカー
メディア再生 マイク録音
アラート アクションシート
![Page 19: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/19.jpg)
・・・数が多いので、
![Page 20: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/20.jpg)
・・・数が多いので、
ウォッチアプリのUI/UXに大きく影響する新機能
![Page 21: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/21.jpg)
・・・数が多いので、
ウォッチアプリのUI/UXに大きく影響する新機能を3つに絞って紹介します
![Page 22: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/22.jpg)
1. Complication
![Page 23: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/23.jpg)
![Page 24: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/24.jpg)
![Page 25: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/25.jpg)
現行のサードパーティ製Watchアプリの課題
![Page 26: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/26.jpg)
現行のサードパーティ製Watchアプリの課題
• 動作のもっさり感/画面の小ささとあいまって、タッチ操作してまでウォッチでやりたいことがそんなにない
![Page 27: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/27.jpg)
現行のサードパーティ製Watchアプリの課題
• 動作のもっさり感/画面の小ささとあいまって、タッチ操作してまでウォッチでやりたいことがそんなにない
• Glance は「上にスワイプ」というひと手間があるだけで、圧倒的に使用機会が減る
![Page 28: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/28.jpg)
現行のサードパーティ製Watchアプリの課題
• 動作のもっさり感/画面の小ささとあいまって、タッチ操作してまでウォッチでやりたいことがそんなにない
• Glance は「上にスワイプ」というひと手間があるだけで、圧倒的に使用機会が減る
→ 真に実用的なのは Complication !!
![Page 29: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/29.jpg)
現行のサードパーティ製Watchアプリの課題
• 動作のもっさり感/画面の小ささとあいまって、タッチ操作してまでウォッチでやりたいことがそんなにない
• Glance は「上にスワイプ」というひと手間があるだけで、圧倒的に使用機会が減る
→ 真に実用的なのは Complication !!
• (個人的には)実際のところ、使ってるのは「ワークアウト」だけ
![Page 30: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/30.jpg)
現行のサードパーティ製Watchアプリの課題
• 動作のもっさり感/画面の小ささとあいまって、タッチ操作してまでウォッチでやりたいことがそんなにない
• Glance は「上にスワイプ」というひと手間があるだけで、圧倒的に使用機会が減る
→ 真に実用的なのは Complication !!
• (個人的には)実際のところ、使ってるのは「ワークアウト」だけ
- 左腕を上げるだけで消費カロリーを確認できる
![Page 31: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/31.jpg)
現行のサードパーティ製Watchアプリの課題
• 動作のもっさり感/画面の小ささとあいまって、タッチ操作してまでウォッチでやりたいことがそんなにない
• Glance は「上にスワイプ」というひと手間があるだけで、圧倒的に使用機会が減る
→ 真に実用的なのは Complication !!
• (個人的には)実際のところ、使ってるのは「ワークアウト」だけ
- 左腕を上げるだけで消費カロリーを確認できる
• でもサードパーティ製アプリは Complication をつくれなかった
![Page 32: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/32.jpg)
ClockKit
![Page 33: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/33.jpg)
ClockKit• Complecation を作成・管理するためのフレームワーク。watchOS 2 で新たに追加された。
![Page 34: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/34.jpg)
ClockKit• Complecation を作成・管理するためのフレームワーク。watchOS 2 で新たに追加された。
→ サードパーティも Complication の作成が可能に!
![Page 35: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/35.jpg)
ClockKit• Complecation を作成・管理するためのフレームワーク。watchOS 2 で新たに追加された。
→ サードパーティも Complication の作成が可能に!
• 技術的な参考資料:WWDC15 セッション 209 “Creating Complecation with ClockKit”
![Page 36: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/36.jpg)
ClockKit• Complecation を作成・管理するためのフレームワーク。watchOS 2 で新たに追加された。
→ サードパーティも Complication の作成が可能に!
• 技術的な参考資料:WWDC15 セッション 209 “Creating Complecation with ClockKit”
• watchOS-2-Sampler にも後日追加予定
![Page 37: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/37.jpg)
2. Watch Connectivity
![Page 38: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/38.jpg)
Watch Connectivity とは?• Phone - Watch 間通信を行うためのフレームワーク
• 機能
- バックグラウンド送信
- 双方向メッセージング
![Page 39: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/39.jpg)
バックグラウンド送信• コンテンツをバックグラウンドで送信する
![Page 40: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/40.jpg)
• 3つのタイプ
![Page 41: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/41.jpg)
• 3つのタイプ
- Application Context
- User info transfer
- File transfer
![Page 42: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/42.jpg)
• 3つのタイプ
- Application Context
- User info transfer
- File transfer
・・・要は、データやファイルがバックグラウンドで送れる!
![Page 43: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/43.jpg)
• 3つのタイプ
- Application Context
- User info transfer
- File transfer
・・・要は、データやファイルがバックグラウンドで送れる!
→ Watch App 起動時点でデータを Phone 側と同期しておける(Glance にも便利そう)
![Page 44: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/44.jpg)
Phone - Watch 間で相互にメッセージやデータを送れる
双方向メッセージング
![Page 45: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/45.jpg)
Phone - Watch 間で相互にメッセージやデータを送れる
双方向メッセージング
watchOS 1 の頃は Watch → Phone しかできなかった(ただし Phone から Reply を返すことは可)
![Page 46: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/46.jpg)
Phone - Watch 間で相互にメッセージやデータを送れる
双方向メッセージング
watchOS 1 の頃は Watch → Phone しかできなかった(ただし Phone から Reply を返すことは可)
→ 親アプリ(Phone側)を起点にウォッチ側に何かをさせることが可能に
![Page 47: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/47.jpg)
メッセージ送信が可能なケース その1:
両者共にフォアグラウンド
![Page 48: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/48.jpg)
メッセージ送信が可能なケース その2:
iOS側だけバックグラウンド
✴ つまり、Watch 側はフォアグラウンドで起動している必要がある
![Page 49: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/49.jpg)
3. センサへのアクセス
![Page 50: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/50.jpg)
watchOS 1 時代
![Page 51: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/51.jpg)
watchOS 1 時代
(お客さん)「こんなアプリつくりたいんですけど」
![Page 52: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/52.jpg)
watchOS 1 時代
(お客さん)「こんなアプリつくりたいんですけど」
(堤)「すいません、それサードパーティ製アプリではできないんです・・・」
![Page 53: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/53.jpg)
watchOS 1 時代
(お客さん)「こんなアプリつくりたいんですけど」
(堤)「すいません、それサードパーティ製アプリではできないんです・・・」
- 手を挙げたときに~するアプリ(加速度センサ利用)
![Page 54: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/54.jpg)
watchOS 1 時代
(お客さん)「こんなアプリつくりたいんですけど」
(堤)「すいません、それサードパーティ製アプリではできないんです・・・」
- 手を挙げたときに~するアプリ(加速度センサ利用)
- ウォッチに呼びかけると~するアプリ(マイク利用)
![Page 55: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/55.jpg)
watchOS 1 時代
(お客さん)「こんなアプリつくりたいんですけど」
(堤)「すいません、それサードパーティ製アプリではできないんです・・・」
- 手を挙げたときに~するアプリ(加速度センサ利用)
- ウォッチに呼びかけると~するアプリ(マイク利用)
- etc…
![Page 56: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/56.jpg)
watchOS 1 時代
(お客さん)「こんなアプリつくりたいんですけど」
(堤)「すいません、それサードパーティ製アプリではできないんです・・・」
- 手を挙げたときに~するアプリ(加速度センサ利用)
- ウォッチに呼びかけると~するアプリ(マイク利用)
- etc…
→ 諦めたアイデアの多くがセンサ類を利用するものだった
![Page 57: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/57.jpg)
watchOS 2 でアクセス可能なセンサ・アクチュエータ
• 生(に近い)値を取得可能
- 加速度センサの値
- 歩数情報・・・ウォッチだけ持って歩いても変化する
• 制約付きで利用可能
- Taptic Engine・・・決められた9種の「タイプ」から選択できる
- マイク/スピーカー・・・既成UIから利用可能
- Bluetooth Headset からのオーディオファイル再生
- 心拍数・・・HealthKit からデータ取得可能(※watchOS 1 の頃から可能)
![Page 58: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/58.jpg)
まとめUI/UXに影響の大きい watchOS 2 の新機能3つ
• Complication (ClockKit)
- アプリ起動不要、Glanceのようにスワイプも不要- → ユーザーにとって最も利用ハードルが低く、実用度向上が期待できる
• Watch Connectivity
- バックグラウンドでのデータ送信 → 起動時点での親アプリとのデータ同期が可能に
- 双方向メッセージング → 以前はできなかた Phone → Watch の制御が可能に
• センサへのアクセス- 加速度センサや歩数情報が取得できるように → アプリの企画の幅が広がる
![Page 59: UI/UX に影響の大きい watchOS 2 の新機能 3つ](https://reader034.fdocument.pub/reader034/viewer/2022051414/55b7cd47bb61eb47758b465f/html5/thumbnails/59.jpg)
watchOS-2-Sampler
GitHub: shu223/watchOS-2-Sampler
Blog: watchOS 2 の新機能のサンプルコード集『watchOS-2-Sampler』
watchOS 2 新機能のサンプルコード集 - Accelerometer - Gyroscope - Pedometer - Heart Rate - Table Animations - Animated Properties - Audio Rec & Play - Picker Styles - Taptic Engine - Alert - Animation with Digital Crown - Interactive Messaging - Open System URL - Audio File Player