環境メモ
⭐️GIMP 2.10
完成内容↓↓↓
https://twitter.com/nonnonkapibara/status/1151245042805137409
💡WebVR💡A-Frame
— non (@nonnonkapibara) July 16, 2019
Unityの✨SkyBox✨作り⚖️Inkscapeと💕GIMPを使って⛪️ステンドガラス⛪️の絵を描いて
🎀360度🎀全天球で作ってみたよぉ👍
A-FrameのWebブラウザでVR表示😊
VRゴーグルで見てみた。とってもいい感じ👯♀️#VR #WebVR #Unity pic.twitter.com/0UNN72PkYn
1.A-FrameのWebブラウザでVR表示する場合は
GIMPで幅3600×1800ピクセル 解像度600で
拡張子.jpg形式でエクスポートする。
2.A-FrameのWebブラウザでVR表示するHTMLを記述する
HTMLのindex.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>A-Frame360度全天球</title>
<meta name="description" content="A-Frame Stained Glass SkyBox">
<script src="https://aframe.io/releases/0.9.0/aframe.min.js"></script>
</head>
<body>
<a-scene>
<a-sky src="non/stainedglass.jpg" rotation="0 170 0"></a-sky>
</a-scene>
</body>
</html>
3.これをサーバーにUPで完了。
類似内容↓
【WebVR】360度全天球を試してみた。A-FrameでWebVR 表示してみたよぉ。
https://qiita.com/nonkapibara/items/1419e55bae2c4c611523
4.UnityのSkyBoxにする場合は、
GIMPで幅3600×1800ピクセル 解像度600で
拡張子.hdrでエクスポートする
完了!
類似内容↓
【Unity】360度全天球をSkyBoxに設定する(Skybox/Cubemap)
https://qiita.com/nonkapibara/items/27aac80da1fb4ff03d0f