Google I/O 2021 Recap - Speaker Deck

Slide 1

Slide 1 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 Google I/O 2021 Recap 1

Slide 2

Slide 2 text

PAGE # MOONGIFT / 50 DAY 2019/02/14 自己紹介 2 @goofmint fb.me/goofmint 中津川篤司株式会社MOONGIFT代表取締役エバンジェリストコミュニティ主催 https://www.moongift.jp

Slide 3

Slide 3 text

PAGE # MOONGIFT / 50 DAY 2019/02/14 OYAKUSOKU •あくまでもセッション動画を見たまとめです •間違った認識があったらご連絡ください •細かな技術的な質問には答えられない可能性があります 3

Slide 4

Slide 4 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 Google I/O? Googleが開催している年次開発者向けカンファレンス 4 2021年は5月18〜20日、オンラインで開催 IUUQTFWFOUTHPPHMFDPNJP

Slide 5

Slide 5 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 テーマ 5

Slide 6

Slide 6 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 取り上げるセッション 1. PWA に関する 5 つのヒント 2. 読み込み後のパフォーマンス 3. Web Vitals の最新情報 4. Core Web Vitalsによるビジネスインパクト 5. Digital Goods APIを使用したPlay請求サービスによるPWAへの支払い 6. 効果的なパスワードの管理 7. Excalidraw と Fugu: コアユーザーナビゲーションの改善 6

Slide 7

Slide 7 text

Slide 8

Slide 8 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 セッション紹介 8

Slide 9

Slide 9 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 PWA に関する 5 つのヒントプログレッシブウェブアプリによって、ユーザーのパソコンまたはモバイルデバイスにインストールされている通常のアプリと同様の外観と動作を持つウェブアプリを作成できます。ここでは PWA を活用して、ユーザーがより統合され自然と感じるエクスペリエンスを提供するための 5 つの簡単な改善点を説明します。投資の効果を測定する方法も紹介します。 9

Slide 10

Slide 10 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 10

Slide 11

Slide 11 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 11

Slide 12

Slide 12 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 12

Slide 13

Slide 13 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 13

Slide 14

Slide 14 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 14

Slide 15

Slide 15 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 15

Slide 16

Slide 16 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 16

Slide 17

Slide 17 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 17

Slide 18

Slide 18 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 18

Slide 19

Slide 19 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 19

Slide 20

Slide 20 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 読み込み後のパフォーマンスウェブパフォーマンスの最適化では、最初のページ読み込みに焦点が当てられる傾向があります。これは、ページ読み込みがオーディエンスを失う可能性がある最初の主要なランドマークであるためですが、高度にインタラクティブなページのユーザーエクスペリエンスは、しばしば読み込み後の特性によって左右されます。ここでは、読み込み後にページを速いと感じさせるための要素は何であるのかを探り、ウェブパフォーマンスにおける重要性が増しているこの側面について測定、最適化する方法を説明します。 20

Slide 21

Slide 21 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 21

Slide 22

Slide 22 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 22

Slide 23

Slide 23 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 23

Slide 24

Slide 24 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 24

Slide 25

Slide 25 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 25

Slide 26

Slide 26 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 26

Slide 27

Slide 27 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 27

Slide 28

Slide 28 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 28

Slide 29

Slide 29 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 29

Slide 30

Slide 30 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 30

Slide 31

Slide 31 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 Web Vitals の最新情報 Google では、Web Vitals に関するフィードバックの聞き取りを懸命に進めています。このセッションでは、ウェブに関する主な指標をツールによって測定、最適化する方法に関する最新の調査結果を紹介します。 31

Slide 32

Slide 32 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 32

Slide 33

Slide 33 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 33

Slide 34

Slide 34 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 34

Slide 35

Slide 35 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 35

Slide 36

Slide 36 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 36

Slide 37

Slide 37 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 37

Slide 38

Slide 38 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 38

Slide 39

Slide 39 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 39

Slide 40

Slide 40 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 40

Slide 41

Slide 41 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 41

Slide 42

Slide 42 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 42

Slide 43

Slide 43 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 43

Slide 44

Slide 44 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 44

Slide 45

Slide 45 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 45

Slide 46

Slide 46 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 46

Slide 47

Slide 47 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 Core Web Vitalsによるビジネスインパクト Chrome 開発チームから、グローバルブランドが Web Vitals への投資を決定した理由とそれがビジネスとユーザーにもたらしたメリットを紹介します。ぜひご参加ください。ウェブサイトの LCP、FID、CLS を調整することが企業の成功にどのように役立つか、また、これがどうのように組織においてパフォーマンスを優先する動機付けとなるのかをデベロッパー向けに説明します。 47

Slide 48

Slide 48 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 48

Slide 49

Slide 49 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 49

Slide 50

Slide 50 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 50

Slide 51

Slide 51 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 51

Slide 52

Slide 52 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 52

Slide 53

Slide 53 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 53

Slide 54

Slide 54 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 54

Slide 55

Slide 55 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 55

Slide 56

Slide 56 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 56

Slide 57

Slide 57 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 57

Slide 58

Slide 58 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 58

Slide 59

Slide 59 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 59

Slide 60

Slide 60 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 60

Slide 61

Slide 61 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 61

Slide 62

Slide 62 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 62

Slide 63

Slide 63 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 63

Slide 64

Slide 64 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 64

Slide 65

Slide 65 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 65

Slide 66

Slide 66 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 66

Slide 67

Slide 67 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 Digital Goods APIを使用したPlay 請求サービスによるPWAへの支払い Digital Goods API を使用して、Google Play ストアで PWA を収益化できるようになりました。Google Play 側で決済プロセスを処理するので、金銭的なトランザクションを直接処理する必要は一切ありません。ユーザーによる支払いは、慣れ親しんだ一貫性のある購入フローに沿って行われます。このハンズオンセッションは、「Google Play ストアへプログレッシブウェブアプリを掲載する」の続編です。段階を追った例とデモを通して、Play 請求サービスの Web Payments 標準との新しい統合の使用方法を説明します。 67

Slide 68

Slide 68 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 68

Slide 69

Slide 69 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 69

Slide 70

Slide 70 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 70

Slide 71

Slide 71 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 71

Slide 72

Slide 72 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 72

Slide 73

Slide 73 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 73

Slide 74

Slide 74 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 74

Slide 75

Slide 75 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 75

Slide 76

Slide 76 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 76

Slide 77

Slide 77 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 77

Slide 78

Slide 78 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 効果的なパスワードの管理毎年、膨大な数のパスワードが不正使用されています。ユーザーは、自身とビジネスを守る、これまで以上に簡単で安全なパスワード管理を必要としています。このセッションでは、プラットフォーム機能を最大限に活用して、組み込みまたはサードパーティ製のパスワードマネージャーを適切に扱う方法を説明します。また、チームでテクノロジーの優先順位を付けるのに役立つベストプラクティスと統計情報も示します。最後に Chrome の新しいツールと機能を紹介します。 78

Slide 79

Slide 79 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 79

Slide 80

Slide 80 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 80

Slide 81

Slide 81 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 81

Slide 82

Slide 82 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 82

Slide 83

Slide 83 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 Excalidraw と Fugu: コアユーザーナビゲーションの改善高度なテクノロジーは、それを理解していない人の目には魔法のように感じられます。ここでは、Excalidraw プログレッシブウェブアプリで使用される新しいウェブ API をいくつか紹介します。ご自身のアプリに応用できるアイデアを得られるよう、ユーザーエクスペリエンスを素晴らしいものにする要素を順を追って説明します。 83

Slide 84

Slide 84 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 84

Slide 85

Slide 85 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 85

Slide 86

Slide 86 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 86

Slide 87

Slide 87 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 87

Slide 88

Slide 88 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 88

Slide 89

Slide 89 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 89

Slide 90

Slide 90 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 この他のセッション 90

Slide 91

Slide 91 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 気になったセッション • 新しい Storage エミュレータを使用したローカル開発 • TensorFlow.js を使用した次世代ウェブアプリの機械学習 • バンドルサイズの縮小: ウェブ向けの新しい Firebase のプレビュー 91

Slide 92

Slide 92 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 まとめ 92

Slide 93

Slide 93 text

PAGE DAY 2017/11/01 # MOONGIFT / 12 Core Web Vitalsのビジネス化 • Webを収益源としている企業は取り組んだ方が良い • 高度なJavaScript APIはネイティブアプリと変わらない • 測定大事 • 髭格好良い 93

Slide 94

Slide 94 text

PAGE # MOONGIFT / 50 DAY 2019/02/14 👋 Thanks! @goofmint fb.me/goofmint ご感想お待ちします！