このセクションの記事

もっと見る

VRアクション編集のやり方を知りたい

  • 更新
フォローする

VRアクションの種類

VRアクションは下記の通り7種類あります。

１．シーン移動矢印
VRコンテンツのシーンを移動が可能になるアクションです。

２．画像の埋込
「jpg」「png」「gif」の形式の静止画を表示するアクションです。
画像アップロード時に「長辺640px × 対応する比率」にリサイズされます。
画像の容量や画素に制限はありません。
※「heic」「heif」形式の画像をアップロードするとエラー画面が表示します。拡張子を「jpg」等に変換してからアップロードしてください。（HEIC→JPGの変換ツールはこちらから）

３．コメントの埋込

テキストでコメントを入力し、表示するアクションです。

４．映像の追加
動画(形式：MOV、MP4 容量：200MB未満)を表示するアクションです。

５．Webページのiframe埋込
HTML iframeタグを使用してWebページを表示するアクションです。

６．Youtube動画の埋込
Youtubeの動画を埋め込みで表示するアクションです。　

７．外部リンクの埋込

外部リンクに遷移したい場合、埋め込みが可能になるアクションです。

VRアクション編集画面の開き方

①「新規プロジェクト制作」の制作プロセスより

新規制作の過程で編集画面を開くことができます。
ダッシュボードメニュー「新規プロジェクト制作」を選択し、表示される指示にしたがって
制作を進めていくと「VRアクション追加」を選択する画面へ遷移して参ります。
（プロジェクト全般設定 → 全シーン360度写真アップロード → 各シーンのタイトル/画像/切替編集
→ フロアマップ追加 → 各シーンにVRアクション追加）

②「プロジェクト管理/編集」画面より

マイページ画面で左メニューから「プロジェクト管理/編集」を選択します。
次に、対象プロジェクトのサムネイルをクリックします。

gazo01.jpg

個別のプロジェクト編集画面で、左メニューから「VRアクションの編集」を選択します。
編集したいシーンのゴーグルマークを選択します。

gazo02.jpg

 

各VRアクションの埋込み方法

１．シーン移動矢印の場合

編集画面が表示されたら、左上の矢印アイコンを選択します。

mceclip1.png

シーンに表示されたアイコンを希望の場所へ配置します。

mceclip3.png

左右から斜めから出ている矢印をクリックし、アイコンの向きを調整します。次に、位置を確定するを選択します。

mceclip4.png

下のシーン一覧から移動先のシーンを選択します。

mceclip5.png

「シーン移動が追加されました。」が表示されたら、右下の保存し編集を終えるを選択します。

mceclip6.png

下の画像の確認はYESを選択します。「保存完了です！」の表示がでたら編集画面をブラウザタブごと閉じます。

image25.png

 

２．画像の埋込

編集画面が表示されたら、左上のカメラアイコンを選択します。

mceclip7.png

シーンに表示されたアイコンを希望の場所へ配置します。

mceclip8.png

次に、位置を確定するを選択します。

mceclip9.png

参照を選択し画像をアップロードし、希望に応じてURLとコメントも入力します。
次に、下の上記ファイルをアップロードして埋込を選択します。
(始めにこのキャプションを開いておくにチェックを入れると、右下の画像のようにコンテンツ再生時にキャプションを始めから開いた状態で表示ができます。)

image23.png　mceclip4.png

次に右下の保存し編集を終えるを選択します。

mceclip12.png

下の画像の確認はYESを選択します。「保存完了です！」の表示がでたら編集画面をブラウザタブごと閉じます。

image25.png

 

３．コメントの埋込

編集画面が表示されたら、左上のコメントアイコンを選択します。

mceclip13.png

シーンに表示されたアイコンを希望の場所へ配置します。

mceclip15.png

次に、位置を確定するを選択します。

mceclip16.png

コメントを入力し、希望に応じてURLを設定します。次に、下の上記コメントを埋め込むを選択します。
(始めにこのキャプションを開いておくにチェックを入れると、右下の画像のようにコンテンツ再生時にキャプションを始めから開いた状態で表示ができます。)
※全角、半角ともに横幅２４文字（スペース含む）で次の行へ自動改行されます。
  長文・英文などは希望に沿わない箇所で改行となる場合がございますので
  文字を画像に起こし画像埋め込みにてご対応ください。

image32.png　mceclip1.png

次に右下の保存し編集を終えるを選択します。

mceclip17.png

下の画像の確認はYESを選択します。「保存完了です！」の表示がでたら編集画面をブラウザタブごと閉じます。

image25.png

 

４．映像の追加

※VRモードで埋め込んだ映像キャプションを、iOSデバイスで開く際、一度動画をクリックやタップで選択することで再生がスタートします。
iOSソフトウェア上の仕様でございます。ご理解の上ご容赦いただけますようお願いいたします。

個別のプロジェクト編集画面で、左メニューから「VRアクションの編集」を選択します。

gazo02.jpg

上のメニューから動画アップロードを選択し、動画(形式：MOV、MP4 容量：200MB未満)をアップロードします。

mceclip2.jpg

動画アップロード後は画面を下へスクロールし、動画が追加されているか確認して下さい。

mceclip3.jpg

次に動画を埋め込みたいシーンのゴーグルマークを選択します。

mceclip1.jpg

編集画面が表示されたら、左上の映像アイコンを選択します。

mceclip22.png

シーンに表示されたアイコンを希望の場所へ配置します。

mceclip23.png

次に、位置を確定するを選択します。

mceclip24.png

動画を埋め込むを選択します。
(コンテンツ再生時にキャプションを開いた状態にしたい場合は、始めにこのキャプションを開いておくにチェックを入れてください。)

mceclip25.png

次に右下の保存し編集を終えるを選択します。

mceclip26.png

下の画像の確認はYESを選択します。「保存完了です！」の表示がでたら編集画面をブラウザタブごと閉じます。

image25.png

 

５．Webページのiframe埋込

編集画面が表示されたら、左上のiframeアイコンを選択します。

mceclip27.png

シーンに表示されたアイコンを希望の場所へ配置します。

mceclip28.png

次に、位置を確定するを選択します。

mceclip29.png

URLを入力し、上記サイトを埋め込むを選択します。

image52.png

次に右下の保存し編集を終えるを選択します。

mceclip30.png

下の画像の確認はYESを選択します。「保存完了です！」の表示がでたら編集画面をブラウザタブごと閉じます。

image25.png

６．Youtube動画の埋込

編集画面が表示されたら、左上のYoutubeアイコンを選択します。

mceclip33.png

シーンに表示されたアイコンを希望の場所へ配置します。

mceclip34.png

次に、位置を確定するを選択します。

mceclip35.png

Youtube動画のIDを入力し、上記動画を埋め込むを選択します。
( 動画のURLが https://www.youtube.com/watch?v=EGW8dwDcRm0 の場合、V=の後ろのEGW8dwDcRm0 が動画のIDです。)

image62.png

次に右下の保存し編集を終えるを選択します。

mceclip36.png

下の画像の確認はYESを選択します。「保存完了です！」の表示がでたら編集画面をブラウザタブごと閉じます。

image25.png

 

７．外部リンクの埋込

編集画面が表示されたら、左上の外部リンクアイコンを選択します。

mceclip38.png

シーンに表示されたアイコンを希望の場所へ配置します。

mceclip39.png

次に、位置を確定するを選択します。

mceclip40.png

URLを入力し、上記リンクを埋め込むを選択します。

72.png

次に右下の保存し編集を終えるを選択します。

mceclip41.png

下の画像の確認はYESを選択します。「保存完了です！」の表示がでたら編集画面をブラウザタブごと閉じます。

image25.png

 

VRアクションの削除・変更方法

VRアクションの削除・変更方法は二通りあります。

キャプション編集欄から

次の画面で、左メニューから「VRアクションの編集」を選択します。

gazo02.jpg

対象シーンの下向きの矢印を選択します。

mceclip6.jpg

そうすると、埋め込んでいるアクションの詳細が表示されるので変更や削除を行います。
最後に画面下の変更を確定を選択します。

mceclip7.jpg

__________2021-04-26_16.15.23.png

 

方法２

次の画面で、左メニューから「VRアクションの編集」を選択します。

gazo02.jpg

次にアクションを削除・変更したいシーンのゴーグルマークを選択します。

mceclip1.jpg

編集画面が表示されたら、右上のアイコンから希望のものを選択します。

mceclip5.jpg

アクションの位置変更や削除が終わったら、右上のアイコンを選択し内容を確定させます。

mceclip8.jpg

次に右下の保存し編集を終えるを選択します。

mceclip41.png

下の画像の確認はYESを選択します。「保存完了です！」の表示がでたら編集画面をブラウザタブごと閉じます。

image25.png

 

※VRアクションが保存できない場合

ご利用のブラウザをご確認して下さい。

Spacelyの推奨環境は以下の通りです。
  PC：Google Chrome 最新版、Firefox 最新版、Safari 最新版、Edge最新版

※Internet Explorer は、スペースリーサポート対象外になります。
（Internet Explorer につきましては、Microsoftでも公式に非推奨となっておりますため）

 

※Google Chromeブラウザで一部VRアクション編集が保存できない問題が発生しております。
リンク先の手順を参考に、以下の操作をご実施下さい。

①Chromeを最新バージョンにアップデート（参考リンク）
②ブラウザキャッシュを削除（参考リンク）

（上記で改善されない場合）
Google Chromeのシークレットモードから、もしくはMicrosoft Edgeなど別のブラウザからの操作をお試しください。（Microsoft Edgeのダウンロードはこちらから）
問題が解消された環境下で、しばらくご利用いただくようお願いいたします。

関連記事