iOS11からできる！WebRTCでできること
だいぶ前になりますが、9月にうちうちで発表した内容をブログで整理してみました。
今年のWWDCで、いよいよMac SafariとiOS SafariでもWebRTCが正式サポートされることになり、
Webコンテンツでできそうなことを書いてみました。
ちなみに、WebRTCの醍醐味(?)とも言えるビデオチャットについては触れず、
カメラ・オーディオアクセスに焦点におきスタンドアローンでやれそうな事柄を列記しています。
スライドのうちできそうなことをまとめると、
- シームレスな導線設計
これまでカメラを使った施策だと、標準のカメラアプリを立ち上げたり、カメラロールから写真を選ぶという中間工程が発生するところを、カメラデバイスにアクセスすることで一貫した体験コンテンツが作れそう。
(既に撮影したものから選択するケースは、これまで通り<input type="file"...>を使ってカメラロールから選ぶことになりそうですが)
- カメラ撮影のカスタマイズ
カメラアプリだと、撮影エリアと撮影ボタン・カメラ切替ボタン(+撮影モードがいくつか)が標準ですが、Webページの中にカメラから投影された映像を埋め込めるので、周りをフィルタで飾ったりする等、撮影画面もクリエイティブに活用できそうです。
一方で、標準カメラアプリにないUIを独自でカスタマイズする(撮影ボタンをどこにおくかとか)が必要になります。
- 顔認識ライブラリと連携したコンテンツ
「シームレスな導線設計」にも関連しますが、顔認識はJSあるいはサーバサイドでカメラやカメラロールで取得した静止画像を使って認識するというものになっていました。
ただ、カメラから取得した動画ストリームを顔認識ライブラリで加工できるようになると、SNOWのようなアプリでしかできなかったことでブラウザでもできるようになりそうです。
この辺りは使うライブラリによって認識精度やフィジビリも変わってきそうです。
- マーカーを読み取ってのARコンテンツ
これも顔認識と同様、モバイルブラウザでできそうなインタラクティブ領域の一つです。
AR.jsというjsでARコンテンツが作れるライブラリを活用して、マーカーに反応して3Dモデルを表示したりと、アプリをインストールせずに遊べるコンテンツが作れそうです。
- マイクで取得した音声のビジュアライズ
WebRTCはカメラだけでなくオーディオデバイスへのアクセスも可能です。
そのため、スマホのマイクから音を拾ってボリュームなどに応じたビジュアライズコンテンツができそうです。音量が大きいとレスポンスを返してくれたりと、今後は音声解析も加えてモバイルでできると楽しそうです。
スマホアプリにはできてモバイルブラウザでできなかったことが、今後できることがいろいろ増えてきてフロントエンド側としてはモチベーション高まるものがあります。
ただ、WebRTC未対応のデバイス(iOS10以下)を使っているユーザも少なからずいるわけで、そうした人向けに対するフォローアップも必要と思われます。
