Twitter ウィジェットを使用すると、作成者と学習者との間でコンテキストに応じた共同作業を簡単に行うことができます。教室の環境をシミュレートすることができ、学習者は作成者や他の学習者にリアルタイムに質問をすることができます。

Twitter ウィジェットを含むプロジェクトをパブリッシュすると、学習者は Twitter にログオンすることなく、プロジェクト内から質問することができます。質問は、その質問が行われたプロジェクトの適切なコンテキストで、作成者と他の学習者に対して表示されます。

質問はパブリッシュされたプロジェクトからのみ行うことができますが、回答は次のいずれかの方法で行うことができます。

  • Web ブラウザーまたはモバイルデバイスからアクセスした Twitter を使用する

  • パブリッシュされた Adobe Captivate プロジェクト内で Twitter アイコンをクリックしたときに表示される「回答」ボタンを使用する

プロジェクトへの Twitter ウィジェットの追加

  1. Adobe Exchange から Twitter ウィジェットをダウンロードします。ダウンロードした .zip ファイルには、以下のファイルが含まれています。

    • twitterwidget.swf — Adobe Captivate プロジェクトに挿入できる Twitter ウィジェット。

    • Twitteroauth.zip — ユーザーが Twitter ウィジェットでプロジェクトにアクセスしようとしたときに、Adobe Captivate を認証するための OAuth 設定ファイル。

  2. Twitter ウィジェットを使用するための前提条件を満たしていることを確認します。詳しくは、前提条件を参照してください。

  3. 環境設定で一意の名前を指定してプロジェクトをセットアップします。詳しくは、プロジェクトのセットアップを参照してください。

  4. プロジェクトに Twitter ウィジェットを挿入します。詳しくは、プロジェクトへの Twitter ウィジェットの挿入を参照してください。

前提条件

  1. コンピューターに Web サーバーと PHP をインストールします。この 2 つを提供する WAMP(Windows 用)または MAMP(Mac OS 用)を使用することもできます。

    注意:

    コンピューターは、Adobe Captivate がインストールされているコンピューターまたはネットワーク上のその他のコンピューターを使用できます。

    WAMP は、http://www.wampserver.com/en/download.php からダウンロードすることができます。

    注意:

    この操作手順のうち、WAMP の Web サイトに示されている手順に従って続行するように記述されている最後の手順は無視してください。

    MAMP は、http://www.mamp.info/en/index.html からダウンロードすることができます。詳しい手順については、https://documentation-3.mamp.info/en/documentation/mamp-windows/ を参照してください。

  2. Windows コンピューターで、PHP および Web サーバーを設定します。詳しくは、PHP の設定および Web サーバーの設定を参照してください。MAMP ではデフォルトで必要なパラメーターが有効になっているので、Mac OS ではこの手順は不要です。

  3. OAuth を使用して Adobe Captivate の認証を設定します。OAuth による認証の設定を参照してください。

ユーザー(学習者)がこれらの前提条件を満たしている必要はありません。学習者に必要なものは、Twitter ウィジェットを含むプロジェクトにアクセスするための有効な Twitter アカウントだけです。

PHP の設定

Windows で、CURL ライブラリを有効にします。そのためには、システムトレイにある WAMPSERVER アイコンをクリックし、PHP/PHP extensions を選択し、php_curl をクリックします。

CURL が有効になっているかどうかを確認するために、Web ブラウザーで「」または「http://localhost:http://localhost:8080」と入力し、Tools セクションの phpinfo() をクリックします。このページで CURL を検索します。cURL support の行の値が enabled になっていることを確認します。

Web サーバーの設定

Windows で、rewrite モジュールを有効にします。そのためには、システムトレイにある WAMPSERVER アイコンをクリックし、Apache/Apache modules を選択し、rewrite_module をクリックします。

rewrite モジュールが有効になっているかどうかを確認するために、Web ブラウザーで「」または「http://localhost:http://localhost:8080」と入力し、Tools セクションの phpinfo() をクリックします。このページで rewrite を検索します。Loaded Modules の行(apache2handler テーブル)に mod_rewrite が表示されていることを確認します。

OAuth による認証の設定

  1. twitteroauth.zip ファイルを右クリック(Windows)または Control キーを押しながらクリック(Mac OS)し、「Extract」を選択します。内容が twitteroauth フォルダーに抽出されます。

    注意:

    twitteroauth.zip は、Adobe Exchange からダウンロードした TwitterWidget.zip フォルダーにあります。 

  2. twitteroauth フォルダーを Web サーバーのルートディレクトリに配置します。ルートディレクトリにアクセスするには、以下の手順を実行します。

    • (Windows の場合)システムトレイにある WAMPSERVER アイコンをクリックし、www ディレクトリをクリックするか、<WAMP インストールフォルダー>/wamp/www に移動します。

    • (Mac OS の場合)/Applications/MAMP/htdocs に移動します。

プロジェクトのセットアップ

  1. Twitter ウィジェットを挿入するプロジェクトを開きます。

  2. 編集/環境設定(Windows)または Adobe Captivate/環境設定(Mac OS)を選択します。

  3. 環境設定ダイアログボックスで、カテゴリリストから「プロジェクト」の「情報」をクリックします。

  4. 「プロジェクト名」フィールドにプロジェクトの名前を入力します。この名前はコースの Twitter でハッシュタグとして使用されるので、一意の名前を選択します。

プロジェクトへの Twitter ウィジェットの挿入

  1. Twitter ウィジェットを挿入する Adobe Captivate プロジェクトを開きます。

  2. フィルムストリップで最初のスライドをクリックします。

  3. 挿入/ウィジェットをクリックします。twitterwidget.swf をダウンロードする場所を参照し、「開く」をクリックします。ウィジェットのプロパティダイアログボックスが表示されます。

  4. 「ユーザー名」フィールドに、Twitter アカウントのユーザー名を入力します。このアカウントは、作成者のアカウントであると見なされます。

  5. 「PHP の場所」フィールドで、URL として、ルートディレクトリに配置した twitteroauth フォルダーの場所を次の形式で指定します。

    http://<Web サーバーの IP アドレス>/<twitteroauth フォルダーの場所>

    例えば、c:/wamp/www/Twitter/twitteroauth にフォルダーを配置した場合は、次のように PHP の場所を指定します。

    http://<Web サーバーの IP アドレス>/Twitter/twitteroauth

    Windows では、ポート番号 8080 を使用してサーバーのホームページにアクセスしている場合、PHP の場所でもポート番号を指定します。次の例を参考にしてください。

    http://<Web サーバーの IP アドレス>:8080/Twitter/twitteroauth

    Mac OS では、ポート番号 8888 を指定します。例えば、http://<Web サーバーの IP アドレス>:8888/Twitter/twitteroauth のように指定します。

  6. 「OK」をクリックします。これで、スライドに Twitter ウィジェットが表示されます。出力をパブリッシュすると、スライド上で表示されていた場所にウィジェットが表示されます。

  7. ウィジェットのプロパティインスペクターのタイミングパネルで、表示ドロップダウンリストの「残りのプロジェクト」をクリックします。

プロジェクトをプレビューまたはパブリッシュする前に、WAMP または MAMP サーバーのステータスが「Online」であることを確認します。

  • Windows では、システムトレイの WAMP サーバーアイコン上にマウスを移動します。ステータスにサーバーが「Offline」であると示された場合は、アイコンをクリックし、「Put Online」をクリックします。

  • Mac OS では、MAMP を起動します。スタートアップスクリーンで、Apache および PHP について赤いボタンが表示された場合は、隣のボタンをクリックしてオンラインにします。ボタンの色が緑になります。

Twitter ウィジェットを使用したプロジェクトの出力へのアクセス

作成者または学習者が、Twitter ウィジェットを含めてパブリッシュされたプロジェクトにアクセスしようとすると、OAuth の PIN 入力を求めるダイアログボックスが表示されます。

  1. 「生成」をクリックして PIN を生成します。

    既に Twitter にログインしている場合は、「許可」をクリックして同じアカウントの使用を継続します。別のアカウントでログインするには、「サインイン」をクリックします。

    まだ Twitter にログインしていない場合は、Twitter のユーザー名とパスワードの入力を求めるダイアログボックスが表示されます。

    正常にログインすると、デフォルトの Web ブラウザーで PIN 番号が表示されます。

注意:

ブラウザーウィンドウに PIN 番号が表示されない場合は、ブラウザーでポップアップを許可し、ページを最新の情報に更新してみてください。

2.  PIN 番号をコピーし、プロジェクトで表示されたダイアログボックスの OAuth PIN 番号フィールドにペーストします。

3.  「ログイン」をクリックします。

Twitter でのプロジェクトの検索

プロジェクトの名前を使用して、Twitter、TweetDeck または search.twitter.com でプロジェクトを検索します。プロジェクトで行われたすべてのツイート(質問と回答)が表示されます。ここで、回答または質問をツイートすることができます。

共同作業のワークフロー

作成者または学習者がプロジェクトの表示を開始する前にツイートされていた質問や回答は、会話スレッドとしてグループ化されます。作成者には、表示しているフレームに関係なく、現在のスライドに関するすべての会話スレッドが表示されます。一方、その他の学習者は、現在表示しているフレームまでに行われた会話のみを表示できます。

会話スレッドを表示するには、Twitter アイコンをクリックします。

作成者または学習者がプロジェクト出力を表示している間に行われたすべてのツイートが、直ちに表示されます。作成者には、スライドを既に表示したかどうかに関係なく、プロジェクトのすべてのスライドについて行われたツイートが通知されます。一方、その他の学習者の場合は、学習者がそのスライド(またはフレーム)に到達したときに表示できる会話リストにツイートが表示されます。

新しい質問または回答がツイートされると、スライドに 2 つ目の Twitter アイコンが表示されます。このアイコンは、すべてのツイートが表示されるとすぐに消えます。 

注意:

2 つ目の Twitter アイコンは、最初のアイコンとは翼の色が異なります。最初のアイコンでは鳥の翼の色は青ですが、2 つ目のアイコンでは黄色です。 

表示されたすべてのツイートは、スライドの会話リストに追加されます。

以下の手順では、作成者 Casey と学習者 Alex および Jaden の間で行われる共同作業ワークフローの概要を示します。

  1. Casey が Twitter ウィジェットを含む eラーニングコースを作成およびパブリッシュします。

  2. Alex がコースの表示を開始し、スライド 10(フレーム 2)にある表を右クリックし、質問を行います。

  3. Jaden も同時にコースを表示しています。

    • Jaden もスライド 10、フレーム 2 を表示しているか、既にこのスライドを表示した場合、Jaden のコンピューターでは追加の Twitter アイコンが表示されます。Jaden は、アイコンをクリックして質問を表示することも、回答をクリックして回答を提供することもできます。Jaden が質問を表示するとすぐに、追加のアイコンが消え、ツイート(質問と回答)が会話スレッドとして追加されます。

    • Jaden がまだスライド 10、フレーム 2 を表示していない場合、Alex からの質問は会話スレッドとして表示されます。Jaden は元の Twitter アイコンをクリックして質問を表示できます。

  4. Casey も同時にコースを表示しています。Casey がどのスライドまたはフレームを表示しているかに関係なく、Alex または Jaden が質問するとすぐに追加の Twitter アイコンが表示されます。

    • Casey は、ツイートをクリックしてそのコンテキスト(スライド 10、フレーム 2)に移動し、質問に回答することができます。

    • Casey は元の Twitter アイコンをクリックして古いツイートにアクセスできます。

ツイートのコンテキストの特定方法

以下の要素によって、質問のコンテキストが特定されます。

  • フレーム番号

  • 学習者が質問するためにクリックする、スライド上の場所

作成者または他の学習者がパブリッシュされたプロジェクトを表示している場合、会話のヘッダーまたは新しいツイートをクリックすると、コンテキスト(スライドおよびフレーム)が表示されます。

作成者または他の学習者が Twitter を使用してプロジェクト内のツイートを表示する場合、コンテキストは次のように指定されます。

フレーム番号, X 座標, Y 座標

例えば、「245; 400; 194」のように指定します。

質問の実行

Twitter プロジェクトを含めてパブリッシュされたプロジェクトで、質問することができるのは学習者だけ(作成者ではない)です。

  1. 右クリック(Windows)または Control キーを押しながらクリック(Mac OS)し、「Ask Question」を選択します。

  2. Ask A Question ダイアログボックスの内部をクリックし、質問を入力します。

  3. 「送信」をクリックします。

質問への回答

Twitter アイコンを使用してプロジェクト内の任意の質問に回答することができるのは作成者と学習者です。

  1. Twitter アイコンをクリックして質問を表示します。

  2. 「回答」をクリックして質問または会話スレッドに回答します。特定のユーザーに対して回答するには、そのユーザーの名前の隣にある矢印をクリックします。

  3. 回答を入力し、「送信」をクリックします。

本作品は Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License によってライセンス許可を受けています。  Twitter™ および Facebook の投稿には、Creative Commons の規約内容は適用されません。

法律上の注意   |   プライバシーポリシー