Upgrade to Pro — share decks privately, control downloads, hide ads and more …

PWAとプロダクトマネジメント

 PWAとプロダクトマネジメント

プロダクトマネジメントの観点から、PWAのメリットと課題を語ります。

開発の観点から語られることの多いPWAですが、実際にはユーザー価値やビジネス価値にも深く関わるソリューションです。
本講演では、開発者向けオンラインコミュニティサービス「TechFeed」の最新リニューアル事例を通じて、プロダクトマネジメントや開発の現場にPWAがどう影響を与えてきたかを、実際の事例を交えてご紹介します。

1fc0835c5d3f3a0ef77181def15f604c?s=128

Shumpei Shiraishi

June 28, 2021
Tweet

Transcript

  1. CONFIDENTIAL PWA Night Conference 2021 株式会社テックフィード 代表取締役CEO 白石俊平 1 TechFeedリニューアルの裏側から学ぶ

    PWAとプロダクトマネジメント
  2. CONFIDENTIAL 2 白石を表す3つのキーワード: 1. エンジニア…Google/Microsoft公認エキスパートを歴 任、著書多数 2. コミュニティ…7,000名超のエンジニアコミュニティ 「html5j」を指揮、200回以上のイベントを企画。スポンサー 企業はのべ200社以上。

    3. スタートアップ…株式会社テックフィード代表取締役 CEO、TechFeedプロダクトマネージャー/UXデザイ ナー 白石 俊平 株式会社テックフィード代表取締役CEO
  3. CONFIDENTIAL 3 本日は、TechFeed=PWAを題材に、
 PWAとプロダクトマネジメント
 のお話をします。


  4. CONFIDENTIAL 4 海外情報がスイスイ読める! 世界中から技術情報が集まる。人と、企業とつながる。 エンジニアがエンジニアのために作った。エンジニア特化型オンラインコミュニティ サービス。 TechFeed https://techfeed.io

  5. CONFIDENTIAL TechFeedは、 1万7千人以上のエンジニアが使用するオンラインコミュニティです( 2021/6時点) コミュニティ 開始日 運営期間 (2021/02時点) 人数 TechFeed

    2020/07 1年3ヶ月 17,832人 コミュニティA 2008/09 約12年 20,606人 コミュニティB 2010/02 約10年 3,450人 コミュニティC 2009/07 約11年 6,639人 日本最大級のエンジニアコミュニティとの比較 日本で今一番ホットなエンジニアコミュニティ。
 5
  6. CONFIDENTIAL 6 TechFeedは、上から下までweb技術
 バックエンド Node/TypeScript NestJS TypeORM Express… フロントエンド TypeScript

    Angular Ionic Cordova ... ... デスクトップ モバイルアプリ/ PWA
  7. CONFIDENTIAL 7 PWAとプロダクトマネジメント
 PWA / web技術は
 2020年代のRuby on Railsになれる!


  8. CONFIDENTIAL 8 PWA / web技術は
 2020年代のRuby on Railsになれる!
 • とにかくラピッドに開発できる


    • ユーザー価値の作り込みに集中できる
 • 開発者も多い

  9. CONFIDENTIAL 9 TechFeedのリニューアル頻度
 Product Market Fit (PMF) 目指してピボットスパイラル中
 2020年 TechFeed

    Pro クローズドβ リリース 1月 TechFeed Pro 正式リリース 3月 ストーリーズ 9月 ソーシャル化 12月 ヘッドライン 3月 海外情報読む ならテックフィー ド! 6月 2021年
  10. CONFIDENTIAL 10 TechFeedのリニューアル頻度
 Product Market Fit (PMF) 目指してピボットスパイラル中
 2020年 TechFeed

    Pro クローズドβ リリース 1月 TechFeed Pro 正式リリース 3月 ストーリーズ 9月 ソーシャル化 12月 ヘッドライン 3月 海外情報読む ならテックフィー ド! 6月 2021年 これほどの頻度でリニューアルでき るのは、上から下までweb技術で開 発しているから
  11. CONFIDENTIAL 11 TechFeedのリニューアル頻度
 Product Market Fit (PMF) 目指してピボットスパイラル中
 2020年 TechFeed

    Pro クローズドβ リリース 1月 TechFeed Pro 正式リリース 3月 ストーリーズ 9月 ソーシャル化 12月 ヘッドライン 3月 海外情報読む ならテックフィー ド! 6月 2021年 最新リニューアルを通じ て、PWAとPdMを語る これほどの頻度でリニューアルでき るのは、上から下までweb技術で開 発しているから
  12. CONFIDENTIAL 12 6/24 リニューアルの概要
 海外のテック情報をスイスイ読める!
 
 TechFeedが海外情報に特化した機能を多数 搭載して大幅リニューアル。
 
 「海外情報の約97%は日本で知られず終わっ

    ている」という状況の改善を目指す

  13. CONFIDENTIAL 13 プロダクトマネジメント・トライアングル
 • 開発
 • ユーザー
 • ビジネス
 これらをうまくバランスさせるのが

    プロダクトマネージャーの役割

  14. CONFIDENTIAL 14 リニューアルのプロダクトマネジメント
 各ステークホルダーとの対話を順に重ねて進めていく
 1. ビジネス設計 2. UX/UIデザイン 3. 開発

    Business User Development
  15. CONFIDENTIAL 15 1. ビジネス設計
 1. ユーザーをもっと増やしたい
 a. ユーザーとは誰か?→エンジニア の皆様
 2.

    エンジニアの皆様にさらなる価値を 提供するには?
 a. 私たちの提供する価値とは?
 b. →エンジニアの皆様に、最高の情 報をお届けすること
 3. エンジニアにとっての最高の情報 源とは…?

  16. CONFIDENTIAL 16 なぜTechFeedが必要か
 日本で読まれていない、良質な英語記事がたくさんある
 TechFeedに集まっている英語記事200件を調査 
 
 • 読むに値する(※)記事: 111件


    • うち、日本で紹介されていた記事: 
 3件(2.7%)
 
 良質な英語記事の約97%は日本でコンテンツ化され ていない。
 
 ※調査員の主観により判断 
 良質、かつ日本でコ ンテンツ化されてい ない
  17. CONFIDENTIAL 17 なぜTechFeedが必要か
 英語のほうが、しっかりした読み物が多い
 エンジニア向けのコンテンツに絞って、読み物 /ニュース/TIPSに分類。
 
 日本語では、TIPSが50%を占め、読み応えのあ る読み物は31.8%に留まる。
 一方英語では読み物が56%を占める。


    
 英語のほうが、しっかりした読み物が多い。

  18. CONFIDENTIAL 18 なぜTechFeedが必要か
 日本人は英語をほとんど読まない
 TechFeedでは従来より、自動翻訳やエキス パートのコメントなど、「英語記事を読む」環境 は整えているものの、英語記事のクリック率は 日本語記事の約1/5に留まる
 日本語記事クリック率 英語記事クリック率

    6.2% 1.4%
  19. CONFIDENTIAL 海外には良質な情報が溢れている。
 が、それらを得るにも、得た情報を広めるにも、ハードルがあった。
 19 TechFeedで世界をこう変えたい
 海外情報 一部のエンジニア 日本のユーザー テックメディア

  20. CONFIDENTIAL 1. 「良質な海外情報を日本に紹介する」ことに特化したサービスと、それを行う人々のコミュニティを作る 
 2. 日本のエンジニアリングスキルの底上げ 
 3. 「日本を世界一のIT国家にする」(TechFeedのミッション) 


    20 TechFeedで世界をこう変えたい
 海外情報 日本のユーザー TechFeed コミュニティ エキスパート / インフルエンサー
  21. CONFIDENTIAL 21 PWAとビジネス設計
 ビジネス的な方針として、「良質な海外情報をユーザーに届ける」こと は固まった。
 1. ビジネス設計 2. UX/UIデザイン 3.

    開発 Business User Development
  22. CONFIDENTIAL 22 PWAとUX/UIデザイン
 どうやってユーザーに価値を届けるか?
 1. ビジネス設計 2. UX/UIデザイン 3. 開発

    Business User Development
  23. CONFIDENTIAL 23 PWAとUX/UIデザイン
 仮説
 • ペルソナ
 • カスタマージャーニー
 • デザイン


    検証
 • ユーザーヒアリング
 • ユーザーテスト
 • モック

  24. CONFIDENTIAL 24 PWAとUX/UIデザイン
 仮説
 • ペルソナ
 • カスタマージャーニー
 • デザイン


    検証
 • ユーザーヒアリング
 • ユーザーテスト
 • Webブラウザ上で行えるのがとにかく楽! ◦ リモートでのユーザーテストも容易 • 仮説検証サイクルが速い! ◦ 「次のユーザーテストまで2時間」ってタイミン グでも修正してデプロイできる
  25. CONFIDENTIAL 25 PWAと開発
 デスクトップ/モバイル両方の大幅リニューアルを、エンジニア1名が3週間で達成
 1. ビジネス設計 2. UX/UIデザイン 3. 開発

    Business User Development
  26. CONFIDENTIAL 26 Before


  27. CONFIDENTIAL 27 After
 実際のアプリ画 面を御覧くださ い

  28. CONFIDENTIAL 28 PWAとプロダクトマネジメント(まとめ)
 プロダクトマネージャーとしての、体感的なコストで言うとこんな感じ
 1. ビジネス設計 2. UX/UIデザイン 3. 開発

    Business User Development 25% 50% 25% ユーザーの皆様のための価値を作り込むことに注力できた!
  29. CONFIDENTIAL 29 PWAとプロダクトマネジメント
 PWA / web技術は
 2020年代のRuby on Railsになれる!


  30. CONFIDENTIAL 30 PWA / web技術は
 2020年代のRuby on Railsになれる!
 • とにかくラピッドに開発できる


    • ユーザー価値の作り込みに集中できる
 • 開発者も多い

  31. CONFIDENTIAL 31 PWA / web技術は
 2020年代のRuby on Railsになれる!
 • とにかくラピッドに開発できる


    ◦ JavaScriptさえ知っていればフルスタックエンジニア(弊社では)
 ◦ webアプリの「デプロイすれば即更新」「レスポンシブ性能」強すぎる
 • ユーザー価値の作り込みに集中できる
 ◦ 開発の(マネジメント)コストが圧倒的に低い
 ◦ デフォルトでクロスプラットフォームなのも楽すぎる
 • 開発者も多い
 ◦ 採用コスト低

  32. CONFIDENTIAL 32 ご清聴ありがとうございました。
 海外情報をスイスイ読める!
 全く新しくなったTechFeedを、ご愛顧のほどよろしくお願いいたしま す。
 TechFeed https://techfeed.io