LogoMark.png

日本映像学会2015

MotionSquare

― マルチ映像提示のための Web システム





井上 貢一 / Inoue, Koichi 所属:九州産業大学芸術学部デザイン学科






はじめに

これは何?

 本作品は、複数の動画をWebページ内に配置し、それらを同時再生してマルチ映像として楽しむためのWebシステムである。動画をファイルとして扱うことができる今日では、HTML5の<video>タグを用いた直接的な埋め込みや、<iframe>タグを用いたYouTube動画の埋め込みなど、Webページに複数の動画を配置して、それをマルチ映像として表示・共有することができる。しかし、それにはHTMLの知識が必要であり、一般には若干敷居が高い。また例えばYouTube上にチャンネルを開設すれば、登録した動画を羅列再生することも可能だが、それでは見せ方の自由度が低い。そこで筆者は「まとめサイト」等によく用いられるWikiをベースに、動画を自由なレイアウトで配置するためのプラグインを作成し、誰にでも簡単に動画のマルチ再生ができるしくみを開発した。

動作環境

本システムの動作環境については、特別に必要な条件はない。一般的なブラウザがあればPC、タブレット、スマートフォンなど、環境を選ばず動作可能である。

制作の背景

マルチスクリーン

 複数の映像を一挙に提示するマルチ映像。個々の映像素材の色彩や動きが相互に関係しあうその視覚体験に、筆者は以前から音楽的な魅力を感じていた。視覚的なコンポジションにおいては、個々の映像は旋律を奏でる楽器であり、空間的な和声の進行には、無限の組み合わせがある。

Design Concept|「編集可能性」

筆者がその活動において常に意識しているのは、生産完成品としてのコンテンツをつくることではなく、生産性としての「仕組み」を提供することである。誰もが手に入れることができ、小さな規模で応用でき、人間の創造力を喚起させるような「編集可能性」の提供。今回は、インターネット上に無限にある「映像素材」の活用を前提とすることで、その可能性はより大きなものとなった。

私が考える「デザイン=技術の人間化」とは
「資源を編集可能な状態で共有する」ということです。
ユーザーによる自由な編集 ( 改変 ) を可能にするとともに、
ユーザーの学習意欲を喚起する。 そうしたモノ・仕組・コトが、
社会の健全な発展に貢献すると考えています。
作品はひとつの「生産性」であって、生産完成品ではない

(J. クリステヴァ ,1984)


標準仕様とブラウザ環境の充実

使用した技術

Web標準技術

Pukiwiki

 PukiWikiとは、オープンソースのCMS(Content Management System)で、このシステムを用いたWebサイトでは、Wikipediaのようにブラウザの画面からページの編集ができるので、誰にでも簡単に文字や画像、また各種コンテンツを配置することができる。
 そこで、1)動画名、2)幅、3)高さ、という3つのパラメータだけで動画を表示するプラグインを作成し、これをシステムに投入するかたちで、ページ内に複数の動画を配置できるしくみを実現した。例えば、

&Youtube(ABC,320,240);

と記述すると、ページ上には、YouTubeの動画(ID=ABC)が320x240で表示される。これを3つ連続して書けば、3面のマルチスクリーンがページ上に実現する…というぐあいである。

ファイル構成とソースコード

(書きかけです)



開発環境とライブラリ

 PukiWikiは、そのプラグインも含めて、大半のファイルがPHP(Hypertext Preprocessor)で書かれている。また、サイトのビジュアルを定義するCSS、インタラクティブなアクションを実現するJavaScriptも、すべてテキストファイルであることから、開発に用いたのはテキストエディタのみである。またデバッグには、WebブラウザであるFirefox2)に標準で搭載された開発ツールを用いた。すべてオープンな技術である。

gedit テキストエディター
Linux 標準のシンプルなテキストエディタ
Firefox 標準 Web 開発ツール
JavaScript プログラムのバグ発見に貢献
Linux ( Ubuntu12.04 LTS )



結び

Small is Beautiful

科学・技術の方法や道具とは、
・安くてほとんどだれでも手に入れられ、 ・小さな規模で応用でき、 ・人間の創造力を発揮させる ようなものでなくてはならない。
E.F.Schumacher | 1973


ご清聴ありがとうございました。







PAGES

GUIDE

DATA

Last-modified: 2019-07-05 (金) 20:51:28