Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
その内容、テキストで書く?動画で説明する? 〜かんたん説明動画の作り方〜 / How to make videos easily
Search
jumpei_ikegami
October 13, 2022
Technology
1
710
その内容、テキストで書く?動画で説明する? 〜かんたん説明動画の作り方〜 / How to make videos easily
https://line.connpass.com/event/261765/
jumpei_ikegami
October 13, 2022
Tweet
Share
More Decks by jumpei_ikegami
See All by jumpei_ikegami
20230823_PLAIDのCustomer Engineerチームが拡大したので整えた話
jumtech
0
140
テストデータ作成をGASとスプレッドシートで自動化する / Automate test data creation with GAS and spreadsheets
jumtech
0
37
DXの本質と、「開発しないエンジニア」のキャリアパス / What is Product Specialist?
jumtech
13
36k
コードを書かないエンジニアリング / "No-Code" Engineering
jumtech
1
1.2k
Granular Permissionsで実現する、もっとsecureなBtoB Slack App開発 / Develop more secure BtoB Slack Apps with Granular Permissions
jumtech
0
21k
色んな「越境」を支援したい
jumtech
0
730
エンジニア×〇〇 ~職種を「越境」して希少性を出すキャリア~
jumtech
11
13k
メーカー系SIerと内製主義の功罪
jumtech
1
630
開発せずともプロダクトの価値を高める!"Product Specialist Engineer"という職種が生まれた理由
jumtech
0
430
Other Decks in Technology
See All in Technology
明日から始める持続可能なドキュメンテーション戦略 / Sustainable Documentation Strategies: Documentation as a Product
akitok_
9
4.6k
リーグオブ情シス登壇資料_議事録AIの導入について
hirotomotaguchi
3
250
ハイスコアから紐解くチームの自動テスト運用
chiharut
0
510
Boosting Hotel Profits: The Power of Enhanced Cancellation Predictions
recruitengineers
PRO
3
570
【Λ(らむだ)】DXの旅のしおり~出発はPower Automate for desktop / kimamani study group20240706
lambda
0
150
Many ways to be a Python contributor
pauloxnet
1
110
Go言語で行うメール解析
keyl0ve
0
270
microCMSの開発組織 - Deep dive into microCMS
microcms
1
470
CDKアプリとしてのAmplify Gen2 - @aws-amplify/backendのアーキテクチャにみるCDKベストプラクティス -
fossamagna
0
860
マルチクラスタの認知負荷に立ち向かう! Ubieのプラットフォームエンジニアリング
teru0x1
2
350
大規模言語データの前処理とLLM-as-a-Judge の活用
yyo616
4
630
GuardDutyを可視化して、君もGuardDutyマスターになろう!
cmusudakeisuke
1
710
Featured
See All Featured
Side Projects
sachag
451
41k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
248
20k
What’s in a name? Adding method to the madness
productmarketing
PRO
20
2.9k
10 Git Anti Patterns You Should be Aware of
lemiorhan
652
58k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
353
28k
Rails Girls Zürich Keynote
gr2m
91
13k
A Modern Web Designer's Workflow
chriscoyier
689
190k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
129
32k
[RailsConf 2023] Rails as a piece of cake
palkan
35
4.3k
Bootstrapping a Software Product
garrettdimon
PRO
302
110k
Building Your Own Lightsaber
phodgson
101
5.8k
Design by the Numbers
sachag
277
18k
Transcript
その内容、テキストで書く?動画で説明する? 〜かんたん説明動画の作り方〜 2022/10/13 LINE Technical Writing Meetup vol.17 @jumpei_ikegami
本日のおしながき • 自己紹介 • 説明動画の流行 • がんばらない動画制作ノウハウ • 動画の使い所と注意点
自己紹介 gami (@jumpei_ikegami) • 経歴 ◦ 2016〜: PLAID ▪ Customer
Engineer ◦ 2015〜: 富士通 ▪ 行政系SE • 個人活動 ◦ YouTuber、noteマガジン連載、Udemy講師 ◦ [主催] Customer系エンジニア座談会 (毎月開催!) ◦ [執筆]『完全SIer脱出マニュアル』 ◦ [登壇] Developers Summit 2021 Summerなど色々 ◦ [Podcast] しがないラジオ パーソナリティ(休止中)
自己紹介
Customer Engineerとしてやっていること • ミッション ◦ 「プロダクトと顧客のギャップを埋めることでプロダクトの価値を最大化する」 • 関わるプロダクト ◦ KARTE
• 主な業務 ◦ サポート問い合わせの調査 ◦ 顧客へのプロダクト利用設計、仕様説明、デモ ◦ テンプレート実装、プロダクト改善 FB ◦ 社員のTechnical Enablement支援 ◦ サポートサイトやDeveloper Portalのドキュメント執筆 ◦ Academyコース(学習コンテンツ) の作成
KARTEとは? • BtoB SaaSプロダクト • 主に、WebサイトやNativeApp向けに下記を提供 ◦ リアルタイムユーザー解析基盤 ◦ アクション配信基盤
• 要は、大量のユーザー行動データをリアルタイムに解析し、ルールベースで適切なアクションを配信するプ ラットフォーム • 利用企業の業界も利用者の職種も様々 ◦ Webマーケターなど非エンジニア職種の利用者 が多い
None
None
None
None
Customer Engineerとしてやっていること
Customer Engineerとしてやっていること
Customer Engineerとしてやっていること
「説明動画」制作の実績 • 累計約200本! • 趣味 ◦ YouTube: Webやデジタル関連知識の解説動画 ▪ 51本(字幕あり)
◦ Udemy: 非エンジニア向けの JavaScript入門 ▪ 63本(字幕あり) • 仕事 ◦ KARTE Academy: プロダクトや周辺技術の解説動画 ▪ 95本(字幕なし、テキスト併記)
本日のおしながき • 自己紹介 • 説明動画の流行 • がんばらない動画制作ノウハウ • 動画の使い所と注意点
説明動画が充実しているサービスの例 • 最近、動画によるオンボーディング に力を入れているサービスが増えている • エンジニア向けサービスより、 NoCodeツールなど非エンジニアもターゲットに含むサービス の方が多い印 象 •
ドキュメントやリファレンスとは別に 学習コンテンツをまとめているケースで、動画が活用されることが多い 印象
説明動画が充実しているサービスの例 • Webflow
説明動画が充実しているサービスの例 • Shopify
説明動画が充実しているサービスの例 • Bubble
動画制作・管理系のBtoB SaaSが増えている • これまで動画の制作や管理は多くのコストがかかり 、利用にはハードルがあった • サポートや社内コミュニケーションに動画を取り入れる企業が登場する中で、それを 簡単にするためのツー ルやSaaSも続々と登場している
動画制作・管理系のBtoB SaaSが増えている • Loom ◦ “Async Video Messaging for Work”
動画制作・管理系のBtoB SaaSが増えている • Quden ◦ “話し手と画面を組み合わせた動画で顧客対応・リモートワークをなめらかに ”
動画制作・管理系のBtoB SaaSが増えている • VideoTouch ◦ “動画トレーニングプラットフォーム ”
動画制作・管理系のBtoB SaaSが増えている • Vrew ◦ まるでテキストを編集するように、動画のカットと字幕編集ができる
動画制作を頑張りすぎてはいけない • いわゆるYouTuberの動画編集などを見ていると、その リッチな動画編集にあこがれる • しかし、10万人に見られるエンタメ動画と 500人にしか見られないプロダクトの説明動画では、 投入してい いリソース量も力を入れるべき場所も全く違う
本日のおしながき • 自己紹介 • 説明動画の流行 • がんばらない動画制作ノウハウ • 動画の使い所と注意点
動画制作を頑張りすぎてはいけない • 特にプロダクトのサポート領域 で動画制作を始めるなら、できるだけコストを抑えハードルを下げないと続 かない • 良くない例 ◦ いきなりAdobe Premiere
Proを使う ◦ いきなり良いカメラやデカい照明やグリーンバックなどの 高くて大きい機材を買う ◦ いきなり動画編集を 外注する
がんばらない動画制作ノウハウ • gamiが200本の動画制作の中で行き着いた「がんばらない動画制作」の方法( 2022年10月現在) • 用意するもの ◦ カメラ付きノートパソコン ▪ Macbookなど。カメラはWebカメラでも可
◦ 外付けマイク ▪ インカム付きヘッドホンとかでも良い ◦ QudenのChrome拡張機能 ▪ フリープランで10分の動画まで撮影できる ◦ Vrewのデスクトップアプリ ▪ なんと現在は無料
動画制作の手順 • QudenのChrome拡張機能で、自分の顔とPC画面の映像+声を同時に収録する
動画制作の手順 • 動画ファイルをダウンロードして、 Vrewに読み込ませる
動画制作の手順 • Vrewで不要な部分をカットする
動画制作の手順 • 字幕を付ける場合は、 Vrewの自動生成字幕を修正する
動画制作の手順 • Vrewから動画ファイルを出力して、完成! ◦ YouTubeなどで字幕を別にアップロードする場合は、動画への字幕表示を OFFにした上で、字幕 ファイルだけを別途出力できる
本日のおしながき • 自己紹介 • 説明動画の流行 • がんばらない動画制作ノウハウ • 動画の使い所と注意点
テキストと動画の使い分け • 一言でいうと? ◦ 「基本はテキストで書き、ここぞというときだけ動画を使う!」
テキストと動画の使い分け • 動画の強み ◦ 動きのある画面操作 をそのまま伝えられる ◦ 人感が出るので印象に残しやすい • 動画の弱み
◦ 実際に見ないと全体感がわからず自分に合った内容か判断できない ◦ とにかくメンテナンスコストが高い
テキストと動画の使い分け • 動画が向いているもの ◦ プロダクトを全く知らない人向けの デモ ◦ 顧客オンボーディング時の概要説明 ◦ 初学者向けの学習コンテンツ
• テキストが向いているもの ◦ リファレンス ◦ (慣れた人向けの)ドキュメント ◦ 用語集 ◦ FAQ
gamiが過去に仕事で作った動画の例 • プロダクトの新機能プレスリリースに添付する デモ動画
gamiが過去に仕事で作った動画の例 • KARTEの顧客向けオンボーディングのためのシステム全体像説明
gamiが過去に仕事で作った動画の例 • 社内外向け学習コンテンツ「KARTEで学ぶSQL入門」
動画の弱点を克服するために • 見ないと全体感がわからない。。。 ◦ → 視聴維持率を意識する ▪ オープニングとか入れず、 いきなり話し始める ▪
最初に内容の全体感を示す ▪ なるべく短く簡潔に、できれば 1本の動画を5分程度におさめる
動画の弱点を克服するために • メンテナンスコストが高い。。。 ◦ → 保守性に配慮する ▪ 頻繁に変更されそうな機能や画面 はなるべく扱わない ▪
とにかく1本の動画を短く、差し替えやすく
まとめ
3行で言うと • ツールの発展により動画制作がかなり簡単になった • テキストと動画を使い分けることで、よりユーザーにわかりやすいコンテンツが作れる • みなさんも「動画で説明する」という手札 を持ってみてはいかが?
Thank you !