We are going to improve our portal by adding some texture to the walls and a compass image that will show where the portal will appear. For that, we have to add the texture image and the compass image to our project. To do this, follow these steps:

1. Right-click on the ARPortal project and select New File... In this case, select SceneKit Catalog from the Resource tab, as shown in the following screenshot:

2. Name it Media.scnassets and create it, as follows:

3. Right-click on the newly created Media.scnassets and select Add Files to "Media.scnassets".... Now, select the wood.jpg image from the resources of this project and accept it. Our image is ready to be used. 
4. Repeat step 3 with the compass.png image.
5. Open Portal.swift and, in the createWall method, find the following line:

wall.firstMaterial?.diffuse.contents = UIColor.white 

Change it so that it reads like so:

wall.firstMaterial?.diffuse.contents = UIImage(named: "Media.scnassets/wood.jpg")

Here, we have added the wooden texture to our portal.

6. Now, we will paint the compass in ViewController.swift. For that, create the following variable after the portal variable:

var compass: SCNNode? = nil

7. Now, uncomment the first renderer method, which is where the anchor planes are added (if you had it commented), and substitute the code inside it with the following:

if portal == nil && compass == nil
{
    let node = SCNNode()
    guard let planeAnchor = anchor as? ARPlaneAnchor else {return nil}

    let plane = SCNPlane(width: 0.8, height: 0.8)
    plane.firstMaterial?.diffuse.contents = UIImage(named: "Media.scnassets/compass.png")
    plane.firstMaterial?.transparency = 0.8

    let planeNode = SCNNode(geometry: plane)
    planeNode.position = SCNVector3(x: planeAnchor.center.x, y: planeAnchor.center.y, z: planeAnchor.center.z)
    planeNode.eulerAngles.x = -Float.pi/2

    node.addChildNode(planeNode)

    planes[planeAnchor] = plane
    compass = node

    return node
}
return nil

Here, when a plane anchor is detected, if there is no portal or compass in view (the first time a plane is detected), we will paint a semitransparent compass showing the user the place and orientation of the future portal. Then, we'll save the node as the anchor so that we can use it in step 9.

8. Comment the didUpdate renderer method if you haven't. We won't need it anymore.
9. In the didTapOnScreen method, remove the code between portal = Portal() and self.sceneView.scene.rootNode.addChildNode(portal!) and include the following code instead:

if (compass != nil)
{
    portal?.position = compass!.position
    portal?.rotation = compass!.rotation

    compass?.removeFromParentNode()
    compass = nil
}
else
{
    portal?.position = SCNVector3(x: result.worldTransform.columns.3.x, y: result.worldTransform.columns.3.y, z: result.worldTransform.columns.3.z)
}

Here, when the user taps on the screen for the first time (the compass is in view), we place the portal using the compass position and rotation, and we delete the compass as we no longer need it. From that moment on, if the user keeps tapping on the screen, the portal will move according to the taps and anchor plane position, like before.

10. Run the app to see how the compass appears as soon as the device detects an anchor plane:

11. Now, tap the screen to see how the portal has a wooden frame. This can be seen in the following screenshot:

12. From the inside, the texture of the walls has changed too, as shown in the following screenshot:

And that's it. Now, you can place the portal wherever you want and play with different options such as changing the 3D painting or creating more than one portal at the same time. It's up to you!