なぜ今PWAがきているのか　トレンドの背景

なぜ今PWAがきているのかトレンドの背景 TAM 角谷仁

自己紹介角谷仁すみやひとし @hitoshisum ・PWA Nightコミュニティ運営・プロジェクトマネージャ/ディレクター11年・父親歴1.5年・開発チーム30名のマネージャ
・デジタル戦略の立案、開発案件のPMなど・趣味は釣り TAM プロデューサー

このセッションのゴール・PWAをただしく理解すること・PWAを身近に感じてみること

ちなみに今日来てる人？・職種・PWAへの関わり度

PWAってなに？

https://mobile.twitter.com/ Twitter Lite https://www.instagram.com/ Instagram 触ってみよう！

身近なPWA

https://appsco.pe/

PWA、なんとなくはわかるけどなんと説明したらいいかよくわからない…

概念的すぎてよくわからないややこしい説明例

「ネイティブアプリみたいな」は分かりやすいけど実際のところPWAが何かがよくわからないややこしい説明例

機能面で理解しようとすると、「オフライン対応とプッシュ通知」だけがPWAとおもってしまうややこしい説明例

技術面だけで理解しようとすると「Service Worker」や「Manifest」をいれてれば PWAっておもっちゃう。ややこしい説明例

本質は「よりよいウェブ体験」を作っていくこと。みんなでいいウェブの世界を作っていこうね～

こう説明するのがいいと思う。 PWA＝（最新の環境に合わせた）先進的なWebアプリケーション Googleが提唱した概念で、・ネットワークに依存せず（Reliable）・表示が早くて、アクションもスムーズで（Fast）・プッシュ通知やホームボタンに追加できる（Engaging）というこれまでにない新しいUXを提供するWebアプリケーションを目指しています。

先進的ってどういうこと？

いままでもできたこと最近できるようになってきたことこれからできるようになることブラウザは絶えず進化している Service Worker/Web App Manifestが使えるように。・ブラウザプッシュ通知・ホームボタン追加の案内
・ブラウザでキャッシュのコントロールができるように。 … ブラウザのAPIが充実・Badging API、Payment Request API… よりネイティブ機能へのアクセスが充実していく・cssでのリッチな表現・JSでつるつる動くサイト（SPA等）・非同期でのデータ通信 … [ブラウザにできること]

Progressive=進歩的、先進的、段階的「よりよくしていこう」

思い出そう「Progressive Enhancement」

2012年頃の話

https://codepen.io/matuzo/pen/Emddvx

よりよいWeb体験を作っていこう！

トレンドをつかもう

いまPWAが来てる感じって 2012年頃にレスポンシブがトレンドになった時とすごく良く似てる。

・ブラウザが進化したことで普及した点・クロスプラットフォーム対応の方法である点・Googleさんが推進している点何が似てる？

iOSでプッシュ通知ができるようになったら… できること増えてきたらブラウザが進化したことで普及した。

ブラウザはどんどん進化しているブラウザでよりネイティブに近い体験ができるようになっていってる。

クロスプラットフォーム対応の方法である点 iOS: Objective C, Xcode Android: Java, Eclipse Windows: C#,
Visual Studio

ネイティブあるある・アプリを開発できる優秀なエンジニアが給料の高い会社に転職・ネイティブアプリを作ったけど、ダウンロード数が1000以下・低評価→ダウンロードされない・最初だけでなくすべてがダブルコスト。ちょっとしたことで予算がなくなる・２つあるがために、改善するサイクルが遅くなってしまう・OSのバージョンアップに伴う対応 / 新しい画面サイズ対応・改修の度にいちいち審査が必要

MicrosoftもPWA押し。

Googleさんが推進している点

Googleフォト Google Map Go Google 検索

このPWA Nightでも・・・

こんなツールもでてきた。 https://www.glideapps.com/

僕はPWAはウェブに関わる人の未来と思ってます。 PWAは一過性のものではなく大きなトレンドととらえてみんなで一緒に勉強していきましょう！

なぜ今PWAがきているのか　トレンドの背景

なぜ今PWAがきているのか　トレンドの背景

Hitoshi Sumiya

More Decks by Hitoshi Sumiya

Other Decks in Technology

Featured

Transcript