Monday, 26 December 2011

Quran Project - Loading 3D Obj Models

Reading e-books is like eating marmite. You either love it or hate it. Myself personally, I read lots of articles, but never have the attention span to get through a book. Currently we're working together with the Quran Project charity ( in trying to re-create your typical reading experience into something more as an interactive 3d novel. The basic idea being that you get to browse the different chapters of the book, by swiping through different scenery and animations that hopefully entice you to read on more than perhaps you normally would.

Working along with a 3d artist has it's challenges, ranging from getting your naming conventions right to importing the assets created.

The models I'm working with have been exported from Maya as obj files. In the past I'd write my own exporter into my own personal favoured file format. However, I took this opportunity, to go with the flow for compatibility reasons and work on getting obj files imported into the application engine I'm working with.

I found a great ObjLoader tutorial series online here (, I tested out the provided tutorials with the model exported and found that tutorial3 was everything I needed to get to the obj description.

Integrating the objloader header and cpp file into an iOS project can be done with minimal changes to get it compiling. Those being to comment out win32 specific includes and switch from the OpenGL method of drawing polygons using glBegin and glEnd, into an OpenGL ES compatible vertex array using GL_TRIANGLES.

So the first step would be to take the loaded in vertices and draw them using OpenGL ES's GL_TRIANGLE construct, but of course this would lead to an incomplete scene.

What we need to do is switch from OpenGL's GL_POLYGONS to OpenGL ES' GL_TRIANGLES. To do so we can create a triangles from the first vertex and remaining vertices of the polygon.

As in if we have a 5 sided polygon.
We'll make a triangle from the first three vertices (v1, v2, v3).
Then, the first vertex and the next two (v1, v3, v4).
Then finally, the first vertex and the last two (v1, v4, v5).

You can grab the source code from the Open Source cross platform application framework (here) with the file to watch out for being CCModelObj.cpp.