無料のオープンソースを使ったモバイルラーニング実践

14
無無無無無無無無無無無無無無 無無無無無無無無無無無 株株株株株株株株株株株 CEO 株株株 1 株株株株株株株株株株株株株株株株株株株株株株

description

2014年5月29日に行われたモバイルラーニングコンソーシアムでのウェビナープレゼン資料です。 Moodleを中心としたOSSを組み合わせて無料でモバイルラーニングを構築する実践的な技法を紹介しています。

Transcript of 無料のオープンソースを使ったモバイルラーニング実践

Page 1: 無料のオープンソースを使ったモバイルラーニング実践

無料のオープンソースを使ったモバイルラーニング実践

株式会社イーラーニング CEO松崎剛

1株式会社イーラーニングが提供しているサービス

Page 2: 無料のオープンソースを使ったモバイルラーニング実践

Who am I ? ● 松崎剛

[email protected]● http://www.facebook.com/matsuzakit

● CEO of e-learning corporation ltd.● 2000年設立● http://www.e-learning.co.jp● http://www.facebook.com/elearningJPN● IT エンジニア向けコンテンツ● 各種Moodleサービス

● 設置、サポート● 開発● トレーニング

● 日本ムードル協会ビジネス部会長

● MCCC(Moodle Certified Course Creater)

2

Page 3: 無料のオープンソースを使ったモバイルラーニング実践

中心はMoodle(ムードル )

• Moodle とは?– 世界標準の LMS

• 公式登録サイトのみで、• 240 カ国• 85,389 登録サイト• 77,095,449 ユーザ数• 1,167,903 先生数

– OSS( オープンソース・ソフトウェア ) であり、ソフトの使用料等は一切かからない

– 豊富なプラグイン• 2014/5/1 現在 800 ケ

– 頻繁なアップデート ->2.7 はロングタームサポート

3

オープンソースでのモバイルラーニングを考えた時に、中心となる LMSはやっぱり Moodle

Moodle Official Site

Moodle Plugin

Page 4: 無料のオープンソースを使ったモバイルラーニング実践

MoodleでのMobile

4

• デバイスによってテーマを変える– タブレット、モバイルでテーマを選択可能– モバイルテーマ、 MyMobile もあるが

• Moolde 2.5 までしか対応していない• 完成度があまり高くない

• モバイルアプリ– HQ 公式 , Android, iPhone– Web サービスを有効にする– 実際のコンテンツはブラザーを起動

• レスポンシブテーマ– Moodle 2.5 より Twitter Bootstrap をベースにしたテー

マが提供されている。– 標準では 非常にシンプルな Clean のみ。 2.7 ではレス

ポンシブテーマがディフォルト

Moodle ではテーマによって見栄えを大幅に変更できる。 3 つの手法が考えられるが現在はレスポンシブテーマがお勧め

MyMobile

Moodle アプリ

Page 5: 無料のオープンソースを使ったモバイルラーニング実践

フロントページ

5

パッドiPad AiriOS 7.1.1Chrome

PCWindows VistaChrome 34.0.1847.131 m

スマホGalaxy-s4Android4.3ChromeMoodle カスタムテーマ

レスポンシブテーマでどのように見えるのか?

Page 6: 無料のオープンソースを使ったモバイルラーニング実践

テキスト主体の教材

6

パッドPC

スマホ

スマホでも実用になる .... 面白みはないが、、、

Page 7: 無料のオープンソースを使ったモバイルラーニング実践

小テスト

7

パッドPC

スマホ

スキマ時間の勉強に最適

Page 8: 無料のオープンソースを使ったモバイルラーニング実践

OSSでのビデオ

8

• MP4 が標準 (H.264/AAC)• 単に MP4 ファイルを「ファイル」として

設定するだけでも、ブラウザーがサポートしていれば表示される ( 見え方はブラウザーによってまちまち )

• プレイヤーを使うと見栄えが統一される• HTML5 プレイヤー

– VideoJS, JQuery Player, JW Player,... Youtube• ビデオをどこに置くか?

– Youtube ... 広く公開されて良いのか? – サーバローカル ... サーバ CPU, ネット

ワーク帯域は大丈夫か?– CDN(Contents Delively Network) ... 有料

• Moodle とのアドイン– AVFVideo ... 株式会社イーラーニング製 ,

VideoJS を内蔵 , Amazon Cloud Front との連携

Google Chrom

Firefox

標準に合わせる

Page 9: 無料のオープンソースを使ったモバイルラーニング実践

ビデオ

9

パッドPC

スマホACFVideo(OSS)

iFrame からの最大化はブラウザーで挙動が違うので注意。別ウィンドウにすれば問題なし

Page 10: 無料のオープンソースを使ったモバイルラーニング実践

PPTをどう見せるか?

10

• HTML5 変換ツールを利用する– オープンなものから有料まで様々なソ

フトが有る– 単純なものなら変換ができるが複雑な

ものへの対応は?• 1 つの方法として写真ビューアを使

う方法があります– アニメなしの PPT に限る– PPT から画像としてファイルを書き出

し、ビュアーで見せる– 画像なので文字コピーが不可能– 見た目はオリジナルと同じになる ->

細かいチェックの必要なし– オープンソースプレイヤー

• IrfanView, JPEGView, JQuery Panorama Viwer, Galleria

Galleria

PPT を画像変換して、写真ビュアーで見せる

Page 11: 無料のオープンソースを使ったモバイルラーニング実践

スライド

11

パッドPC

スマホスライド加工サービス

金をかけずにきれいなコンテンツを

Page 12: 無料のオープンソースを使ったモバイルラーニング実践

課金したい

• Moodle では paypal モジュールが標準となっている ( ディフォルトでは OFF)

• 1 コースに対する売り切り課金のみサポート

12購読課金、複数コース課金

モバイル対応課金の仕組みが Moodle では無料

Page 13: 無料のオープンソースを使ったモバイルラーニング実践

13

Any Questions ?

株式会社イーラーニング http://www.e-learning.co.jpFacebook https://www.facebook.com/elearningJPNACFVideo https://github.com/matsuzakit/moodle-activity_acfvideoSlideshare http://www.slideshare.net/matsuzakitYoutube http://www.youtube.com/playlist?list=PLgH_LJ_itFn-VhBcW5jW8dN0-henVutBR

Moodle http://moodle.orgMoodle Plugin https://moodle.org/plugins/日本ムードル協会 http://moodlejapan.org/home/https://www.facebook.com/groups/103710113036755/

VideoJS http://www.videojs.com/Galleria http://galleria.io/

ご紹介させていただいた内容の URL です。

Page 14: 無料のオープンソースを使ったモバイルラーニング実践

14

おまけ

言語の切り替えでシステム、コンテンツの言語切替が可能。コンテンツは HTML タグで両方を記述するMoodle 言語パック 123 言語

Moodle + Adobe Connectのシングルサインオン

http://www.slideshare.net/matsuzakit/moodle-adobe-connect