UI Crunch #16「メタバースのUI 仮想空間に接続するデザイン」全文公開!
2021年10月にFacebookが社名をMetaと変更するなど、私たちが耳にすることが多くなった「メタバース」という言葉。UIデザインを探求するデザインコミュニティUI Crunchでは、メタバース事業に取り組むゲストをお招きし、メタバースについて理解を深める機会として「メタバースのUI」を企画しました。
会場はメタバースプラットフォームclusterを使って構築し、初のメタバース上でのイベント開催に挑戦!登壇者はバーチャルライブ配信アプリREALITYで作成したアバターで集合しました。
本記事では、当日の様子や登壇内容をお届けします!
🎬 Youtube Liveのアーカイブはこちら
https://youtu.be/5uxm8jJBHJc
REALITY なりたい自分で、生きていく。
DJ RIO | REALITY株式会社 代表取締役社長
2005年、慶應義塾大学環境情報学部在籍時代に、複数のスタートアップの創業に参加。事業売却後に大学を卒業し、4人目の正社員としてグリー株式会社に入社。事業責任者兼エンジニアとして、モバイル版GREE、ソーシャルゲーム、スマートフォン向けGREE等の立ち上げを主導した後、2011年から北米事業の立ち上げ。2013年に日本に帰国し、グリー株式会社 取締役に就任する。2014年にゲームスタジオWright Flyer Studiosを立ち上げ(現WFS)代表取締役に就任。2018年にはWright Flyer Live Entertainment(現REALITY)を立ち上げ代表取締役社長に就任。2021年、REALITYを中心とした「メタバース事業」への参入を主導。
REALITYとは
REALITY株式会社は「なりたい自分で、生きていく。」をビジョンとして、REALITYというスマートフォンアプリを提供しています。
REALITYでできること
REALITYはアバター作成、ゲーム、そしてライブ配信による交流が一体化したスマートフォン向けメタバースです。スマホ1台さえあれば、メタバース上での多様な体験を一気通貫で楽しめるサービスになっています。
現在はグローバル展開を進めており、そこから5GやXR時代の世界的なメタバースになっていくことを目標としています。
データで見るREALITYの成長
REALITYは2018年に提供が開始され、ここ1年ほどで特に大きな成長を遂げています。特筆すべきはグローバルでのユーザーの多さです。世界で63の国と地域で配信され、今や8〜9割を海外ユーザーが占めています。
もう1つ大きな特徴として、極めてエンゲージメントが高いアプリであるということが挙げられます。アクティブユーザーの1日の平均滞在時間が170分と長く、また視聴者に対する配信者の割合も38%と高くなっています。REALITYでは、積極的にコミュニケーションを行うアクティブなユーザーによってコミュニティが形成されています。
REALITYの考えるメタバース
REALITYが作ろうとしてるメタバースでは、3つのポイントを重点的に伸ばしていきたいと思っています。
1. リアルタイムなアバターコミュニケーション
2. ユーザーの手により創造・拡張される空間
3. クリエイターエコノミー
より多くの人がリアルタイムで身振り手振りも含めてコミュニケーションできるようにすることや、ユーザーの手でいろいろなコンテンツを作り出せるようにしていくこと、また、メタバース上でクリエイターがお金を得ていけるようにするということをやっていきたいです。
プロダクトマンから見たREALITYの面白さ
私はこれまでいろいろな場所でプロダクトを作ってきましたが、その立場から、メタバースの領域でUIデザインをやる面白さや今後の将来性についてお話したいと思います。
まず1つメタバースの面白さとして、デザインする要素がとにかく多いということが挙げられます。当然スマートフォンアプリのデザインでは、いわゆるAppleやGoogleのOS標準のインターフェイスガイドラインに則った論理的なデザイン思考が求められます。同時に、3D空間でインタラクティブな体験を設計するには、アニメーションも含め「なんか触ってて気持ちいい」とか「楽しい」「ワクワクする」といった要素を作ることが重要です。メタバースのデザインはとにかく必要な要素が多く、これまでどれか1つをやってきた人は自分の幅を広げられますし、今後これらのスキルは全て必要になっていくと思います。
もう1つ私が面白いと思っているのは、REALITYはスマホ発のメタバースで、かつグローバルに成長している点でオンリーワンであるということです。メタバースはVR向けやPCゲームとしてスタートする場合が多い一方、REALITYはスマホ向けにのみ提供されてきました。ほとんどの人が日々肌身離さず持っているデバイスからスタートしたことで、例えばお風呂の中からゲーム配信をしている人がいるなど、他のメタバースとは少し違ったユーザーの行動が起こっています。また、日本発のコミュニケーション型、プラットフォーム型のサービスには海外で大きくなるものはほとんどないので、その点でもREALITYは非常に珍しいといえます。
私はこのメタバースの潮流が、スマートフォンの普及に次ぐ大きな変革点になるのではないかと考えています。これまでWebやインターネット上での体験はテキストや写真中心の二次元の世界でしたが、これからのユーザー体験やサービスはどんどん三次元の世界に移っていくでしょう。技術的にもデザイン的にも大変革が起こっている中で、この新しい波に飛び乗ってみたい方がいれば、メタバースに関わるのは面白いのではないでしょうか。
REALITYにおけるUIの考え方
超簡単 | REALITY株式会社 UIデザイナー
インバウンド観光系のスタートアップ株式会社VoyaginにてUIデザインを担当した後、2019年にREALITY株式会社にジョイン。趣味は料理で、最近は寿司を握っている。
3Dゲームとメタバースの違いとは
皆さんは3Dゲームとメタバースの違いを考えたことはありますか?
例えば、キャラクターを使ってゲームをするというのは、そのキャラクターを使って遊んでいるだけです。また、世の中にはアバターをカスタマイズして遊ぶようなサービスがたくさんありますが、そこに何らか自分自身を投影している感覚がなければ、それは単なるアバターを使ったネットサービスでしかないと僕は思っています。
つまり、アバターに自身を投影できること、自己投影感を感じることができて初めてそのサービスをメタバースと言えるのではないでしょうか。例えば、皆さんは朝、鏡に映った自分を見て無意識に自分がいるということを認知していると思います。同様にREALITYのアプリ内では、ユーザーが自身のアバターを見る機会を増やすことでアバターへの自己投影感を高める工夫をしています。
ライブ配信終了画面
こちらはライブ配信を終了した後の画面です。今までの配信終了画面では、配信を見てくれた人が一覧で表示され、その人たちにお礼を送れるという機能がメインでした。一方新しいバージョンでは、配信終了後に自分のアバターが大きく表示されます。機能的にはこのアバターを出す必要性はほぼないのですが、よりユーザーに自己投影感を感じてもらうためにこのようなアップデートを行いました。
それでは、自己投影感のあるアバターがいればそれはメタバースと言えるのでしょうか?
現実世界では、自分がいるだけの世界や空間というのはありえなく、いろいろな人と話したり遊びに行ったり、コミュニケーションをとる生活の場が必要です。同様に、メタバースにも生活の場が必要なのです。
REALITYのサービスでは、ワールドやアバター、ライブ配信やそこで行われるコミュニケーションを全て生活の場として提供し、皆さんにメタバース上で生活してもらおうと考えています。リアルだから、バーチャルだからというのはなくて、リアルもバーチャルも同じなのです。
REALITYのUI設計の難しさとやりがい
REALITYは、ネイティブアプリとUnityという2つの実装方法を複合的に用いてつくられています。そのため両者の制約を考えながら最適なUIを設計する必要があり、この難易度はかなり高いです。また、グローバル展開に向けて12言語に対応したローカライゼーションが必要といったチャレンジもあります。他のサービスではなかなか経験できない難易度の高いUI設計に携わることができます。
Unityとネイティブの実装方法を組み合わせる
現在はデザイナーが少しずつ増えていて、これからデザインチームを立ち上げたり、チームの思想などを作っていくフェーズになります。まだまだデザイナーが足りないので、メタバースに興味のある方はぜひ私のTwitterなどを見ていただければと思います!
メタバースプラットフォーム cluster
加藤 直人 | クラスター株式会社 代表取締役CEO
京都大学理学部で、宇宙論と量子コンピュータを研究。同大学院を中退後、約3年間のひきこもり生活を過ごす。2015年にVR技術を駆使したスタートアップ「クラスター」を起業。2017年、大規模バーチャルイベントを開催することのできるVRプラットフォーム「cluster」を公開。現在はイベントだけでなく、好きなアバターで友達としゃべったりオンラインゲームを投稿して遊ぶことのできるメタバースプラットフォームとして進化している。経済誌『ForbesJAPAN』の「世界を変える30歳未満30人の日本人」に選出。
メタバースプラットフォームとは
クラスター株式会社は、「VRからスマホまでどこからでも遊べる『メタバースプラットフォーム』」clusterを提供しています。
clusterはもともと、今回のようなバーチャル空間でのイベントを構築するための機能として発展してきました。その機能を皆さんにも使ってもらえるクリエイターキットとして提供開始したということになります。clusterを使えば、クリエイターの皆さん自身がバーチャル空間やアバターを好きなように作り、さらにその中で遊ぶことができます。
clusterでできること
clusterのUIデザイン
吉岡 航 | クラスター株式会社 デザイナー
スマートフォンのゲームやアプリ、ウェブサイト、子供向け電子玩具の開発などを事業とした会社に従事。クラスター社には2015年の創業よりデザイナーとして参画。現在はclusterのVR・モバイル・デスクトップのUIデザインを中心に携わる。
マルチプラットフォーム デバイスごとの特徴
メタバースプラットフォームであるclusterは、Web、スマートフォン、PC、VRと複数のデバイスに対応するマルチプラットフォームでもあります。それぞれのデバイスにおける機能や特徴を簡単に説明します。
まずWeb版は、clusterの玄関口となるポータルサイトです。様々なイベントを検索して参加したいものを見つけたり、自分が主催するイベント情報を編集することができます。
次に、スマートフォン版(Android/iOS)があります。clusterの開発においてもネイティブとUnityの2つの実装方法が組み合わされています。イベントに入る前の体験の部分はネイティブのiOS/Androidで作られている一方、入った後の部分はUnityで作られていて、ゲームを操作するような、コントローラを模した形のUIで提供しています。
左:ネイティブで構築されたUI、右:Unityで構築されたUI
次にPC版(Windows/macOS)は、モバイルとさほど変わらないUIではあるのですが、キーボードを使うためゲームライクな操作方法になっています。
最後にVR版です。VR版では宙に浮いている形のUIを展開していますが、その見た目については、例えばキーボードなど既存のスマートフォンなどでよく見かけるようなものに合わせています。VRの入り口を抵抗感のないものにしたいので、ユーザーが今まで見たことがありそうなUIを3D空間上に置くという考え方をしています。
VR版のclusterの画面
clusterのUIの変遷
このclusterのUIは、かなり長い間改善を何回も繰り返してきました。その変遷についてご紹介します。
clusterのUIの変遷
まず1番始めのゲームコントローラー版は、ヘッドアップディスプレイを被った状態で手元のコントローラーを操作する形でした。その後、腕ごと動かすことのできるハンドコントローラーがVRにつき、ここからVRのUIの未来についてより本格的に考えることになります。この頃は、現実と同様に物理的な触り心地のあるもの、触れそうな雰囲気のものを使うことで操作を促せるのではないかと考えていました。
しかし、将来的にハンドコントローラーというものもなくなるのではないかと思い始めてからは、指で直接触れるタイプのUIを考えるようになりました。最初はプレート式といって、手元に出てくる円盤をお盆のように動かして操作するものでした。
プレート式のUI
その後、タブレット式によって、今の思想に近い誰にとっても身近なUIを目指し始めました。タブレットを触るような感覚で操作できるUIを経て、現在はその負担をより小さくしてレーザーポインター式のUIを採用しています。
左:タブレット式のUI、右:レーザーポインター式のUI
clusterの中でUIというのはあくまでも脇役です。主役はバーチャル空間上でユーザーさんが作ったコンテンツであって、それを目一杯楽しんでほしい。それを阻害するようなUIにならないように気をつけて作成しています。
個人的に、メタバースのUIを作ることは、10年20年後のスタンダードをつくっていく行為だと思っています。活躍できる分野はたくさんあるので、皆さんぜひメタバースに参入してきてください。
トークセッション
モデレーター
増田 真也 | 株式会社ディー・エヌ・エー 執行役員/デザイン本部長
モデレーター
土屋 尚史 | 株式会社グッドパッチ 代表取締役社長 / CEO
後半は、UI Crunchを主催するディー・エヌ・エーとグッドパッチからモデレーター2名を交え、各社が考えるメタバースについて深掘っていきました。
DJ RIOさん:REALITYを普段使っていると、アバターが手鏡のように自分に連動して動く光景を日常的に見るようになるので、だんだんとそれが自分だというふうに思えてくるんですね。そうすると何が起きるかというと、リアルの自分の見た目をアバターに合わせ始めるという人が続出して。例えば髪の色とかも、REALITYでピンクにしているから自分もピンクにしようとか。自分に似せたアバター作る人ももちろんいますが、アバターに自己投影感を感じるほどリアルの自分もそっちに合わせようとなって、どんどん同一化が進んでいくというのがあるなと思います。
加藤さん:既存のSNSというのはどちかというと情報を発信するタイプのもので、clusterのようなバーチャル空間でコミュニケーションするものって、TwitterやInstagramといったSNSの延長線というよりかは、例えばマクドナルドで集まってだべっていたりとか、大学のサークルの部室に集まっているような感覚に近く、そういうSNSとの体験の違いというのが圧倒的にあると思ってます。clusterでは最近バーチャル喫煙所が流行っていますね。
吉岡さん:iPhoneのUIは当初、スキューモーフィックという既存の現実のテクスチャーを取り入れて、UIに対して親しみを持たせるような方法をとっていましたが、それがヘッドマウントディスプレイのVRでも起きるのではないかなと思っています。
土屋:映画などでも、ある種のリアリティさがあるからこそ内容に共感できるといったことがあると思います。その先に新しさがあるとしても、入口のところはある種既視感のあるものでなければ、人は没入できなかったり認識できないのかもしれないですね。
加藤さん:メタバースの話をした時に、10代20代の人たちからは「なに当たり前のこと言っているんだろう」という反応が返ってくると思うんですよね。アバターを使ってゲームをしたり、リアルタイムでボイスチャットで繋がるということを普段からやっている若者にとっては、何が変わるんだ、当たり前じゃないのか、みたいな感覚があると思っていて。UI/UXの観点でいうと、普段ゲームなどをしない人も戸惑わずに使えるかと言ったらまだまだで、やはりもっとハードルを下げていかないといけないと思っています。VR1つとってもまだまだわかりづらいですし。
土屋:あと重要な観点で、この産業に優秀な人材がたくさん来るかということがありますよね。メタバースが次の産業として盛り上がっていく時に、かつて時代がスマートフォンアプリなどの開発に入っていった時に比べて、若干技術的ハードルが高そうだというイメージがあるのではないかと思います。Unityとか3D空間、VR空間の構築みたいなのってイメージが全然わかなかったりするし、デザイナーからすると「今までスマホアプリのUIを作ってきて、メタバースには興味はあるけど何があればサービスづくりに関われるんだろう」みたいな。そこがちょっとわかりづらいところがありますね。
超簡単さん:僕はREALITYに入る前はWeb関連の会社で働いていて、それこそiOSやAndroidのこともわからないし、ましてやUnityのことなんて何もわからなかったです。初めからわかっているデザイナーってたぶん全然いなくて。これから先、例えば開発しているサービスがヘッドマウントディスプレイにも対応しますとなったら、最初から全部カバーできる人って多分いなくて、それより重要なのはわからないと思ったらエンジニアに聞くなり自分で勉強して、それを繰り返していくことじゃないでしょうか。入る前から全部わかる人はいない気がします。
吉岡さん:3D空間になったからといって、今まで学んできたWebデザインやUIデザインの知見が活かせないかというとそんなことはありません。そういった知見が入ってきた方がいいUIが作れると思うので、どんどん入ってきてもらいたいと僕は思いますね。
最後に、運営側から登壇者の皆さんに質問を投げかけました。
超簡単さん:僕にとってのデザインは「難しいを超簡単にするためのツール」ですね。世界を超簡単にすることが僕のミッションなので。
DJ RIOさん:目的を達成するための手段です。
加藤さん:メタバース自体もそうですが、「どうやったら幸せで気持ちよくなれるか」という問いに対する試行錯誤なのではないかと思います。
吉岡さん:僕にとってはクラフトがやっぱり強いと思っています。作ることがデザインじゃないとよく言われはしますが、やっぱり作るのは楽しいし、作っていかないと人との接点はできていかないと思うので、改めてそこを大事にしたいなと思っています。
さいごに
日本のメタバース産業を牽引する2つのサービスについて、その設計思想やユーザーインターフェースの変遷を伺うことができ、大変貴重な時間になりました。トークセッションでは、登壇者4名のメタバースへの想いや愛情が全開でコメント欄も盛り上がっていました!これからさらに成長が加速するであろうメタバースについて、皆さんが興味を深めるきっかけとなれば幸いです。
UI Crunchでは今後もイベント情報を発信していきます。興味のある方は、ぜひSNSのフォローや関連ページのチェックをお願いいたします!
▼UI Crunch 公式サイト
https://ui-crunch.com/
▼Twitter
https://twitter.com/ui_crunch
この記事が気に入ったらサポートをしてみませんか?