Tokage It Lab.s logo.

イントロダクション

動画でのチュートリアルというあり方について

正直、チュートリアルとしてはあまり適した形じゃないと個人的に思ってる。

  • そもそも動画である事が必要ない
  • メニューとか文字が潰れて見えない

こういうのは論外として、

  • 進行が一方的なので自分のペースで見づらい
  • 文字情報じゃないから翻訳やコピー&ペーストが難しい
  • 動画を視聴できる環境にないといけない

問題点をあげるとすればこの辺りかな。

単純にダメだって言うんじゃなくて、動画を含めたチュートリアルのフォーマットについては、考える余地があるかもねっていう話。


改善案

僕は、動画で見せる必要がある所だけ切り出して文章と対にする、というのが動画を含めたチュートリアルとしての一つの正解の形だと思ってるんだけど、切り出した分だけ動画をアップするというのは正直手間がかかる。そこで妥協点として考えたのが、

  • 上げる動画は1本にして、必要に応じて時間指定してやる
  • 動画とドキュメントが同時に見れる(これは必要か怪しい)
  • Markdown 記法を用いる

というフォーマット。ただし、 Markdown だとクラスの指定ができないから、そこは Markdown Extra を使った。これで YouTube Player API で生成された player の seekTo メソッドを特定のクラスを持つ要素から呼び出せるようになった。

Markdown での再生時間の指定と実際の動作は、

[備忘録ってスラング](1:27.2){.time}

備忘録ってスラング

こんな感じ。リンクの書式を用いているから、普通のリンクと見分けがつくように CSS で注釈を付け加えた。本当はパーサーも自分で書いて、書式から作った方がいいのかもしれないけど……。

スマートフォン及びタブレット端末については、ターゲットが違うと考えて気にしないことにする。


後書き

Hey guys!1 は Wikipedia や GitHub じゃないから、そういうのを求めてしまう僕が悪いのは分かってるんだけど、チュートリアルを講義に例えると、受講者が欲しいのはレジュメ(もしくは友達のノートのコピー)なんじゃないかなって思う。もちろん、実演が見たいという場合もあるけど。

まあ、延々と同じ昔話をする教授とかもいるし、レジュメさえあれば教授の顔は見なくていいみたいな講義もあるし、かといって、文章自動読み上げソフトになるのも嫌だし、パフォーマンスとチュートリアルは切り離して動画を見るのが正解なのかも。

とりあえず、ここでは試験的にこの形で運用していこう。まあ、そんな感じでよろしくね。

シルク・レニュー


  1. 海外の人が Youtube とかでのチュートリアルでよく使う挨拶、またはそういう動画