cancel
Showing results for 
Search instead for 
Did you mean: 

[Tutorial] How to create posters and put them in Oculus Home

Anonymous
Not applicable

Have you
ever wished you were able to put your favourite pictures on your virtual walls? Well, this is possible with the Custom Objects feature! Well, it’s not a
direct process, but I do manage to get posters in my Home, so I figured I would
share this method, in case it would interest anyone.

I'm assuming you know the basics of Unity. If you don't... well of course, you can still try ^^. Otherwise, you can ask help from someone who does.




You’ll need
the following software:



-       
Oculus
Home 2 (“no sh*t!”),



-       
Unity, with a free Unity account + FBX Exporter (from Unity Asset Store)     OR Blender with the FBX add-on (find it in User Preferences).



-       
Three.js
editor (online tool, no need to download).



-       
GLTF
Converter (another online tool ; there are a few, but I suggest this one : https://blackthread.io/gltf-converter/).




Now, here
is the process to put a poster in Home.

Short version :

0) Set-up : choose the picture you want, make sure you have Unity and the FBX Exporter asset, and prepare the online tools. Create a new project in Unity, import the FBX Exporter and the picture in this project.

1) In Unity, create a single plane and put the picture as its texture. Resize the plane to get the proper proportions (don't worry about the actual size).

2) With FBX Exporter, export this object as a FBX file. You now have a FBX object and a texture file.

3) Drag those two files in a GLTF converter. This will give you a single glb file.

4) Drag this glb file in three.js editor and reduce the size of the object. By default, the scale should be 0.1. Save the result as a new glb file.

5) Put the new glb file in the Import folder for Oculus Home, don't forget to rename it (by default it's "scene.glb" ...).

If the object is still too big, do step 4) again (reduce the size even more). There is a known problem where sometimes it doesn't change anything, I'm not sure where that comes from ^^'. Here is a nice tip : take one of your imported files as a size reference in three.js editor. Put the new file next to this one, and compare their size (you know the size of the reference object in Home, so by comparing a new object to it, you can have a pretty good idea of its size once imported).

With Blender, it is literally the same process : create plane, make that picture its texture, change the proportions, export is as .FBX file, convert it (with its texture) as .glb file, and so on ...



If you feel that you need a more detailed explanation, here is the long version (with Unity). It may seem long and hard but don't worry, it's actually not!



First
of all, we need to create the “poster object”.
Choose
any picture.
 I want this one in my Home:
klh4dt890ibb.png
 - Open
a new project in Unity.
 Let's call it... nah, it doesn't matter
anyway.
Put
your picture in the project Asset folder.
 In the new scene, make a
flat plane object. Finally, you have to import the asset. You should have
something like this :

ai49nvvtml4t.png

- Create a new material, and make that picture its texture. Then,
just drop the material on the plane.

vtob97ktpea3.png

- Resize the plane to get the proper dimensions. Don’t worry about the actual size of the
object
, this will be dealt
with later. Just make sure that the proportions of the picture are respected!
(this is obviously not the case on the screenshot above...)

 

Okay, that was the first step: we just created our poster. Then, this object
must be extracted from Unity.

Export this object as a .FBX file with FBX Exporter: right click
on the object, and select “Export as FBX...”. If you don't find that option,
restart Unity.

- In the assets folder of your Unity project, you should find that FBX object,
along with its texture.

 

Now, you should have 2 files: the FBX object, and its texture. You have
to convert that into a single glb file.

- Open the GLTF Converter.

Drop both these files in the proper place. The conversion
won’t work if you don’t.

- The website should do the conversion by itself. If it worked, the
"Export as GLB" button will be blue and selectable (don't worry if
you don't see your object : that just means you see it from aside, and since
it's flat, you can't see it from this point of view...). Click on that
button, it will save the GLB file on your computer.

 

 

Okay, that was the first step: we just created our poster. Then, this object
must be extracted from Unity.

Export this object as a .FBX file with FBX Exporter: right click
on the object, and select “Export as FBX...”. If you don't find that option,
restart Unity.

- In the assets folder of your Unity project, you should find that FBX object,
along with its texture.

 

Now, you should have 2 files: the FBX object, and its texture. You have
to convert that into a single glb file.

- Open the GLTF Converter.

Drop both these files in the proper place. The conversion
won’t work if you don’t.

- The website should do the conversion by itself. If it worked, the
"Export as GLB" button will be blue and selectable (don't worry if
you don't see your object : that just means you see it from aside, and since
it's flat, you can't see it from this point of view...). Click on that
button, it will save the GLB file on your computer.

 
upx4rx0reg7z.png
Now you have your poster object, and it's compatible with Oculus Home!
But if you try to import it… you may encounter a "huge" problem.
Indeed, your object will be way too big. Ten times its size, actually. So we
need to rectify this.

- open the GLB file in three.js editor. The texture will be black, but
don't worry! It will appear correctly in Home.

- resize the object (by default, use 0.1 as the size value) and save it as a
new .GLB file (File\Export as GLB).

- Rename the new .GLB file and put it in the import folder.

- If 0.1 still gives you a huge object, try a smaller value. Sometimes I
encounter a problem where changing the size this way doesn't actually change
anything in Home ; I have no idea where this comes from ^^' I'd like to hear
from someone who knows.

 

Then you will have a flat plane object, with a proper size, which we can call a
poster ^^. I would put a picture of the final result... but I don't know how to
make a screenshot of my Home xD (again, if anyone has a suggestion to do this,
I'd love to hear them out...).









Hopefully this helped anyone! I was pretty proud of my small discovery, because
posters are a good way to make a more personal room. 
Besides, 3D models are great but can take up a lot of resources. Pictures don't take anything so it's a framerate-friendly custom method 🙂 .

21 REPLIES 21

Calimero_Oeuf
Expert Protege
Thanks

Anonymous
Not applicable
Hey there, I see you edited your post, does that mean you solved your problem? Because with my method, I also get trouble aligning my pictures on the wall. If anyone else gets this problem : first make sure your plane object is aligned on a plane of the Unity space (or Blender space). Then, in Home, you just have to tweak a little. Move the poster a bit (with your hand, not with the thumbstick), it is capricious but it will wind up aligning properly xD!

Also, I'm editing the first post to say that we can use Blender as well. I had tried this one before Unity, but setting-up the texture was a bit of trouble... But it does work (I don't know what I was doing wrong, lol).

Calimero_Oeuf
Expert Protege
Yes I solved it with blender by making a cube with very small faces for the borders like a real drawing
You need a small thickness to avoid problem when aligning on walls, that's why I created a cube.
cl7ipv13z6a7.jpg
After some hours of tries with Blender (very big noob, I never use it before)
I have no more problem now and alignement on walls is perfect without any tweaking.

Calimero_Oeuf
Expert Protege
cx4fnk0nh7ov.jpg

Noobfear
Honored Guest
Thank you for taking the time to make this guide, it was the final piece i was working on for my home i can now add everything and be happy.

just small addition if you use blender the khronos group do a gltf exporter for it so you can skip a step of converting it
zxqti2b9udw6.png

emperorvoid
Explorer
For the love of dog can some of you wonderful people share these wonderful glb files?????????????????????

LZoltowski
Champion
Amazing work people!!!
Core i7-7700k @ 4.9 Ghz | 32 GB DDR4 Corsair Vengeance @ 3000Mhz | 2x 1TB Samsung Evo | 2x 4GB WD Black
ASUS MAXIMUS IX HERO | MSI AERO GTX 1080 OC @ 2000Mhz | Corsair Carbide Series 400C White (RGB FTW!) 

Be kind to one another 🙂

Calibos
Heroic Explorer


For the love of dog can some of you wonderful people share these wonderful glb files?????????????????????

Seconded! 

It'd be amazing if someone could build some frame models of different sizes and designs with the resolution specs listed that the rest of us can just add our own posters once we've cropped and/or scaled them. I'm not asking for much am I? 😄

LZoltowski
Champion

Calibos said:



For the love of dog can some of you wonderful people share these wonderful glb files?????????????????????

Seconded! 

It'd be amazing if someone could build some frame models of different sizes and designs with the resolution specs listed that the rest of us can just add our own posters once we've cropped and/or scaled them. I'm not asking for much am I? 😄


Another easy way to make a 2D image for posting in your home is to use this site: https://glb-frame-maker.glitch.me/ 

1. Choose frame
2. Drag and drop a picture into the browser with the correct dimensions
3. Download GLB
4. Move to My Documents/Home/_Import
5. Profit

Suggested by @jessicazeta from the Medium crew

Core i7-7700k @ 4.9 Ghz | 32 GB DDR4 Corsair Vengeance @ 3000Mhz | 2x 1TB Samsung Evo | 2x 4GB WD Black
ASUS MAXIMUS IX HERO | MSI AERO GTX 1080 OC @ 2000Mhz | Corsair Carbide Series 400C White (RGB FTW!) 

Be kind to one another 🙂