Thursday, November 21, 2013

WebGL Chrome Experiments using Google's Chrome Browser









Each of these sets of two screenshots come from chrome experiments.  Using WebGL people were able to create these realistic 3d effects and create excellent realistic physics.  The first is an interactive bookshelf with many books to choose from, and each book is totally selectable.  The second is a squishy earth.  You use the moon to squish the Earth around the screen, demonstrating excellent physics.  The final is simply 3d particle effects that you can control the speed and rotation of.  It's a pretty good indicator of how smooth one can make something with WebGL using many many particles (as you can see it held at a steady 60 FPS the whole time).

Thursday, November 14, 2013

Roll Call 11/14

Roll call describing what we were to build!

Final #3: GROUP BUILD PROJECT

















These are the screenshots of the 3d build our class made. As you can see in the second shot, our basic floor plan was being created.  Far off we the garage was being created.  We decided to separate our builds to maximize space used efficiently.  As it was my job to furnish the area, I set to work adding furnishings to the house and exterior.  As the building took shape, I added a dance room to our extra room and added a nice flashy door to it.  further along, we got an above ground pool in, and I added some chairs and some cacti.

The Education Grid

This is a screenshot of the front page of the education grid.  On this page are various facets of said grid.  It includes a brief history of it beginning in 2007.  It shows what legal liabilities they have and the security precautions they take, e.g. the firewall.  It also demonstrates that it is completely open and copyright free to allow for a "Broader Access" to students across a wide range of ages.  Finally it includes links to cross platform support and a library with access to various assets used.  Here is a link to it for you to read for yourself!

Monday, November 11, 2013

Final 5c: MY CUSTOMIZED JAVA GAME

Customized version of the Trick game
Here is a link to my customized version of the trick the turtle game.  Changing the images to the turtle and snakes, I customized their appearance.  Furthermore, I changed the background to a brick to set it apart a little more from the original game.  It is a final exercise from the Immersive Education course that I am taking at Boston College.  The Course is called Discovering Computer Graphics. For details, visit the immersive BC portal at this link!





WORKS IN PROGRESS
______________________________________________



Final 5b: Greenfoot Lettuce and Snake

The game running, and the code associated with said game
Here is a link to my Trick the turtle exercise.  Above is the image of the Trick-The-Turtle game.  This was coded using java.  I used various functions to have the creatures move.  I set the WASD keys to movement using checkKeys, I also threw in a shift to run button.  It is a final exercise from the Immersive Education course that I am taking at Boston College.  The Course is called Discovering Computer Graphics. For details, visit the immersive BC portal at this link!





WORKS IN PROGRESS
_____________________________________________






Final 5a: Greenfoot JoC #4 Finally Some Code!


This image here is a view of the turtle and the code for allowing it to move.  Using javascript and the functions provided with Greenfoot I am able to make the turtle move by calling these functions.  It is a final exercise from the Immersive Education course that I am taking at Boston College.  The Course is called Discovering Computer Graphics. For details, visit the immersive BC portal at this link!





WIP
_____________________________

Thursday, November 7, 2013

Final #2 - Monocular Depth Cues

Tartarus
This is an example of occlusion, a monocular depth cue.  Pictured here, the skull appears closest to us, as it blocks a piece of the rock.  Behind the rock, a small sputter of a fountain can be seen.  Behind both the rock and the fountain, a crate can be seen.  Occlusion creates the feeling of depth by blocking objects behind them.  So, because the skull is closer, it will cover the section of rock, obscuring our view.


bruceopolis
This is an example of size difference, another monocular depth cue.  Pictured here, each pillar to this deck is the same size.  However, because these objects are technically further from one another, the size of each pillar changes as it gets farther away.  Size difference is just that, an object that is far away will appear smaller the further it is.  It is true in the real world; this use of perspective allows a person to perceive a three dimensional picture on a 2d plane.

Skyfall
This is an example of lighting and shading, a monocular depth cue.  Here we see that the objects closest to the light source are very bright, while the indentation in that section shows up very dark.  On it's side there are varying shades of darkness to define a separation of sides, that this pillar is not on a 2d plane.  Lighting and shading works in that, the section of an object closest to the light source appears very bright, and the shading defines the shape of the object.  As in this pillar example, you can see the pillar with an indentation on it, even though it is actually two dimensional.

Near - Dabney
Far - Dabney

Here I used two images to demonstrate texture density, a monocular depth cue. The roof of the building appears very close in the top image, and the tile texture of the roof is very apparent and defined.  Moving further away, this pattern begins to lose some of its defined nature and becomes less apparent as more repeating patterns are visible at once.  So, with texture density, an object must have defined, repeated textures to work well.  When up close, the patterns appear larger, as in this tile example, and grow smaller and less defined as you move further from the object, as from the far tile example.

My Own Build

This is an example of linear perspective, a monocular depth cue.  As you can see in this image, I created two parallel lines of blocks that extend backwards.  As they appear to get further away, it appears they grow closer together.  However, this is a trick of the eyes that is linear perspective.  In a drawing class, to draw images that look three dimensional, the artist begins with setting a horizon line and a vanishing point.  From the vanishing point he or she draws straight lines to outline the shape of the object.  This idea is similar, producing the effect of depth necessary to bring this 2d picture a three dimensional scope.

My own Build

Finally, this is an example of atmospheric perspective, a monocular depth cue.  The safe at the forefront has a very defined shape and color.  The soccer ball in the distance appears to be a blurry dot.  Finally in the rear, a gigantic bookshelf appears barely visible above the horizon.  Creating the idea that the light reflected from each object is dispersed due to atmosphere creates a 3d plane.  Atmospheric perspective works in just that way in the real world.  There, the light reflected from an object becomes dispersed, making the object blurry or hard to see.  Furthermore, the object begins to lose some of its vibrant texture.  Just as in this picture, the safe is clearly black and has a well defined shape.  The soccer ball, while not very blurry, shows extreme distance from the safe.  Finally the giant bookshelf far off in the distance has lost some of its vibrant color, and appears blurrier.




EACH OF THESE IMAGES WERE PROCURED FROM CLOUDPARTY.  You can visit cloudparty for yourself at www.cloudparty.com.  It is a final exercise from the Immersive Education course that I am taking at Boston College.  The Course is called Discovering Computer Graphics. For details, visit the immersive BC portal at this link!

OSGrid Build a Rocket

The building process is very similar to cloud party.  Once I figured out how to actually get to where I could build this came together pretty quickly.  Changed the bottom two textures to water and the top to granite, just to spice up the rocket a little bit.

WebGL Summary

WebGL, also known as Web Graphic Library, is a programming interface that allows a person to render both 3D and 2D graphics in any web browser.  The program offloads the work to the computer's GPU because it is completely integrated.  It is based in Javascript, but the user can input HTML code into the program as well.  This program was created by the Khronos group.  They are a non-profit organization.  They based their program off the OpenGL which uses 3D graphics.  That program was used heavily for computer games in the 90s, because of its ease of use and access.  In 2009, the Khronos group created the standard WebGL to create a standard of rendering on the web that hadn't been seen before.  As mentioned before, WebGL functions in all web browsers.  Because of the creation of the WebGL, websites can create excellent games and render fantastic 3D effects by utilizing the computer's more powerful GPU.

Tuesday, November 5, 2013

Final #4 - MakeHuman



Just throw the sliders all the way.

Fiddled with some of the body settings

Used the micro editor to make scary adjustments.  Also added a sweet afro.

Female version


The dress... doesn't seem to work properly.


These are images of me fiddling with the settings of MakeHuman, a freeware modelling program currently in alpha.  Using various sliders and adjustment tools I created the various body styles, varying lengths and girths of every aspect of the model.  One can alter the length of one or both legs, the arms etc.  The program also allows you to change the expression of the model's face.  It is a versatile tool that helps introduce a person to the aspects of 3d modelling. It is a final exercise from the Immersive Education course that I am taking at Boston College.  The Course is called Discovering Computer Graphics. For details, visit the immersive BC portal at this link!



WORKS IN PROGRESS ETC
_________________________________________________________________________