WisdomMingle.com（ウィズダムミングル・ドットコム）

WisdomMingle.com（ウィズダムミングル・ドットコム）

「スマホ」タグの記事一覧

生中継ライブウェビナーを無料で実施できる「ハングアウト オンエア」

By Yukinobu Kurata (倉田幸暢)

どうも、倉田です。
Google+の「ハングアウトオンエア」という機能をつかえば、
視聴者数の上限はなく、無料で、生放送のウェビナーを実施することができます。
（注： ウェビナー = ウェブセミナー）
（ただ、ウェビナー内の会話に参加できるのは10人までです。）
ハングアウトオンエアをつかえば、
iPhoneなどのスマートフォンでも、
このウェビナーを見ることができます。
ここでは、
海外マーケッターたちが、ハングアウトオンエアをつかって
生中継のライブウェビナーをおこなっている実例や、
有名人がハングアウトオンエアをつかって
生放送をおこなっている実例を紹介します。

続きを読む →

HTML5と「ゲーム性」がすべてを変える： ブラウザゲームに学ぶ「インタラクティブ性」と「エンターテイメント性」

By Yukinobu Kurata (倉田幸暢)

 

遊びをせんとや生（うま）れけむ
戲（たはぶ）れせんとや生（むま）れけん
遊ぶ子供の声聞きけば
我が身さへこそ動(ゆる)がるれ

――― 「四句神歌」、『梁塵秘抄』 (*1) (*2)

「遊ぶものは神である。
　
　神のみが、遊ぶことができた。
　
　遊は絶対の自由と、
　ゆたかな創造の世界である。
　
　それは神の世界に外ならない。
　
　この神の世界にかかわるとき、
　人もともに遊ぶことができた。」

――― 白川静、『文字逍遥』 (*3)

「石油は人間の頭のなかで見つかる」

――― ダニエル・ヤーギン、『探求』 (*4)

 
ここでは、下の動画のような、HTML5をつかったブラウザゲームをいくつか紹介しながら、「遊び」、「学び」、「集客・販売」の未来についてお話していきます。

続きを読む →

  1. （「遊びをせんとや生（うま）れけむ
    　　戲（たはぶ）れせんとや生（むま）れけん
    　　遊ぶ子供の声聞きけば
    　　我が身さへこそゆるがるれ」
    、編集：西郷信綱、『梁塵秘抄』、ちくま学芸文庫、筑摩書房、2004年、19ページ）[↩ Back]
  2. （「遊びをせんとや生（うま）れけむ、戲(たはぶ)れせんとや生(むま)れけん、遊ぶ子供の聲(こえ)きけば、我が身さへこそ動(ゆる)がるれ。」、校訂：佐佐木信綱、三五九（359）、「雜八十六首」（雑八十六首）、「四句神哥　百七十首」（四句神歌）（しくかみうた）、「梁塵祕抄 卷第二」（梁塵秘抄 巻第二）、『新訂 梁塵秘抄』、岩波文庫 黄 22-1、岩波書店、1941年、66ページ）[↩ Back]
  3. （白川静、「遊字論」、『文字逍遥』、平凡社ライブラリー、平凡社、1994年、10ページ）[↩ Back]
  4. （ダニエル・ヤーギン（Daniel Yergin）、（訳 伏見威蕃）、「結論−"偉大な革命"」、『探求――エネルギーの世紀(下)』、2012年、433ページ）[↩ Back]

YouTube動画の21のパラメータまとめ+αと埋め込みコードの実例

By Yukinobu Kurata (倉田幸暢)

ここでは、YouTube動画の埋め込みプレーヤーの見た目や機能をカスタマイズするための
「パラメータ」という機能の使い方についてお話します。
また、YouTubeの埋め込み動画プレーヤーをつかうときに前提となる、<iframe>タグや、<object>タグ、HTML5形式の動画プレーヤー、Flash形式の動画プレーヤーなどの情報についてもお話します。
さらに、JavaScriptやActionScriptをつかって動画プレーヤーを自由に制御することができるAPIについてもお話します。

「パラメータ」をつかうと、どんなことができるの？

まず、「パラメータ」をつかってどんなことができるのかを知るために、下の実例を見てください。

実例１： 自動的に再生が始まり、巻き戻しや、早送りはできない

下の動画は、「パラメータ」をつかってつぎのような設定にしています。
これによって、自動的に再生が始まり、操作は一時停止しかできないため、巻き戻しや、早送りはできません。

（下の動画は、音声無しの動画にしています。これは、この動画は自動的に再生されるように設定しているため、このページを読み込んだときに自動的に音が出ると不都合なことがあるかもしれないということを考慮してのことです。）

この動画の埋め込みコード

<iframe width="560" height="315" src="https://www.youtube.com/embed/OW37a07RMTs?controls=0&showinfo=0&autoplay=1&rel=0" frameborder="0" allowfullscreen></iframe>

▲ もくじへもどる

（ YouTubeマスターになっちゃうぜ学園： カリキュラム一覧表 ）

実例２： コントロールバーを非表示にする

下の動画は、「パラメータ」をつかってつぎのような設定にしています。

この動画の埋め込みコード

<iframe width="560" height="315" src="https://www.youtube.com/embed/Xye1sEOG0CA?rel=0&modestbranding=0&showinfo=0&fs=0&controls=0" frameborder="0" allowfullscreen></iframe>

▲ もくじへもどる

（ YouTubeマスターになっちゃうぜ学園： カリキュラム一覧表 ）

実例３： 複数の動画を連続して再生させ、それを繰り返す

下の動画は、「パラメータ」をつかってつぎのような設定にしています。

この動画の埋め込みコード

<iframe width="560" height="315" src="https://www.youtube.com/embed/Xye1sEOG0CA?playlist=ZMdkZeCzj44,tQroTplYWqg&loop=1" frameborder="0" allowfullscreen></iframe>

▲ もくじへもどる

（ YouTubeマスターになっちゃうぜ学園： カリキュラム一覧表 ）

実例４： 一部分だけを再生する

下の動画は、「パラメータ」をつかってつぎのような設定にしています。

この動画の埋め込みコード

<iframe width="560" height="315" src="https://www.youtube.com/embed/Xye1sEOG0CA?start=114&end=151" frameborder="0" allowfullscreen></iframe>

これ以降では、まず、YouTubeの埋め込み動画プレーヤーをつかううえでの基本となる、<iframe>タグや、<object>タグ、HTML5形式の動画プレーヤー、Flash形式の動画プレーヤー、クロムレスプレーヤーなどの情報についてお話します。
各種の「パラメータ」についての説明は、それらの基本情報のあとに掲載しています。
もし、「すぐにパラメータの情報が知りたい」という場合や、「基本はすでに知っているという場合」には、それらの基本情報の話を飛ばして、「パラメータ」について話しているところから見ていってください。

▲ もくじへもどる

（ YouTubeマスターになっちゃうぜ学園： カリキュラム一覧表 ）

目次
  1. 「パラメータ」をつかうと、どんなことができるの？
    1. 実例１： 自動的に再生が始まり、巻き戻しや、早送りはできない
    2. 実例２： コントロールバーを非表示にする
    3. 実例３： 複数の動画を連続して再生させ、それを繰り返す
    4. 実例４： 一部分だけを再生する
  2. 埋め込みコードのHTMLタグの２つの種類 - <iframe>タグと<object>タグ
    1. HTML5形式の埋め込み動画プレーヤー
    2. （非推奨）Flash形式の埋め込み動画プレーヤー - 「Flash（AS3）プレーヤー」
    3. <iframe>タグ（HTML5形式 & Flash形式）
      1. <iframe>タグ（HTML5形式の動画プレーヤーの場合）
      2. （非推奨）<iframe>タグ（Flash形式の動画プレーヤー（「Flash（AS3）プレーヤー」）の場合）
    4. （非推奨）<object>タグ（Flash形式の動画プレーヤー（「Flash（AS3）プレーヤー」））
  3. 「パラメータ」の使い方
  4. 再生後に表示される「関連動画」を非表示にする - 「rel」（リレイテッドビデオ）
    1. 「rel=0」（「関連動画」を非表示にする）
    2. 「rel=1」（「関連動画」を表示する）
  5. コントロールバーのYouTubeロゴを非表示にする - 「modestbranding」（モデストブランディング）
    1. 「modestbranding=1」（コントロールバーのYouTubeロゴを非表示にする）
    2. 「modestbranding=0」（コントロールバーのYouTubeロゴを表示する）
  6. 自動的に再生を始める - 「autoplay」（オートプレイ）
  7. 繰り返し再生させる - 「loop」（ループ）
    1. 通常の動画プレーヤーで「loop」をつかう場合
    2. 「再生リスト」の動画プレーヤーで「loop」をつかう場合
      1. HTML5形式（<iframe>タグ）の「再生リスト」の動画プレーヤーで「loop」をつかう場合
      2. （非推奨）Flash形式（<object>タグ）の「再生リスト」の動画プレーヤーで「loop」をつかう場合
  8. コントロールバーを非表示にする/表示する - 「controls」（コントロールズ）
    1. 「controls=0」（コントロールバーを非表示にする）
    2. （非推奨）「controls=1」（コントロールバーを表示する）（「Flash（AS3）プレーヤー」形式）
    3. （非推奨）「controls=2」（コントロールバーを表示する & パフォーマンス向上）（「Flash（AS3）プレーヤー」形式）
  9. 全画面表示ボタンを非表示にする - 「fs」（フルスクリーン）
    1. 「fs」をHTML5形式の動画プレーヤーでつかう
      1. 「fs=0」（全画面表示ボタンを非表示にする）（HTML5形式の動画プレーヤーの場合）
      2. 「fs=0」（全画面表示ボタンを非表示にする & 全画面表示ができないようにする）（HTML5形式の動画プレーヤーの場合）
    2. （非推奨）「fs=0」（全画面表示ボタンを非表示にする）（「Flash（AS3）プレーヤー」）の場合）
    3. （非推奨）「fs=1」（全画面表示ボタンを表示する）（「Flash（AS3）プレーヤー」）の場合）
  10. iOS 上で動画をインライン表示で再生させる - 「playsinline」（プレイズインライン）
    1. 「playsinline=1」（iOS 上で動画を、インライン表示で再生させる）
    2. 「playsinline=0」（iOS 上で動画を、全画面表示で再生させる）
  11. タイトルバーを非表示にする - 「showinfo」（ショウインフォ）
    1. 「showinfo=0」（タイトルバーを非表示にする）
    2. 「showinfo=1」（「再生リスト」のサムネイルを表示させる）（「再生リスト」の動画プレーヤーの場合）
    3. （参考）（非推奨）「showinfo」を明示的に設定しない場合（「再生リスト」のサムネイルを表示しない）（「再生リスト」の動画プレーヤーの場合）
  12. 再生を開始する位置を指定する – 「start」（スタート）
  13. 再生を終了する位置を指定する – 「end」（エンド）
  14. 「再生リスト」、公開動画リスト、動画検索結果リストを動画プレーヤーとして埋め込む - 「listType」（リストタイプ）&「list」（リスト）
    1. HTML5形式の動画プレーヤー（<iframe>タグ）をつかった「再生リスト」の動画プレーヤー
    2. （非推奨）Flash形式の動画プレーヤー（<object>タグ）をつかった「再生リスト」の動画プレーヤー
      1. （参考）「showinfo=1」に設定した場合（「再生リスト」のサムネイルを表示させる）
    3. 特定のユーザーの公開動画のリスト（「アップロード動画」）を動画プレーヤーとして埋め込む
    4. YouTube動画検索の検索結果の動画のリストを動画プレーヤーとして埋め込む
  15. 複数の動画から「再生リスト」をつくって動画プレーヤーとして埋め込む - 「playlist」（プレイリスト）
    1. 「playlist」をつかった「再生リスト」の動画プレーヤー（HTML5形式）
    2. （非推奨）「playlist」をつかった「再生リスト」の動画プレーヤー（「Flash（AS3）プレーヤー」形式）、「showinfo=1」に設定した場合（「再生リスト」のサムネイルを表示させる）
  16. 「進行状況バー」（プログレスバー、シークバー）の色を変える - 「color」（カラー）
    1. 「color=white」： 「進行状況バー」（プログレスバー、シークバー）白色
    2. 「color=red」： 「進行状況バー」（プログレスバー、シークバー）赤色
  17. 「アノテーション」を非表示にする/表示する – 「iv_load_policy」（ivロードポリシー）
    1. 「iv_load_policy=1」（「アノテーション」表示）
    2. 「iv_load_policy=3」（「アノテーション」非表示）
  18. キーボードからの操作を無効にする – 「disablekb」（ディスエイブルキーボード）
    1. 「disablekb=1」（キーボード操作無効）（HTML5形式の動画プレーヤーの場合）
    2. 「disablekb=0」（キーボード操作有効）（HTML5形式の動画プレーヤーの場合）
    3. （非推奨）「disablekb=1」（キーボード操作無効）（「Flash（AS3）プレーヤー」形式）
    4. （非推奨）「disablekb=0」（キーボード操作有効）（「Flash（AS3）プレーヤー」形式）
  19. 字幕を表示させる – 「cc_load_policy」（クローズドキャプションポリシー）
    1. 「cc_load_policy=1」（字幕を表示）（HTML5形式の動画プレーヤーの場合）
    2. 「cc_load_policy」のパラメータを設定していない場合（HTML5形式の動画プレーヤーの場合）
    3. （非推奨）「cc_load_policy=1」（字幕を表示）（「Flash（AS3）プレーヤー」形式）
    4. （非推奨）「cc_load_policy」のパラメータを設定していない場合（「Flash（AS3）プレーヤー」形式）
  20. 「JavaScriptプレーヤーAPI」関連のパラメータ – 「enablejsapi」（イネイブル JS API）&「playerapiid」（プレーヤーAPI ID）&「origin」（オリジン）
    1. 「enablejsapi」（イネイブル JS API）
    2. 「playerapiid」（プレーヤーAPI ID）
    3. 「origin」（オリジン）
  21. 動画プレーヤーのユーザーインターフェース上に表示される言葉の言語を指定する - 「hl」（ホストランゲージ）
    1. 「hl=en」（ツールチップの文字の言語を、英語にする）
    2. 「hl=zh」（ツールチップの文字の言語を、中国語にする）
    3. 「hl=es」（ツールチップの文字の言語を、スペイン語にする）
  22. （参考）全画面表示ができないようにする - 「allowfullscreen」（アラウフルスクリーン）
    1. 「allowfullscreen」無し（全画面表示ができないようにする）
    2. 「allowfullscreen」有り（全画面表示ができるようにする）
  23. （参考）周囲に枠線をつける - 「frameborder」（フレームボーダー）
    1. 「frameborder="1"」（周囲に枠線をつける）
    2. 「frameborder="0"」（周囲に枠線をつけない）
  24. （廃止）コントロールバーと「進行状況バー」（プログレスバー、シークバー）を隠す/常に表示させる - 「autohide」（オートハイド）
    1. （廃止）「autohide=1」（コントロールバーと「進行状況バー」（プログレスバー、シークバー）が隠れる）
    2. （廃止）「autohide=0」（コントロールバーと「進行状況バー」（プログレスバー、シークバー）を表示させ続ける）
    3. （廃止）「autohide=2」（「進行状況バー」（プログレスバー、シークバー）が目立たないようになる）
  25. （廃止）最初から高画質/低画質で再生する - 「vq」（ビデオクオリティー）
    1. （廃止）「vq=hd1080」: 画質1080p（HD画質（高精細度））
    2. （廃止）「vq=hd720」: 画質720p（HD画質（高精細度））
    3. （廃止）「vq=large」: 画質480p
    4. （廃止）「vq=medium」: 画質360p
    5. （廃止）「vq=small」: 画質240p
  26. （参考）非推奨（廃止予定）のパラメータ（「Flash（AS2）プレーヤーAPI」限定）
  27. 動画プレーヤーを制御するための３つのAPI
    1. 「IFrameプレーヤーAPI」
    2. 「JavaScriptプレーヤーAPI」
    3. （非推奨）「Flash（AS3）プレーヤーAPI」
  28. 参考サイト、YouTube公式ヘルプページ
    1. 「YouTube埋め込み動画プレーヤーのパラメータ」関連
    2. 「YouTubeプレーヤーAPI」関連
      1. 「IFrameプレーヤーAPI」のリファレンス
      2. （非推奨）「Flash(AS3)プレーヤーAPI」のリファレンス
      3. 「JavaScriptプレーヤーAPI」のリファレンス
    3. YouTube埋め込み動画プレーヤーの作成ツール/デモ
    4. その他
  29. おもしろい組み合わせ方を思いついたら、ぜひ教えてください
    1. YouTube APIについての関連記事
    2. YouTubeのうまい使い方についての関連記事

続きを読む →

メルマガ登録
いろんな分野のごちゃまぜメルマガ
PR