Tips/tricks related to graphics and GPU programming

Virtual Reality Projects

January 20, 2012

Back in Spring of 2009 (almost 3 years ago!), I took a very interesting Virtual Reality course offered by Dr. Benjamin Lok in my department. The course basically involves creating Virtual Reality projects. I ended up creating 4 which took a lot of work but which in the end were worth the effort. Here are the four projects I worked on (click on the links for more detailed info/video):

 

  1. Using ARToolkit to demonstrate how touch-screens work:  

    We had to come up with a way to use ARToolkit (Augmented Reality). I thought of attaching some AR markers to a Nintendo DS and demonstrating how 3 different kinds of touch-screens work (resistive, capacitive and infrared). Written in C

  2. Virtual Reality experience: Rescuing someone from a fire:

    Now we started getting into the heavy stuff. We had to create a Virtual Reality 3D experience using a Head-Mounted Display, object tracking and small space. At the suggestion of my teammate, colleague and friend we ended up using the Ogre 3D Engine for the project. We also used Google SketchUp models and wrote the program in C++.

  3. VR experience: Target practice on a military base:

    This was my favorite project. We (me and my colleague Aritra Nath) created “virtual” shooting, where we attached a marker to a Nintendo Wiimote (which was in a gun shell, and you pressed the trigger to shoot). We had an actual barrier in the real-world which was nearly pixel-accurate in the virtual world (well, not quite). Used Ogreand Sketchup again.

  4. New VR Interface for doing 3D landscaping around a house:

    The 4th project involved creating a VR experience where the user could “create” new content. My team ended up creating a way to do 3D landscaping only using fingers and a wiimote. Used the same tools as before.

I consider myself lucky that I was able to take such a course. Though it was kind of grueling at times (especially since all the teams had to share the virtual reality hardware), it was also fun and rewarding at the end.

Category:

3D, Virtual Reality

1 Comment

Tagged with:

Binary Search Tree in Python

January 14, 2012

It has been a while since I have written a data structure from scratch (had to write B-Trees for an Advanced Data Structures course 2 years ago), so I decided to refresh my memory by quickly writing up Binary Search Trees in Python. Making sure you are familiar with data structures always helps with interviews too.

You can access the file here. I have only tested this for integers, so might need a little bit of work for other data types. The following methods have been implemented:

  • add(data)
  • remove(data)

    • Traversals:

  • preorder()
  • inorder()
  • postorder()
  • bfTraversal() (Breadth-first traversal)

    • Helper methods:

  • isLeaf(node) – checks if a node is a leaf
  • lcAncestor(value1, value2) – finds the least common ancestor of two nodes with values value1 and value2
  • printAllPaths() – prints all the possible paths from the root to the leaves

I won’t go over how a BST works, but hopefully the code is self-explanatory.

If there are any questions let me know – hope people find it useful.

Category:

Data Structures, Python

Leave a comment

Tagged with:

Evaluating Bicubic Bézier Surfaces using (Py)OpenCL

November 13, 2011

———————————————————–
GitHub Repository here
———————————————————–

I’ve been meaning to get into OpenCL for a while, so I thought I would write a simple program which would evaluate Bicubic Bezier patches (surfaces) in parallel.
I also wanted to program in Python more, so I decided to use PyOpenCL. You can find more info about the OpenCL implementation in Python from the link.

I am not going to go over what a Bezier patch is and how it can be evaluated. There is a straightforward equation for evaluating one which I will be showing later on, but for more info about Bezier patches you can find other info online.

Let’s begin.

Read the rest of this entry »

Category:

GPGPU, Python, Surfaces

1 Comment

Tagged with:

My Google Chrome extension – “Comment Save”

August 4, 2011

Though I focus mostly on computer graphics, I also have an (amateurish) interest in web-design and web-programming.

Late last year a friend of mine brought to my attention a problem he encountered: he wrote a bunch of text in a textbox and when he clicked submit the server responded with an error. He had lost all he wrote which was frustrating. I thought it would be useful to have an extension which records everything you type in one of those boxes so you can recover it if you lose it.

Another friend suggested it would be nice if the extension kept a history of all your posts (if you are one of those people who comment across many sites a lot). And so I came up with “Comment Save” (which has roughly 500 users as I type this).I’ll let the description describe it:

As featured on Lifehacker!

http://lifehacker.com/5715657/comment-save-keeps-track-of-your-comments-on-the-web

Ever written a large post or comment on a website, click submit, only to see your comment get lost in the internet wilderness? Or your tab/window closed somehow before you could submit?

Or maybe you just like to keep track of all the posts you made on different websites.

Comment Save (CS) helps you keep track of what you have been writing as you type. Icon beside the address bar brings up a window showing you the last post you wrote alongwith a link to the page. Link in the window allows you to view your post history.

You can also filter websites where you don’t want any of your posts to be tracked.

Works on sites like:
- Youtube
- Facebook/Google+
- Gawker blogs (Gawker/Gizmodo/Jezebel/Lifehacker/etc.)
- Engadget/Techcrunch/etc. (Sites which use Disqus)
- WordPress/Tumblr
- Forums of all kinds
- Digg/Reddit
- CNN/New York Times/The Guardian/other news websites
- And lots more!

FEATURES:
——————
* Records your post as you type so you can recover it if you lose it.
* Keeps a history of all your posts along with a link to the page and the time.
* Allows you to add filters so you can disable tracking on certain websites.
* Simple checkbox in the popup window enables/disable tracking globally

The latest version (0.4) added tracking for Google+ posts.

The extension helped me learn Javascript more (and also helped me deal with HTML Web Databases). The source code for the extension is open-source and has been released under the GPL v2 license. The source code can be accessed on Google Code here. Feel free to look through it.

If you have any feature requests for the extension please let me know. Some features I have thought about adding include:

  • Delete all comments after a set time. (User-specified time, for ex. 10 minutes, 1 day, 1 month, etc.) (UPDATE: Added in Version 0.5 on 9th August 2011)
  • Search Comments: Within that include searching by website, within a specific timeframe, etc.
  • Delete Comments by website

Any other suggestions would be welcome!

Category:

Browser, Web

1 Comment

Tagged with:

Deferred Shading in DirectX 10 (with Ambient Occlusion)

June 26, 2011

Deferred Shading is a rendering technique (in comparison to regular forward rendering) which has become popular over the last few years. Games like the upcoming Battlefield 3, Crysis 2 and numerous others use it, so I wanted to give it a try and implement a simple deferred renderer myself in DirectX 10.

———————————————————————————————————-
GitHub Repository and Visual Studio 2010 files:
GitHub Repository here
———————————————————————————————————–

Images for all the render targets/textures (Diffuse, Normals, Depth, Ambient Occlusion, Composite with Ambient Occlusion, Composite without AO):

Diffuse Texture

View-space Normals

Depth Texture

Ambient Occlusion

Composite with Ambient Occlusion

Composite without AO

What is Deferred Shading?

If you are reading this chances are you already know what deferred shading is and how it works, so I won’t go into too much detail. Wikipedia has a good overview and there are other places which can describe it better.

Basically deferred shading involves rendering your view-space normals, your depth-buffer, specular/diffuse, ambient occlusion, etc. values into different textures and then using them at a later pass to create a final composite image (by rendering a full-screen quad). There are several advantages and some disadvantages (increased memory bandwidth due to multiple render targets, inability to handle transparency, anti-aliasing, etc.)

Read the rest of this entry »

Category:

Deferred Shading, DirectX

4 Comments

Tagged with:

WebGL Anaglyph 3D using Three.js

June 1, 2011

I have been meaning to get into WebGL for a while, and a few days ago I discovered this excellent WebGL library called Three.js on Github.

Someone requested an Anaglyph WebGL Renderer for it, so I thought I might give it a try. After reading up on the code I came up with an example you can find here (NOTE: Works best on latest version of Chrome and Firefox).

The author of Three.js has already fixed my version and incorporated an actual anaglyph renderer into his code. Here is an example.

If you are interested in WebGL development I would recommend checking out Three.js.

Category:

3D, WebGL

5 Comments

Tagged with:

Android OpenGL ES 2.0 – Shadow Mapping

May 20, 2011

NOTE: This tutorial builds up on my previous 2 tutorials: how to setup OpenGL ES 2.0 on Android and how to render to texture.

———————————————————————————————————-
I’ll first link to the apk, source code and the repository:
apk here.
Source code here.
Google Code Repository  here. NOTE: Branch is “shadowMapping”
———————————————————————————————————–

UPDATE:

Thanks to Henry’s comment below I was able to fix most of the artifacts showing up. Turns out I had dithering enabled, so I had to disable it to remove the dithering effect [ GLES20.glDisable(GLES20.GL_DITHER) ]. Updated images below – it works but has very slight artifacts when it comes to the mesh’s self-shadows.

Introduction:

Shadow Mapping is a popular technique for rendering shadows in games and other real-time applications. Given how GPUs on mobile devices (iPhone/Android/whatever) are getting more and more powerful every day I thought I might try implementing it on my Samsung Captivate (Galaxy S).

While my implementation “works”, it does not good look at all. Shadow-mapping is prone to many artifacts , which I wasn’t able to properly fix (UPDATE: Main artifacts fixed).I am posting this without the fix in the hopes that somebody can help me out too as to what I am doing wrong.

Here are the updated images (I changed the color of the plane to get a better contrast):

Textured Cube (with proper shadows)

Dragon Head

Octahedron


Here are the old images:

Octahedron Mesh (.OFF) with shadows + artifacts

Dragon-head Mesh (.OFF)

Textured Cube (.OBJ)

I would like to credit Fabien Sanglard for his shadow mapping tutorials which I used as a basis for my code. I looked at his DEngine code as an example. In any case let’s begin.

What is Shadow Mapping?

If you are reading this chances are that you already know what shadow mapping is and how it works, but let me give a quick overview of the steps involved:

Read the rest of this entry »

Category:

Android, OpenGL

21 Comments

Tagged with:

Android OpenGL ES 2.0 – Render To Texture

May 13, 2011

NOTE: This tutorial builds up on my previous tutorial on how to setup OpenGL ES 2.0 on Android.

———————————————————————————————————-
I’ll first link to the apk, source code and the repository:
apk here.
Source code here.
Google Code Repository  here. NOTE: Branch is “renderToTex”
———————————————————————————————————–

Rendering to a texture is important when it comes to various graphics techniques and algorithms (Shadow Mapping, cube map generation, Deferred Shading, etc.) So this quick tutorial will demonstrate how to setup a texture for rendering (and then how to display that texture on screen).

What is rendered to the texture?
We are going to render the same objects as in the previous tutorial (where you can choose between gouraud/phong/normal mapping shaders). The texture is going to be a simple quad which will then be displayed on the full screen. I have a Samsung Captivate(Samsung Galaxy S) which has a screen resolution of 800 X 480, so I use those values as the height and width of my texture. Adjust accordingly to your phone (I was a tad lazy to read in the values from the system itself). Let’s begin:

Read the rest of this entry »

Category:

Android, OpenGL

13 Comments

Tagged with:

Getting started with OpenGL ES 2.0 shaders on Android

March 13, 2011

Tutorials on how to write shaders for the Android platform are a little difficult to come by on the Internet, so I decided to work on a small but simple program which hopefully provides a simple framework to get started writing programs for OpenGL ES 2.0.

———————————————————————————————————-
I’ll first link to the apk, source code and the repository:
apk here.
Source code here.
Google Code Repository  here. NOTE: Branch is “default”
———————————————————————————————————–

Here’s what my program does:

  • Mesh Loading:The program loads triangular meshes in these formats (as .txt files):
    • (.OFF): These consist of only vertex positions. My program will calculate per-vertex normals.
    • (.OBJ): Vertex positions, normals and texture coordinates are provided. Sample textured cube mesh was exported from Blender.
  • Shaders:
    • Gouraud Shading: Per-vertex lighting [with texture mapping if enabled].
    • Phong Shading: Per-pixel lighting [with texture mapping if enabled].
    • Normal Mapping: Gives a fake appearance of depth to a mesh. Sample normal map included.

NOTE: If your program is crashing with glError 1281 and you have a relatively new phone (a Samsung Galaxy S2 for example), change all dot() method calls in the shaders to dot2().

How it works:

The program will only work if your phone supports OpenGL ES 2.0. If it doesn’t my program quits without a warning.

When the program starts you will see an octahedron mesh with Gouraud shading enabled. There is a light rotating around the mesh. You can use one finger
to rotate the mesh, and two fingers (pinch-to-zoom) to scale the mesh (though it’s not *perfect* ). Clicking the menu button on your phone allows you to:

  • Toggle Light Rotation: Light rotation can be toggled through this option. A short ‘Toast’ notification pops up.
  • Shader switching: Can switch between Gouraud shading, phong shading and normal mapping.
  • Mesh switching: Can switch between an Octahedron, Tetrahedron (both .off files) and Textured Cube Mesh (.obj file).
  • Toggle Texturing: Can turn off texture mapping if there is an associated texture with the object (only the textured cube mesh).


Read the rest of this entry »

Category:

Android, OpenGL

44 Comments

Tagged with:

Microsoft SDK PN-Triangles on Nvidia GTX 480 (Fermi)

August 26, 2010

We just got a Nvidia GTX 480 in our lab. Apparently the PN Triangles example included in the Microsoft DirectX 11 SDK does not work properly, giving an “OUT OF MEMORY” error when run. (insert image)

Here I will post a modification of the code which allows it to run on Fermi

Category:

Uncategorized

1 Comment

Tagged with:

Follow

Get every new post delivered to your Inbox.