Yes Second Life

セカンドライフに早9年、現役セカンドライファーの考えてること

HighFidelityのTablet UI Frameworkを使う

この記事は、セカンドライフ技術系アドベントカレンダー2017向けの記事です。

adventar.org

前回ちょろっと触れましたが、HightFidelityでHUDみたいなUIを作るには、Tablet UI Frameworkというのを使います。今回はこのフレームワークで出来ることを見ていきます。

Webページを表示する

Tabletオブジェクトの、gotoWebScreen関数を使うと、指定したWebページを表示できます。

(function() {

    // クリックイベント
    this.clickDownOnEntity = function(entityID, mouseEvent) {

        // Tabletオブジェクトを取得
        var tablet = Tablet.getTablet("com.highfidelity.interface.tablet.system");
    
        // このブログを表示
        tablet.gotoWebScreen("http://sabro.hatenablog.com/");
    };
})

モバイル用のページが表示されるみたいです。

f:id:sabro:20171203232010p:plain

上のスクリプトではTabletオブジェクトを唐突に取得しています。このオブジェクトの定義がないかHighFidelityのインストールディレクトリのJSファイルを色々検索して調べてみたのですが、定義されてる箇所が見つかりませんでした。とりあえず、Tablet UI Frameworkを使用するときのおまじないみたいなものと思っておくことにします。

f:id:sabro:20171203235114p:plain

なお、Webページ以外にもQt向けの宣言型UI言語、QMLの表示にも対応しているみたいですが、今回はそこまで試せませんでした( ̄□  ̄ ||

デフォルトのメニューを拡張する

HighFidelityの世界にログインすると、デフォルトでこんなメニューが表示されます。これは公式で用意されているメニューなわけですが、Tablet UI Frameworkを使えばここに自分の機能を追加することが出来ます。

f:id:sabro:20171204000946p:plain

具体的にはTabletオブジェクトのaddButton関数でメニューUIにボタンを追加し、そのボタンのクリックイベントを定義してやればOKです。スクリプト終了時にはボタンを削除する処理も忘れずに入れておきます。ここでは、ボタンを押すとGoogle検索を呼び出すだけのGoogleボタンを作ってみます。

(function() {
    
    // Tabletオブジェクトを取得
    var tablet = Tablet.getTablet("com.highfidelity.interface.tablet.system");

    // デフォルトのメニューにボタンを追加、ボタンの文言はGoogleを指定
    // iconプロパティを設定すれば独自のアイコンの表示も可能だがここでは省略
    var button = tablet.addButton({
        text: "Google"
    });

    // メニューのボタンを押した際に呼び出す関数、ここではGoogle検索を表示
    function onClicked() {
        tablet.gotoWebScreen("https://www.google.co.jp/");
    }

    // メニューボタンクリックイベントと関数を接続する
    button.clicked.connect(onClicked);

    // スクリプト終了時に呼び出す関数
    function cleanup() {
        tablet.removeButton(button);
    }

    // スクリプト終了イベントと関数を接続する
    Script.scriptEnding.connect(cleanup);
}()); 

作ったスクリプトはインターフェーススクリプトとして読み込みます。メニューの拡張みたいにクライアントから接続している間だけ有効にしたい機能はインターフェーススクリプトとして使用するのがベストです。作ったスクリプトtablet-test.jsと名前をつけてディスクから読み込みます。

f:id:sabro:20171209201332p:plain

メニューにGoogleボタンが追加されました。

f:id:sabro:20171209201404p:plain

押すとGoogle検索画面が表示されます。

f:id:sabro:20171209205401p:plain

終了処理を仕込んであるのでスクリプトを✕ボタンで停止するとボタンもメニューから消えます。

f:id:sabro:20171209215213p:plain

一通り見てきましたが、公式のメニューを自分で拡張できるのが面白いですね。この拡張性の高さがHighFidelityの魅力でもあります( ̄∇  ̄ )

HighFidelityで伝言掲示板をつくる

この記事は、セカンドライフ技術系アドベントカレンダー2017向けの記事です。ウチは例のごとくHigh Fidelityネタを書きます。

adventar.org

今回は実際に何か作ろうということで、伝言掲示板を作ってみようと思います。チャットかなにかで文言を指定すると、それを記録し残してくれるようなツールです。

f:id:sabro:20171123224654p:plain

セカンドライフではオブジェクトに文字列を残すのは結構大変で、すべての文字をテクスチャでアップロードして切り替えたり、プリムにWebページを表示してそこで文字列を表示したりしてましたが、HighFidelityではテキストオブジェクトというテキストを表示するためのオブジェクトが用意されています。これを使えば割りと簡単に実装できそうです。

f:id:sabro:20171123231439p:plain

しかし、ここで重大な事実が判明。なんとHighFidelityにはテキストチャットのインターフェースがデフォルトでは存在しません。テキストチャットから文字列を送信するという手法は取れなくなりました。

f:id:sabro:20171125020834p:plain

今はRiftみたいなHMDでアクセスするのが当たり前なので、マイクのチャットを使うだろうからデフォルトでテキストチャットがあっては邪魔だろうという判断みたいです。一応インターフェース(ビューワ)には、チャットを実装したインターフェーススクリプト、chat.jsが付属しているので、これを有効にしてやればテキストチャットできるようになります。

f:id:sabro:20171125023209p:plain

余談ですが、このchat.jsはすべて公開されているAPIで実装されています。つまり自分でオリジナルのチャットシステムを作ったりもできるということですね。実際、HighFidelityにはオリジナルのチャットシステムを作って公開してる人もいるみたいです。

f:id:sabro:20171125192819p:plain

しかし、デフォルトでOFFになっている機能を前提とするのも微妙なので、今回は伝言掲示板をクリックすると、入力ダイアログを表示するような方針で行こうと思います。

掲示板のタッチイベントで、javascriptのWindow.prompt関数を使って入力値を取得。それをEntities.editEntity関数でテキストエンティティのプロパティに設定します。

(function() {

    // クリックイベント
    this.clickDownOnEntity = function(entityID, mouseEvent) {

        // 入力ダイアログを表示
        var message = Window.prompt("Input Message!", "");

        // 入力値をテキストエンティのtextプロパティに設定
        Entities.editEntity(entityID, { "text" : message });
    };
})

残念ながら、Window.promptの表示メッセージに日本語を使用するとダイアログが出ませんでした。このスクリプトをWeb上に公開しテキストエンティティにScript URLを設定します。

f:id:sabro:20171125225951p:plain

このへんの話がわからない人は、こっちを見てね。

High Fidelityのスクリプト - Yes Second Life

またまた余談ですが、Script URLの下に、Server Script URLというプロパティがありますね。実はEntity Scriptは、Client Entity ScriptとServer Entity Scriptに分かれました。前者はユーザがエンティティの近くにいるときだけ動作し、後者はユーザがいるかどうかに関わらず動作し続けます。

さて、では作った掲示板の動作確認です。まずはタッチでダイアログを出してメッセージを入力。残念ながら日本語は入力無理でした。

f:id:sabro:20171125235420p:plain

入力後、無事メッセージが変わりました。

f:id:sabro:20171125235611p:plain

最初は、テキストの入力をどうするか分からなくて大変そうだなあと思ってたんですが、Window.promptが使えると気づいたら結構簡単に出来てしまいました。

今回のようなダイアログでなくセカンドライフのHUDのようにもっと複雑なUIを作りたい場合は、Tablet UI Frameworkというのを使う必要があります。こちらも機会があればまた記事にしたいと思います( ̄∇  ̄ )

HighFidelityのZoneとはなんぞや?

この記事は、セカンドライフ技術系アドベントカレンダー2016向けの記事です。

www.adventar.org


HighFidelityには、Zoneというオブジェクトがあります。今までのVRにはなかった新概念なので、ちょっと解説してみます。

Zoneとはなにか

Zoneは語感からだいたい分かると思いますが、VR世界をいくつかのエリアに分けて各エリアごとに環境設定できるようにするための「区切り」みたいなものです。具体的には、景観やライティングの設定ができます。

なぜZoneが必要なのか

セカンドライフは、シムが寄り集まることで世界を作っていました。環境はシムごとに変えることができたので特にさらなるエリア分けは必要じゃなかったんです。しかし、HighFidelityは、1つのDomein Serverがとても広大な世界を管理します。なので細かくエリアをわけれる仕組みが必要だったんじゃないでしょうか。

ちなみにこういう広大な世界になったのはシム超え問題がやっぱりきつかったんじゃないかと個人的には思ってます。SANSARも同じくシムという概念がなくなるし、広大な世界というのは次期VRのキーワードですね。

Zone編集の基本操作

f:id:sabro:20161210230451p:plain:w480
編集モードに入ると生成できるオブジェクト一覧にZoneが含まれてます。

f:id:sabro:20161210230824p:plain:w480
Zoneを生成したところです。ここでちょっと注意点があります。生成直後のZoneは選択された状態になってますが、選択状態を解いてしまうと再選択できなくなってしまいます。それどころかZoneのワイヤーフレームも見えなくなります。Zoneはとても大きなオブジェクトなので、普通に選択できるようにしてしまうと、他のオブジェクトを作りたいときに邪魔でしょうがないから、そういう仕様なのかなと思います。

f:id:sabro:20161210230949p:plain
Zoneを見えるようにするには、Editメニューで「Show Zones in Edit Mode」にチェックをつければOKです。

f:id:sabro:20161210231344p:plain
選択状態にしたいときは、Entity Listから探してクリックすればOK。

Zoneの背景を設定する

さてここからちょっと本格的にZoneの設定をしていきます。

f:id:sabro:20161210231819j:plain:w480
↑ 公式サイトより引用

Zoneの背景を作るときはサイコロを作る要領で展開図ぽい画像を作ります。またパノラマ画像みたいなのを背景にすることもできるみたいですが、今回は公式サイトから展開図型のサンプルをダウンロードして設定してみます。

f:id:sabro:20161210232610p:plain

Zoneの編集メニューから、Background Modeを「SkyBox」にすると、SkyBoxメニューが出ます。ここで背景画像のURLと画像の色合いを設定できます。

f:id:sabro:20161210232221p:plain
無事設定した画像が背景になりました。

Zoneのライティングを設定する

Zoneはライトの加減も色々変えることができます。変更できる項目は色々あるんですが、とりあえずライトの強さだけ試してみました。

f:id:sabro:20161210233006p:plain
Light Intensityの数値を上げてみる。

f:id:sabro:20161210233035p:plain
びふぉあ

f:id:sabro:20161210233051p:plain
あふたー

おまけ

f:id:sabro:20161210233247p:plain
Zoneは背景やライティングの設定をすると公式には書いてあったんですが、リファレンスには乗ってない「Flying allowed」「Ghosting allowed」みたいなプロパティもありました。前者は予想通りZone内で飛行禁止する設定。後者はよくわかりませんでした。HighFidelity的には、ライティングみたいな見た目以外にも色々設定できるようにする方針なんでしょうか。せっかくなんで物理法則とかもZoneごとに変えれるようになってくれると面白そうです。

他にもZoneは、ネストさせることができたり、直方体以外の形にしたりと変わったことができるみたいで、まだまだ奥深そうです。SANSARにも似たような機能が入る可能性もあるかもしれないし、次世代VRをやる人はZoneという新概念を理解しておくといいかもですよ( ̄∇  ̄ )

High Fidelityのスクリプト

この記事は、セカンドライフ技術系アドベントカレンダー2016向けの記事です。

www.adventar.org

去年に引き続き、誰にも望まれていないHighFidelityの記事になっております。HighFidelityはオープンソースだし、自鯖に入れて遊べるし、自由度が高いから個人的に広まってほしいです。

High Fidelity

さて今回のお題はスクリプト。まずはざっくりとした説明から。

言語はJavascriptです。なのでセカンドライフみたいなState構文とかはありません。作成したスクリプトは、勝手にサーバ上に保存されたりしないので、ローカルマシンのディスクに保存したり、Webサーバ上に置いたりして、インワールドからファイルパスやURLを指定して読み込みます。

そしてHighFidelityには3タイプのスクリプトがあります。

  • Interface Scripts
  • Assignment Client Scripts
  • Entity Scripts

それぞれ役割が違うので詳しく説明していきます。

Interface Scripts

これを説明する前にまずはHighFidelityのアーキテクチャについて、ちょっと知っておく必要があります。簡単に言うとセカンドライフでいうところのシムにあたるのがドメインサーバ、ビューワにあたるのがインターフェースです。Interface Scriptsは、名前の通りインターフェース上で動作するスクリプトです。メニューから「Edit → Running Scriipts」と進むと、インターフェースで動作しているスクリプトを確認したり、新しくスクリプトをロードしたりできます。
f:id:sabro:20161129010307p:plain:h600
たとえば、こんなスクリプトを書いてローカルのディスクに保存して、FROM DISKボタンからロードすると

Window.alert("ウィンドウ テスト!");

こんなダイアログを出せます。
f:id:sabro:20161129012809p:plain:w480
Interface Scriptの主な役割は、メニュー等のUI構築や、インターフェースが起動している間だけ使用する一時的なタスクの実行などになります。ちなみに、Interface Scriptはインターフェース上で動作しますが、そのスクリプトが与えた影響は他のユーザにも反映されます。例えば、スクリプトからオブジェクトの色を変えると他のユーザのディスプレイ上でも同じく色が変わります。

Assignment Client Scripts

Interface Scriptでも大体のことができるんですが、インターフェース上で動くという性質上、ログアウトすると処理が中断してしまうという欠点があります。例えばオブジェクトをアニメーションさせるスクリプトを動かしてからログアウトすると、アニメーションが止まってしまいます。

こういうときに使えるのがAssignment Client Scriptです。名前にClientと入ってますが、これはサーバ側で動作するスクリプトです。なんでこんな名前になってるかを理解するには、HighFidelityのアーキテクチャをもう少し知る必要があります。
f:id:sabro:20161129220409p:plain:w480
↑公式サイトより引用

Domain Serverの下に、AudioMixer、AvatarMixer、EntityServerが動的に割り当てられている感じになってるのが分かります。スクリプトはこれらの割り当てられたサーバで動作します。これらのサーバはDomain Serverから見たら割り当てられたクライアントなので、スクリプトもAssignment Client Scriptと呼ばれるわけです。ちなみに、これらのDomain Serverに紐ついたサーバ群は、Domain Serverと別のマシンで動かすこともできますが、基本的には同一のマシン上で動かすことが多いみたいです。なので、スクリプトはDomain Server上で動いてるくらいの認識で大体合ってると思います。

さて、Interface Scriptsはインターフェースのメニューからロードしましたが、Assignment Client Scriptは、Domain Serverの設定メニューから指定します。
f:id:sabro:20161129222549p:plain:w480
Scriptメニューで、URL、インスタンス数を入力します。Poolはブランクでいいみたいです。

Entity Scripts

Entity Scriptは名前から大体わかると思いますが、インワールドで生成されたオブジェクトに紐付けられているスクリプトです。主にタッチや衝突検知などのイベントをトリガーにして何かしたいときに使用します。

Entity Scriptはオブジェクト編集メニューのScriptURLでオブジェクトと紐つけることができます。Entity Scriptは他のインターフェースからもロードできる必要があるので、ローカルディスクのパスは指定できません。httpのURLを指定しましょう。
f:id:sabro:20161129233242p:plain:h600
Entity Scriptsは、ちょっと書き方が特殊で、匿名関数でイベントを定義するみたいな書き方になります。こんな感じのスクリプトを書いてやると

(function() {
	this.clickDownOnEntity = function(entityID, mouseEvent) {
		Window.alert("クリック テスト!");
	};
})

オブジェクトをタッチでダイアログがでます。
f:id:sabro:20161129235422p:plain:w480

さて、一通り説明できましたけど、少しでも興味を持ってもらえたでしょうか?基本がJavascriptなのでLSLよりとっつきやすく、多くの人がすんなり書き始められるんじゃないかと思います。関数一覧は下のリンクから見れるので、気になった人は覗いてみてくださいね( ̄∇  ̄ )
Category:JavaScript API - High Fidelity Documentation

セカンドライフのおすすめスポット

この記事は、セカンドライフ非技術系アドベントカレンダー2016向けの記事です。

セカンドライフ非技術系 Advent Calendar 2016 - Adventar

ぼくは、ものすごい出不精でホームのTrinityシムから1年近く出てないのですが、せっかくなのでこれを期にどこか新しいところへ行ってみることにしました。

どこから行ってみたものかと考えてた時、ふと最近プレミアムアカウント向けのサンドボックスが追加されたみたいなニュースがあったと思い出して、行ってみることにしました。

f:id:sabro:20161209224003j:plain

Second Life Maps | Main Channel Sandbox A

プレミアム向けのサンドボックスは確かにすいてました。まあ、今はどこへ行ってもわりとすいてるんですけどね・・・。

プレミアムサンドボックスの中にはRC向けの機能を試せるシムもありました(一般ユーザ向けのRCサンドボックスもあります)

f:id:sabro:20161209224257p:plain

Second Life Maps | Magnum Sandbox A

Second Life Maps | BlueSteel Sandbox A

Second Life Maps | LeTigre Sandbox A

Magnumは草原ですが、BluSteelは青っぽい金属、LeTigreは虎皮模様と、地図で見た時若干わかりやすくなっています。

RCサンドボックスは新しいもの好きには便利ですね。どこもすいていたのでプレミアム会員の方は何か作りたいときの選択肢として覚えておくといいかもしれません。

以上、久々のおでかけなのに結局サンドボックスへ行ってしまう友達の少ないさぶろーのおすすめでした( ̄□  ̄ ||

仮想世界でぼくがつくりたいもの

www.adventar.org

この記事は、セカンドライフ非技術系のアドベントカレンダー向けの記事です。

自分は、これまでセカンドライフとWebを連携させるというコンセプトで、3つほどサービスを作ってきました。

でも、3つのサービス全てにおいて達成できてないことがあります。それは、「日常的につかってもらえるもの」にすることです。一応、今でも1年に1回くらいのペースでなんらかの投稿があったりしますが、「すりんく」みたいに日常的に使ってもらえるものになっていません。

これは、ユーザのニーズからサービスを作っていないからだと自分は考えています。

いまユーザが不便におもっていることがあって、それを解決するという方向ではなくて、ユーザが思ってもいなくて、リリースされた時に驚いてしまうようなものが作りたいという思いが自分にはあります。

たぶん優しい人はユーザが困っている時に助けてあげようみたいな発想で、なにか作ると思うんですが、自分の場合は、クリエイターとして認められたいみたいな気持ちが優先してしまって、それが驚き重視や変わった技術偏重みたいなサービスにつながっています。

でも自分はあまりこの性格を直すつもりもないんですよね。そもそも性格というのは、なにか自分に重大なことがあったときに自然と変わるものであって直そうと思って直るものでもないと思います。

なので、リリースした時に驚いてもらえて、なおかつ、たくさんの人に使っていただける。そんなサービスを作れるよう頑張っていきたいとおもいます( ̄∇  ̄ )

High Fidelityの基本的な操作

この記事は「セカンドライフ技術系 Advent Calendar 2015」向けの記事です。

www.adventar.org

前回の記事、High Fidelityを、ローカルマシンにインストールして接続する - Yes Second Lifeで、無事インストールが完了したので、今日はHigh Fidelityの基本的な使い方を見ていきます。

まずは画面右側のメニュー構成

f:id:sabro:20151203024448p:plain

見慣れたものと、そうでないものが並んでいます。1個1個見ていきましょう。

ディレクトリ

f:id:sabro:20151203024729p:plain
ディレクトリは、他のドメインへ移動するときに使います。ドメインセカンドライフでいうところのSimみたいなものだと思っておけば大体だいじょうぶです。

マーケット

f:id:sabro:20151203024956p:plain
こちらは、セカンドライフでいうところのマーケットプレイスだと思っておけばオッケー。ただ、今はテスト段階ということもあり、どの商品も無料でゲットできます。また商品のオブジェクト自体も、クリエイター、所有者の情報や権限みたいなものは実装されていません。

メニュー開閉ボタン

下のボタン群の表示、非表示を切り替えます

アップロード

f:id:sabro:20151203025557p:plain
自作のメッシュをアップロードできます。といっても、High Fidelityにアップロードするのではなく、別途適当なクラウドストレージ等にモデルを置いて、そのURLを入力します。アップロードできるのは、FBXかOBJ形式です。

Box作成

f:id:sabro:20151203025952p:plain
単純なBoxを作成します。オブジェクトの周りにでる矢印をドラッグすると、移動、回転。オブジェクトの端点をドラッグすると拡大縮小できます。ちなみに移動の矢印は上下しかありません。オブジェクトを左右に動かしたい場合は、オブジェクトをドラッグしてマウスを左右に動かします。奥へやったり手前に持ってきたりしたい場合は、マウスを奥や手前に動かします。若干操作に慣れが必要ですが、セカンドライフで3軸の矢印をいったりきたりして位置を調整していた煩わしさはないです。

Sphere作成

f:id:sabro:20151203030552p:plain
単純な球の作成。操作はBoxとだいたい同じ。

ライト作成

f:id:sabro:20151203030702p:plain
セカンドライフでは、適当に作ったオブジェクトを発光させて明かりにしていましたが、High Fidelityでは単独でLightという種類のオブジェクトが用意されています。

テキスト表示作成

f:id:sabro:20151203030914p:plain
セカンドライフが苦手だった文字の表示です。看板みたいなのが簡単に作れます。

Web表示作成

f:id:sabro:20151203031045p:plain
セカンドライフではオブジェクトの面にWebを表示していましたが、こっちではWebという種類のオブジェクトがあります。

Zone作成

f:id:sabro:20151203031155p:plain
High Fidelityでは、Zoneという特徴を持った空間を作成できます。Zoneでは光の当たり方や、遠景画像(空とか地平線とか辿りつけない部分を表現した画像)などを設定できます。Zoneに入るといきなり景色が変わったり、太陽の位置が違ったりと不思議な感覚ですが、色々工夫次第で使いどころがありそうです。

Voxel作成

f:id:sabro:20151203032131p:plain
Voxelを作成してみたら、こんな感じのオブジェクトができました。Voxelについては、公式のドキュメントが整備されてなかったのでよくわかりませんが、小さい負荷で大きなオブジェクトを作れるようになっているぽいです。

セカンドライフと似ている部分もあれば、違っている部分もあって面白いです( ̄∇  ̄ )