1

I would like to create a prototype like this one: just using Xcode SceneKit Editor. I found an answer where the room is created programmatically with simple SCNPlane objects and playing around with the rendering order.

However, I would like to put together something more elaborated like downloading the 3d model of a room and make it accessible only through the portal. I'm trying to achieve the same effect directly in the Xcode's SceneKit editor converting this part:

// a. Create The Left Wall And Set its Rendering Order To 200 
// Meaning It Will Be Rendered After Our Masks
let leftWallNode = SCNNode()
let leftWallMainGeometry = SCNPlane(width: 0.5, height: 1)
leftWallNode.geometry = leftWallMainGeometry
leftWallMainGeometry.firstMaterial?.diffuse.contents = UIColor.red
leftWallMainGeometry.firstMaterial?.isDoubleSided = true
leftWallNode.renderingOrder = 200

// b. Create The Left Wall Mask And Set its Rendering Order To 10 
// Meaning It Will Be Rendered Before Our Walls
let leftWallMaskNode = SCNNode()
let leftWallMaskGeometry = SCNPlane(width: 0.5, height: 1)
leftWallMaskNode.geometry = leftWallMaskGeometry
leftWallMaskGeometry.firstMaterial?.diffuse.contents = UIColor.blue
leftWallMaskGeometry.firstMaterial?.isDoubleSided = true
leftWallMaskGeometry.firstMaterial?.transparency = 0.0000001
leftWallMaskNode.renderingOrder = 10
leftWallMaskNode.position = SCNVector3(0, 0, 0.001)

into two planes in the editor:

SceneKit Editor

I took care of setting isDoubleSided and renderingOrder for both of them and I made the second one transparent (using alpha on the Diffuse Color).

Unfortunately, when displaying in AR mode, it doesn't work.

Andy Jazz
  • 49,178
  • 17
  • 136
  • 220
Claus
  • 5,662
  • 10
  • 77
  • 118

1 Answers1

4

ARKit + SceneKit

enter image description here

A virtual world in ARPortal-like scene must be blocked from user by 3D wall. This wall must have an opening, where the entrance is, through which you'll see the 3D objects of the portal. The wall's material is Occlusion material. This type of material is an invisible material that hides 3D objects rendered behind it but shows a video coming from iPhone's AR camera instead. SceneKit doesn't have such a material out of the box, so let's create it.

enter image description here

This code shows how to programmatically assign an Occlusion material to SceneKit object:

portalPlane.geometry?.materials.first?.colorBufferWriteMask = [] 
portalPlane.geometry?.materials.first?.readsFromDepthBuffer = true
portalPlane.geometry?.materials.first?.writesToDepthBuffer = true
portalPlane.renderingOrder = -100

This image shows how to set properties in Xcode's Material Inspector:

enter image description here

And this image shows how to set property in Node Inspector:

enter image description here

On the other side, to exit the portal, you need a 3D object like a door. The poly normals of the door should point inward, and the poly normals of the wall with the opening should point outward. The material for both objects is single-sided.

RealityKit

In RealityKit, you are capable of using Occlusion Material out of the box.

portalPlane.model.materials[0] = OcclusionMaterial()
Andy Jazz
  • 49,178
  • 17
  • 136
  • 220
  • Thanks for the very extensive answer! However, I'm still trying to create the scene (1 cube and 1 door made of 3 plans) just using the SceneKit editor. After reviewing your answers and comments. 1) DONE - Cube rendering order set to -1 2) DONE - Planes (walls) rendering order set to 100 3) DONE - Planes doubleSided prop = true 4) TO DO - I cannot find `colorBufferWriteMask` property 5) TO DO - I cannot find `writesToDepthBuffer` property Here the latest version --> https://ufile.io/v28s5 – Claus Oct 21 '18 at 20:59
  • PS. should I see the effect happening in the SceneKit editor? – Claus Oct 21 '18 at 21:07
  • so basically I cannot achieve this effect just using the scene editor, right? Do you think I could use the custom properties field? – Claus Oct 21 '18 at 21:14
  • tried the version made just with SceneKit editor...it doesn't work. I will give a try programmatically – Claus Oct 21 '18 at 22:58
  • please let me know if you are able to make that file working – Claus Oct 21 '18 at 22:59
  • Almost. I managed to make it work when I'm outside the entrance (the cube is hidden behind the wall) but when I'm on the other side the wall is transparent. You can have a look here https://ufile.io/5vxe1 – Claus Oct 22 '18 at 00:52
  • so basically I should one door with the same material only pointing in the other direction. Can I suggest for you to create an .scn file with a simple template and load it on GitHub? – Claus Oct 22 '18 at 01:15
  • this doesnt work for spheres, what if you are outside you can see the 3d content behind you – masaldana2 Oct 18 '19 at 23:28