PID Project - Part 2: Parallax Mapping

This is the continuation of the previous post, in which an application created for a University subject (Digital Image Processing or PID) was explained.

On the previous post, the Normal Mapping technique was explained, we are going to focus on the other technique implemented now: Parallax Mapping.

The goal of Parallax Mapping is the same as in the previous technique (Normal Mapping): to show in a single polygon (which is in a low polygonation structure) a set of polygons (which are in a high polygonation structure).

Let's remember that a high polygonation models contain more polygons than low polygonation models. That is why a polygon in the second model will represent a set of polygons from the first one. And it must look like that: if the light or the object itself changes, the pixels of that polygon must change showing shadows, etc (as if more than one polygon were there).

With the Normal Mapping technique, the pixels of a polygon behave in the way the normal map indicates them to. A normal map is previously created (ideally out of the high polygonation model, although we have shown in the previous post that it is also possible to obtain from the low polygonation one) and then the technique is applied.

That normal map can be applied to the low polygonation model in different ways. Normal mapping assigns to each pixel of the polygon, a pixel from the normal map. So, pixels in the polygon are not changing their position, they are changing their colour (to show differences in the light when the object or focus are moved). This way a pixel in the polygon always has a matching (or equivalent) pixel on the normal map.


However, if the camera is really close to the polygon, or the angle between the camera and the polygon is almost 0, then the polygon doesn't look like a set of polygons. This is resolved in the Parallax Mapping technique.

This technique not only changes the colour of each pixel in the polygon, but the position of the pixel too. By doing this, pixels on the polygon move, showing a sense of depth even when the angle is close to 0 or when the camera is really close.

As pixels move, there are gaps between them that must be filled. The parallax mapping technique resolves that too, extending the original pixels and interpolating the ones in between.


In all techniques, the GPU recalculates the information of each pixel every time (in order to work directly with the GPU in XNA is common the use of the HLSL language).

Let's see this technique implemented on the application itself.



This is a slightly different technique from the Parallax Mapping one:


(Read More)

PID Project - Part 1: Normal Mapping

This project was developed in 2008. It was originally created for a subject called "Digital Images Processing", additionally, it was submitted to a contest between the best university projects of that year, winning the contest which prize was an Xbox 360 Elite.

The project is a Windows Form application that integrates XNA 3.0. The application shows two techniques normally used in videogames to display 2D scenes as 3D: Normal mapping and Parallax mapping. Additionally, there is a small modification that focuses on the parallax mapping process that allows the user to see the changes made easily.

The first video shows the application itself.


The interesting thing of this application is that it doesn´t need a high polygonation model to extract the normal map and use it on the low polygonation model. The normal map is automatically obtained from the texture map using my own algorithm.

One of the main requisites was that the application must be completely configurable by the user. This was because it would be used as a educative application.

Firstly, I will show the normal mapping technique using normal maps obtained from the high polygonation model and from the texture map. In the next post, the Parallax mapping technique will be shown.

Part 1 (Normal Mapping - Parameters Explanation):


Part 2 (Normal Mapping - Examples):

(Read More)

Master's Degree Final Thesis - Part 2: Ninja Tales 3D

This post is the continuation of the final thesis of 2007/2008 academic year. For more information, see first post.

This second part is focused on the 3D side of the game.

Again, since it is a proof of concept developed for a degree with a really technical background, features such as the story, music or graphic design were not contemplated.

The video begins with the characters entering a city. In this town everything has been designed manually, implementing various 3D techniques (detailed at the end of this entry).

The characters can perform various actions in the cities.



The actions performed in the video are the following:
- Talk to various characters in the game (such as turtles or people).
- Collect equipment (such as the jacket that is taken from the ground).
- Collect objects to be used once they are equipped (as the book picked up from the shelf inside the house).
- Activation / deactivation of second player (The relative movements of both characters can be seen when the screen is split).
- Use of certain objects (throwable weapons that can be seen on both screens, objects that potentiate skills or healing objects).
- Although the battles were not fully developed, a random battle system was implemented, as well as the appearance of random scenarios and enemies on the battlefields).

The techniques used in 3D are the following:
- Inclusion of 2D images in 3D design.
- SkyBox.
- Insertion of rugged terrain based on a terrain map.
- Camera tracking for each character.
- Insertion of static models. These models may or may not be animated or be able to move.
- Control of collisions.
- Use of various character animations (such as hit, jump, bend, etc.).
- Collect items and store them in various places (depending on the type of object).
- Been able to use absolute objects (such as potions that always increase the same amount of life) or relative (elements that rise a certain percentage given a current level of a certain skill).
- 3D throwable objects.
- Tracking mode of the second character.
- Enable/Disable of the second character.
- Split screen mode.

(Read More)

Master's Degree Final Thesis - Part 1: Ninja Tales 2D

This project was presented as a final thesis in the academic year of 2007/2008.

The project consisted of two parts:
- A proof of concept of a RPG videogame in 2D and 3D. This game was developed for the Xbox 360 and PC.
- A hardware device that has a connection to the XBOX 360 platform, which allows the player to use the Wii remote as a game controller (given its versatility and easy handling).

This entry is focused on the 2D side of the game. Since it is a proof of concept developed for a degree with a really technical background, features such as the story, music or graphic design were not contemplated.

The game has a 2D map where the character can choose to explore either on foot or by car. When the character is on foot, he won’t walk very fast, and he will encounter random battles with enemies along the way. When the character is driving the car, he will go faster and random battles will not appear.

The character can check out a general map with his position in the world. The battles with the enemies take place in a 3D world and they will not be displayed in this video.

Additionally, the player can configure the two characters of the game (being the blue and the red ninja). They have a basic equipment and objects such as throwable objects or potions.

The basic equipment consists of the three sections below:
- Offensive: Usually weapons of all sorts that enhance the ninja’s offensive ability.
- Defensive: Usually some sort of clothing (jackets or breastplates) that enhances the defensive ability of the character.
- Belt: This special device allows objects to be equipped either from the menu or from the main screen of the game (the belt is on the right hand side). Items such as potions can be use from the menu screen even if they have not been previously equipped.

As there are different kinds of belts, the number of objects that a ninja can equip depends on the number of slots that the equipped belt has. The maximum number of slots possible is six. The objects to be fitted can be of three types:
- Different sorts of healing potions.
- Throwable weapons.
- Potency of some characteristic (such as intelligence, defense, attack, etc.)

The game can only be saved in the map screen (not in cities). The position map is always available doesn’t matter whether the character is inside or outside the car. It shows the position of all elements (not just that of the main character).

The techniques used in 2D are the following:
- Principle of persistence of vision (for animations).
- Principle of relativity (for relative positioning objects).
- Map of inverse collisions (to delimit regions).
- Map of the position of relative objects (such as the car).
- System of randomness to start battles.
- Darkening FADINGS (direct and inverse).
- FADINGS of translation (forward and backward).
- Management of dynamic or static text to make it selectable or disable it.
- Management of games (on PC and XBOX 360) to save or overwrite.
- Ability to change player menu.

(Read More)

Bachelor's Degree Final Thesis - Part 2: Texture Comparison

This project was present with honors in the academic year of 2005/2006 as a final thesis.

For more information about the project and the segmentation process, please read this post

Comparison methods are applied below.

These methods are based on two different studies on this field: the first one is focused on the SVD algorithm and the second on logical operators.

Both methods make the comparison from different points of view. The SVD method focuses on calculating whether or not two images have the same texture. It first executes an exclusion algorithm, and if it is not conclusive, it executes an inclusion one next.


The second method makes the comparison according to different features of the images, such as contrast, roughness, size and regularity of their internal elements. This algorithm does not identify whether two images are the same or different, it analyses their features.


Due to the high complexity and the mathematics component of the project, the algorithms used have not been explained in detail. To learn more, read the documents linked at the begining of this post.

(Read More)

Bachelor's Degree Final Thesis - Part 1: Texture Segmentation

This final thesis was presented with honors in the academic year of 2005/2006 as a final thesis.

It is based on different theorical publications on texture identification and comparison. The algorithms of these publications were implemented with special emphasis on the teaching and learning side, so that the user could set the parameters of the algorithm and investigate the different results obtained.

These publications are below:
- Clustering of singular value decomposition of image data with
applications to texture classification.

- Texture Classification Using Logical Operators

Note: Although the videos are thoroughly discussed, it requires the reading of the publications and a certain level of mathematics to understand them in depth.



This video shows the results of the image segmentation algorithms. The algorithms of the publications were improved by adding:

- The ability to apply colour inversion and black and white filters to images, as well as being able to rotate them.

- The segmentation of the images has not been generated taking only into account the middle row. This row has just been highlighted to generate the graph.

- Mathematical corrections were applied, resulting from the application of the algorithm at a practical level.

- Important results were obtained regarding the segmentation of images by these methods due to the accuracy of the different parameters, which was absent on the publications

(Read More)

Anim Creator

This simple editor solves a XNA issue that has been a problem for developers for quite a while now. When a developer wants to create a 2D animation, the images needed have to be uploaded separately and have to be managed by code (testing the time between two images, their bounding boxes, etc).



With this editor, the user can create directly a file that contains all these information (including the images). This file will be imported to the project using a special importer that has been specifically developed, making the developer's life much easier.

Although the application seems to be really simple, it is intuitive and a time saving tool for developers.

The delivered file has the same structure as all Office 2007 documents (such as .docx files), with which I have worked on by creating customised add-ins according to user requirements.

(Read More)