プロジェクト報告書 Project Report

提出日(Date) 2018/1/19

アクアビジョン
Aquavision
1015030 折原 征幸 Masayuki Orihara
1.

背景

我々は、新たな課題として動画の撮影方法や撮影機材な函館は日本でも有数の港町であり、今でもその恩恵であどの情報を、ほかの撮影者と情報共有できるための場を作る海産物は地元の人だけでなく、観光客など人々を喜ばせることを設定した。そこで、我々は AR コンテンツではなている。しかし、食料としての魚は知られていても、そのく多くの人と動画を共有できる Web アプリケーションを魚の生態はあまり知られていない。例えば、海の中で魚が開発することとなった。この Web アプリケーションを開

どのように獲物を捕食するか、どの時期にどういった行動発する意義としては、AR コンテンツは自分達が実際に撮をとるかなどである。今回、水中撮影用のカメラやその他影してきた動画を使い開発していくため、綺麗で鮮明な映機材を用いた。水中を泳ぐ魚を撮影していく中で、その映像が必要となる。我々は先ほど述べたように、映像を追求像を用いた一つの作品を作成することで一般の人々に魚をすることは困難であった。そこで、私たちが開発する Web深く知ってもらう機会を作ることはできないだろうかと考

アプリケーションでは、撮影してきた動画を公開し、ほかえた。の撮影者により良い方法などを提案してもらう。そして、前、後期合わせて 5 回の撮影をしてきた中で、何度か魚たくさんの動画を上げてもらうことで、海や魚にあまり興群や大きな魚の撮影に成功した。しかし、カメラの中心に味のない人たちに興味を持ってもらうと共に、撮影技術の納められないことや、カメラから遠くなってしまうことで向上を目指している。よって到達目標としては、撮影した魚種を特定できないこと、鮮明でないなどの問題が挙げら

動画をほかの人と共有し、撮影方法や機材などを公開できれた。それらの理由から映像を用いて魚について知ってもるような Web アプリケーションを開発することに設定しらえるようなコンテンツの作成は難しいという判断になった。Web アプリケーションの到達レベルとしては、水中動た。そこでもし、我々が考えた撮影方法を他者が見て、そ画撮影者のために情報共有できる場を提供し、多くの人にこから新たな発想に結びつけてくれたらもっと面白い撮影

函館の海や魚に興味を持ってもらえるような Web 開発を方法が確立できるのではと考えた。

行う。

2.

3.

課題の設定と到達目標
我々は初め、多くの人に函館の魚や海に関して興味を持

課題解決のプロセスとその結果
まず、教員から 3 つの水中カメラ、GoPro 製 Hero4、ってもらうことを課題とし、プロジェクトを進めていっ

KODAK 製 PIXPRO SP360、GARMIN 製 VIRB を借りた。

た。その中で、初めて海中撮影を行った際に、海の鮮明度以下、GoPro、KODAK、GARMIN とする。また、それぞれが低く、波も高かったためゴミが入り、海が濁った映像が

図 1、図 2、図 3 である。そして、それぞれの仕様と特徴を撮影された。我々は撮影した映像から、どのように撮影を調べた(表 1)。GoPro の特徴は、SuperView という機能で広すればきれいな映像が撮れるのかを考え、また撮影した映い範囲を撮影できることや、4K 画質の撮影ができることで像を使った AR コンテンツの開発を行ってきた。しかし、ある。KODAK の特徴は、360°全方位視野の撮影ができる自分たちの発想では綺麗な映像を撮影することには限界がことである。GARMIN の特徴は、GPS 機能が付いているこあるという問題が浮上し、上記の課題を達成することは非とである。また、水中にあるカメラを遠隔操作するため長さ常に困難であることを知った。そして、我々は新たな課題

10m の Wireless Line、GoPro と KODAK を取り付けることを設定することとなった。

ができ、最大 7m まで伸びる棒 Bi Rod も借りた。

水中を撮影した。
表 1. 3 種類のカメラのスペック比較

動画撮影

最後に、防波堤近くの砂浜の波打ち際へ場所を移し、

GoPro

KODAK

GARMINKODAK で撮影を行った。KODAK を Bi Rod に取り付け、4K：15fps

1920×1080:

1920×1080:30fps

カメラとスマートフォンを Wireless Line で接続し、中島、高野が棒の操作、折原が映像のチェックを行い、撮影した。

30fps(最高画質)それぞれ撮影した映像を評価した。GoPro は、Bi Rod に写真撮影

1200 万画素

約 1636 万画素

1600 万画素

視野角94.4°×122.6°

360°×214°不明

取り付けて撮影すると映像が上下反転してしまうため、動内蔵マイク○○○

画編集で上下を元に戻す必要があるが、棒に付けることで、

Wi-Fi

○

○

○

手の届かない場所を撮影できることや、4K 映像の鮮明さな

GPS

××

○

ど 、 デ メ リ ッ トよ り も メ リッ ト の 方 が 多 いと 感 じ た 。

1160mAh

1250mAh

2000mAh

KODAK は、360°全方位視野の特殊な映像を撮影可能で、バッテリー気になるデメリットは特になかった。GARMIN は、Bi Rodに取り付けることができず、GPS 機能を使用する機会もなかったので、メリットよりもデメリットの方が多いと感じた。
図 1. GoPro 製 Hero4

KODAK を海底に沈めて、海面に向けて撮影するという案が出た。さらに、去年のプロジェクトで使用していた道具を教員から借りることができたため、去年の道具の中にあった機材を分解して、新しい機材を作成した。新しく作成した

図 2. KODAK 製 PIXPRO SP360

機材の名前を、ゴルダック 1 号と命名した(図 4)。ゴルダッ
ク 1 号は、KODAK を取り付けて、図 5 のように、海底から海面に向けて撮影するための機材である。4 つ角のリングにチェーンを通して吊り下げることで、カメラが上を向いた

図 3. GARMIN 製 VIRB状態で海底まで到達できる。約 7m のチェーンを使用しているため、水深 6m 程度ならば、海底に到達できる。

プロジェクトの最終成果物の参考にするため、はこだてみらい館と函館市国際水産・海洋総合研究センターにて展示物の見学を行った。
各カメラの特徴を把握したところで、実際にどのような図 4. ゴルダック 1 号

映像を撮影できるかを確認するため、1 回目の撮影を行った。
撮影場所は、折原の案で、湯の川にある函館市熱帯植物園裏の海岸に決まった。使用した機材は、GoPro、GARMIN、KODAK、Bi Rod、Wireless Line、スマートフォンである。
まず、GoPro で撮影を行った。折原の指示で防波堤に移動し、GoPro を Bi Rod に取り付け、カメラとスマートフォンを Wireless Line で接続し、中島と小野寺が棒の操作、高野が映像のチェックを行い、撮影した。
次に、近くの河口へ場所を移し、GoPro と GARMIN で撮影を行った。GoPro は、防波堤の時と同じ方法で撮影を行った。GARMIN は、長嶋と折原が交代で、直接手に持って図 5. ゴルダック 1 号イメージ図
2 回目の撮影は、1 回目に撮影できなかった魚を撮ることを目標とし、また、ゴルダック 1 号でどのような映像が撮影できるかの確認を目的とした。場所は、函館市国際水産・海洋総合研究センター前にある岸壁とした。使用した機材
は、ゴルダック 1 号、KODAK、GoPro、Bi Rod、WirelessLine、スマートフォンである。
まず、折原と長嶋がゴルダック 1 号による撮影、中島と小野寺、高野が GoPro による撮影と役割分担を行った。
ゴルダック 1 号チームは、
まず、ゴルダック 1 号に KODAKを取り付けた。前回の撮影時、チェーンの長さが足りなかったので、チェーンの長さを約 14m にした。そして、WirelessLine は長さ不足のため使用しなかった。長嶋がゴルダック1 号を海へ降ろし、今回は着底を確認できた。

を取り付け、チェーンを取り付け、Wireless Line でスマー

次に、PowerRay に長さ 30m の防水ケーブルを接続し、コトフォンとカメラを接続した。次に、長嶋がチェーンを持っントローラーや iPad mini で操作するための無線ステーシてゴルダック 1 号を吊るし、岸壁から海へ降ろした。そのョンと接続した。今回は iPad mini で操作するため、予め設間、折原はスマートフォンで映像をチェックした。

定しておいた専用アプリケーションを使用して PowerRay

GoPro チームは、まず、Bi Rod に GoPro を取り付け、Wireless Line でスマートフォンとカメラを接続した。
次に、を操作する準備をした。タモ網に PowerRay を入れて、海に降ろし、撮影を行った。

中島と小野寺が棒を持ち、岸壁から海に降ろした。その間、高野はスマートフォンで映像をチェックした。

4 回目の撮影は、PowerRay で撮影した映像が成果物に利それぞれ撮影した映像を評価した。まず、魚を撮影すると用できるかを見極めるため、また、前回は使用しなかった付いう目標は両方のカメラで達成することができた。GoPro属品の魚群探知機の使用と、コントローラーでの操作を確

では、運良くイワシの群れを撮影することができ、また、1かめるために、3 回目同様函館市国際水産・海洋総合研究セ回目の撮影よりもしっかりと海の中を撮影することができンター前にある岸壁で撮影を行った。使用した機材は、ゴルた。次に、ゴルダック 1 号での撮影は、魚を撮ることはできダック 1 号、KODAK、PowerRay、PowerRay の付属品、タたが、事前の調べよりも水深が深く、海底に到達する前にチモ網である。

ェーンの長さが足りなくなり、宙吊りのような状態になってしまったため、改善が必要という結果になった。

まず、3 回目と同じ手順でゴルダック 1 号を海底に沈めた。次に、PowerRay と無線ステーションを防水ケーブルで接続し、今回は付属のコントローラーで操作するため、無線我々は中間報告会の準備をするのにあたり、役割分担をステーションとコントローラーを接続した。また、PowerRay行った。小野寺と高野はポスター作成を行い、中島と長嶋はに魚群探知機を取り付けた。そして、タモ網に PowerRay をスライド作成を行った。また、長嶋はスライドで用いる、撮入れて、海に降ろし、撮影を行った。

影した動画の編集を行った。折原は、スライド・ポスター作

PowerRay で撮影した映像は、魚を追いかけるような映像成に関するアドバイスとタスク管理を行った。中間報告会があったり、海底を這うように進む映像があったりと、他のの日には、小野寺と中島がプレゼンテーションを行い、長嶋カメラでは撮影できない映像が撮れるというメリットがあがプレゼンテーションを撮影し記録した。折原は質疑応答った。また、魚群探知機によって現在の水深などを測ることの場面で質問に答え、高野はアンケート用紙の配布と回収もできた。しかし、潜ってしまうと PowerRay 本体が見えなを行った。小野寺と中島のプレゼンテーションでは、緊張のいので、向いている方向がわからないなどのデメリットもあまり発表が棒読みになってしまいあまり良い発表はできあった。

なかった。
3 回目の撮影は、改めてゴルダック 1 号でどのような映像が撮影できるかの確認を目的とし、また、夏休み中に教員が購入した水中ドローンである PowerRay(図 6)でどのような映像を撮影できるのかを確認するために、函館市国際水産・図 6. PowerRay

海洋総合研究センター前にある岸壁で行った。使用した機材は、ゴルダック 1 号、KODAK、PowerRay、PowerRay の付属品、タモ網、iPad mini である。
まず、ゴルダック 1 号に KODAK を取り付け、チェーン4 回目の撮影の後、餌を使って魚を集めて撮影するという案が出たので、5 回目の撮影では、前回と同様に函館市国際水産・海洋総合研究センター前にある岸壁で、釣り用の餌を用意して、魚を集めるという方法で撮影を行った。使用したの情報を当てはめ、自動生成を実現した。そして、現在の機材は、GoPro、Bi Rod、木製の細い棒、Wireless Line、釣年月日時分秒のファイル名で指定フォルダ内に保存した。

り糸、カゴ、おもり、撒餌、スマートフォンである。

また、ファイル名をピンの座標データと共に csv ファイル

まず、Bi Rod に GoPro を取り付けて、Wireless Line でカメラとスマートフォンを接続した。次に、木製の細い棒に釣に格納することで、ピンをクリックした際に、対応する動画再生ページに飛ばすことを可能にした。

り糸を巻きつけ、糸の先にカゴ、おもりの順で取り付けた。

開発の際に、関連した講義としては、Web 開発の際に用カゴに撒餌を詰めて、カメラを海に入れて、カメラの正面にいる HTML や CSS などの言語の習得に関連する情報機器カゴが来るようにし、カゴを上下に振って餌を撒いて撮影概論が挙げられる。

した。

中島と高野がポスターの内容作成を行い、折原がポスタ

今回の撮影では、餌を撒く前から、遠目ではあったが魚ー作成のアドバイスとレイアウトの担当を行った。また、がいたためか、餌を撒くと次々を魚が集まり、最終的には最終成果報告会での発表者を高野、折原、小野寺とし、長画面いっぱいの魚を撮影することができた。必要な道具が嶋はスクリーンに映す PC 画面の操作、中島は評価シート増えるが、高価な物はなく、揃えやすいので有用性の高いの配布、回収を担当した。

撮影方法であった。

ポスター作成では、掲載する内容を項目ごとに別け、分担しながら作業を進めていた。また、お互いに書いた文章を開発を始める前に、折原が外装、長嶋、小野寺が Webレビューし合い、内容の確認や誤字脱字のチェックを行うアプリケーションのサーバー部分として内装を作るというなど連携して作成をおこなった。また、定期的に折原が内役割分担を行った。折原は、イラストレーターソフトを用容を確認し、内容変更の指示などを行った。内容が完成しいて、Web アプリケーション用の素材作成、HTML とたものを、折原がレイアウトを行った。

CSS を用いて、画面のデザインやサイトマップなどを実装した。また、地図上にピンを立てるという仕様のために、

4.

今後の課題

JavaScript による開発も行った。小野寺は、PHP を用い我々は到達目標として Web アプリケーション開発を挙て、動画をアップロードする機能の実装と、アップロードげ、実際に開発した。しかし課題として挙げた函館の海にされた動画を一覧表示する機能を実装した。長嶋は、PHPついて興味を持ってもらうという点に関しては未だ達成さを用いて、動画をアップロードする機能に付け加えて、動れていない。初めに設定した課題を確実に達成することが画のサムネイルも一緒にアップロードする機能、動画再生

このプロジェクトにおける今後の最大の課題であろう。具

ページを自動生成する機能を実装した。また、地図上にピ体的には、開発した Web アプリケーションを実際にターンを立てるという仕様のために、PHP と JavaScript を用いゲット層に利用してもらい、意見を得るといったことで課て、異なる言語間の変数の受け渡しを行った。その方法と題の達成に近づくと考える。

して、地図上に立っているピンをクリックした際に、座標また Web アプリケーションを公開し、継続的に運営しの数値を取得するために JavaScript を用いて取得を行っていくことで多くのユーザーに開発した Web アプリケーた。取得した座標を変数を用い PHP に受け渡すため、ションが認知され、それによって函館の海も知られていHTML で POST メソッドを用い PHP に受け渡した。そしく。Web アプリケーションを閲覧した人を水中撮影に導けて、受け取った座標の数値を csv ファイルに書き込んだ。

ば、コンテンツも増えていきさらに海について興味が持っまた、トップページにピンを立てるために、PHP を用いてている人が増えていく。多くの人が水中撮影を行えば、撮csv ファイルから座標データを読み込んだ。そして、読み影技術も多くのユーザーの中で共有され、確立していく。

込みの時と同様に HTML を用い JavaScript に変数を渡し、このように Web アプリケーションを通して水中撮影のシその変数の座標情報を用い JavaScript を用いピンを立てーンが盛り上がることによって、函館の海について興味をた。動画再生ページの自動生成に関しては、投稿ページの持ってもらうという初めに設定した課題が達成されたとい記述内容を配列に格納し HTML のポストメソッドを用いえる。よって水中撮影を今よりも主流にしていくことこそPHP に配列を受け渡し、自動生成用のテンプレートに配列が今後の大きな課題となるだろう。