Making of: big pixel

Introduction. In the last few years its become more and more feasible todo produce 3d browser based games, gracias todo things like papervisión3d and advancements in Adobes flash player, everyones favourite when it comes todo online games and interactive content. The majority of personal computers have a versión of flash player installed, with around 95% having the latest flash player 10, which is great because not everyone wants todo have todownload new plugins todo play your game, the thing is though, in modern console games were all used todo the latest graphics with their High Polygon counts, real time lighting, high resolution textures, píxel Shading and much more. But when it comes todo 3d in flash youre going todo find things Will son start todo lag the more complex you make your scenes, this doesnt have todo be a problem though, here the approach we use at big pixel Studios for our 3d games for you todo think about. When starting out its god todo have an idea of whats going todo be involved in your game. How big is it going todo be? How much is going on? How detailed does it have todo be? Etc, in big pixel racing (and our next 3d game which is Top Secret, so dont tell nobody else.) weve restricted the Camera so it has a fixed view on the in-game world. The Camera can pan and zoom in and out, but because we never rotate the view the 3d objects like buildings and tres can be kept relatively simple in terms of their geometry, and some are almost what you could call 2.5d, todo make up for the Low poly count and lak of special effects we can use in flash, we try todo give our game a quite stylized look instead of going for photorealism. For big pixel racing we went with a 3d retro píxel graphics style, though Thinking about it i would love todo have sen photo realistic dogs driving Cars around a dog versión of Miami, as the meshes we make are so simple a lot of whats going todo get the message across is going todo be the texture map, so i find that is the best place todo start and the most important thing todo think about, your texture map is going todo be a guide todo help you build your Mesh (plus as in this case its going todo be a simple píxel art style texture map so this is quickly becoming the easiest tutorial guide ever).

Archivo adjunto 167808

Though we are able todo use Lots of colours in our texture maps in papervison3d, we have todo remember the final look of our game. As our game has a retro píxel style it was god todo use a limited palette of colours (this is a god thing todo do in artwork in general) and colours that go well with the Ground texture, the Ground texture is something that comes together with the rest of the game objects in code, so i find its useful todo make a Little sample of the Ground texture on a 3d plane just for modeling with. This allows us todo get an idea of how things might look in the finished game as we are modeing, in the bitmap editor of your choice make a small bitmap 50px by 50px. We choose such a small size because it Will help with the píxel art. Were going todo make a smallish square building here, we only ned todo make the texture for two Walls and the rof of our son todo be very square píxel building, as we are going todo reuse the Walls on both sides of our Mesh. In this Little tutorial we are going todo make a small café, its a nice café and the cofe is cheap, though they have ben struggling recently as a large chain has opened down the road and people only want so much cofe in their lives, though we dont ned todo know this plus its a small píxel café and is not real, though lighting effects are posible in papervisión3d we didnt use them in big pixel racing, so when making the texture map for the Walls we made one darker todo make it stand out from the other wall. This darker wall Will be the one we use as the side Walls todo make our Little píxel building stand out, once weve finished our texture map (it didnt take long) i like todo double the size because 50px is small and you might drop it, or it might get lost down the bak of the couch, or the Cat might eat it and the vet bills for hav-ing small bitmaps removed from cats can be very expen-sive. Make sure your bitmap editor of choice hasnt resampled the image when you scale it up, we dont want fuzzy píxeles. Save the new texture map as a (*.png), you can give it a name like cafe_txt, png because that sounds col, now, before we open Blender there is something i must tell you. It was noviembre and i was in the bathrom standing on the toilet hanging a clok on the wall when i slipped hitting my head on the sink. When i awoke i wrote this. Which turned out todo be the enlaces for the 2 plugins that Will help us in Blender. If you dont already have them you should download them now, but i bet you do because everyone does.

Archivo adjunto 167809
When you open Blender there already a Cube, lets call him cubey. Dont bother renaming him i just mean from now on his name is cubey, you can use it when you pass him in the Street. Well use cubey as the Mesh for our really simple building example. First lets make some Ground as it were. Were using Blender 2.46 here. I like todo Split the main 3d área and make the right side the script view then go scripts->image->2d Cutout image importer. Then we can import our flor texture sample so we can get an idea of the flor, we dont have todo worry really about making materiales because this is all done on the flash side, as long and we set up the UV coordinates with the texture map it should be ok. You can make a material in Blender though if you want todo do a test render, we do this todo get an idea of how it Will look by turning of the anti alias-ing then rendering it from a Camera view similar todo the one used in the game. Setting up a Camera like the in-game view is god when you want todo se how your models Will look.

Archivo adjunto 167810

Grab cubey and in Edit Mode lets select his bottom and deleete it, we dont ned todo se cubeys bottom today, no one does. Set the right view todo UV/Image Editor then load the col_txt, png. Then with cubey minus his bottom, still in Edit Mode, Grab a son todo be wall side and hit the u key todo get the UV drop down and then press Unwrap. Now in the UV/Image Editor window go todo UVS->Snap todo píxel. Because our texture map is so small it Will make life simple. Adjust the face-wall in the UV editor and make it fit with the wall on the texture map. Do this todo all of cubey remaining sides one by one, adjusting it until it all fits nicely. That it, that was really simple.

Archivo adjunto 167811

Adjust the Mesh until you are happy with it then go bak into Edit Mode and use convert to triangles so cubey Will export nicely. For things like plants and tres we use 2d planes at slight angles almost parallel todo the Camera, remember if we dont.

Rotate that Camera no one Will know. Then we have a nice and very simple Little scene, you can make a few dif-ferent objects in a similar bien todo make up Street furniture which can be reused.

Archivo adjunto 167812
When you want todo export something, select it and go todo file->export->actionscript 3 class, make sure youve converted todo triangles first though, and remember not todo let your Cat eat bitmaps or meshes because they Will if they can.

Links:
http://wiki.blender.org/index.php/ex...s:py/scripts/i
Mage/import_2d_cutout_images. http://www.rozengain.com/blog/2008/0...n3d-and-Sandy/.

-- IMÁGENES ADJUNTAS --
https://foro3d.com/attachment.php?attachmentid=167808
https://foro3d.com/attachment.php?attachmentid=167809
https://foro3d.com/attachment.php?attachmentid=167810
https://foro3d.com/attachment.php?attachmentid=167811
https://foro3d.com/attachment.php?attachmentid=167812