VRComix

Want to try making your own hand-drawn virtual worlds? Awesome! Follow these steps:

1. Get an equirectangular grid image. I have both a large, single-page one and three smaller ones available here as PDF downloads: http://adrianherbez.net/vrdraw/

2. Print out the grid

3. Draw, draw, draw! It might take some time to get used to drawing on the rounded grid, but you’ll get there. Remember that vertical lines don’t change, and if you get stuck, think about how you would have to turn your head to look at the point you want to draw. The amount of left/right rotation corresponds to the horizontal position, and the amount of up/down rotation corresponds to the vertical (with 0,0 being the center of the page)

4. Scan or photograph your image, and do any additional digital work. You’ll want to at least:
– crop the image
– make sure it’s exactly twice as wide as it is tall (recommended size: 2048×1024)
– also make sure that the left and right edges meet up seamlessly. Most 2d editors have a way to do that – usually it’s an “offset” filter or similar.

5. Use your image in an A-Frame scene. A-Frame is a great WebXR library from Mozilla, and makes using an equirectangular image really easy. Here’s an example: https://aframe.io/examples/showcase/sky/

Extra Stuff

I based my equirectangular grid generator on “Drawing Equirectangular VR Panoramas with Ruler, Compass, and Protractor”, by António Bandeira Araújo, which can be read here: http://artes.ucp.pt/citarj/article/view/471

Example A-Frame code

Note that you can use the rotation value to set the direction the camera is looking at startup (useful if you want to direct attention somewhere.