tag:blogger.com,1999:blog-11090555510367696322024-03-18T12:39:52.552+01:00Xform Game DevelopmentXformhttp://www.blogger.com/profile/11465248769948238845noreply@blogger.comBlogger204125tag:blogger.com,1999:blog-1109055551036769632.post-41026941408197734662013-06-13T13:20:00.000+02:002013-06-13T13:20:25.954+02:00Level Editing in Photoshop<div style="color: #222222; font-family: arial; font-size: small;">
Hi all,</div>
<div style="color: #222222; font-family: arial; font-size: small;">
<br /></div>
<div style="color: #222222; font-family: arial; font-size: small;">
The past few weeks I've been working on a new Rhino Rush game. The original game is a classic platformer where you (a baby rhino) explore a number of stages in order to face a mad baboon at the end.<br />
The new game however will be an "endless platformer" where the main goal is to get as far as possible in one single level. The rhino (player) automatically runs to the right and it's up to the player to jump platforms and avoid hazards. It's a bit comparable to a game like "Jetpack Joyride". </div>
<div style="color: #222222; font-family: arial; font-size: small;">
<br /></div>
<div style="color: #222222; font-family: arial; font-size: small;">
It can be quite hard to design level layouts without knowing for instance how high or far the player actually can jump. You can easily design an impossible level with unreachable platforms or gaps that are too wide to jump.</div>
<div style="color: #222222; font-family: arial; font-size: small;">
<br /></div>
<div style="color: #222222; font-family: arial; font-size: small;">
For this game I made a simple "level editor" in Photoshop where it's easy to check the level for "impossibilities". I should mention that this game is a grid based 2.5D platformer so only the side view is shown what makes it perfect for a Photoshop "level editor".</div>
<div style="color: #222222; font-family: arial; font-size: small;">
<br /></div>
<div style="color: #222222; font-family: arial; font-size: small;">
Before creating the editor I needed to know how high and far the rhino actually jumped so I created some playable mock-up levels just to test and tweak the rhino's jump height and distance. This took some time to tweak but i'ts important to get this right because all the level design will be based on this. </div>
<div style="color: #222222; font-family: arial; font-size: small;">
<br /></div>
<div style="color: #222222; font-family: arial; font-size: small;">
First I needed some visual feedback of the Rhino jump curve in game, we did this by drawing a line at the Rhino's location at each frame.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_G84TWWceysVZz5lQbZnLj9xcE6ibXG6e4qrWyJ-bcHzJdusHNATiXiuY9YeNZNXrerU6bfgSLq1CXTE6frVmoKSLIVWvPUBr_ieW_Vd1RNQVoOP16p7i4t6Q9t6h892uiGgDxTURhjOp/s1600/UnityLines.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_G84TWWceysVZz5lQbZnLj9xcE6ibXG6e4qrWyJ-bcHzJdusHNATiXiuY9YeNZNXrerU6bfgSLq1CXTE6frVmoKSLIVWvPUBr_ieW_Vd1RNQVoOP16p7i4t6Q9t6h892uiGgDxTURhjOp/s320/UnityLines.jpg" height="166" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Jump curve made visible in Unity</td></tr>
</tbody></table>
I took some screenshots and imported these in Photoshop. Because the game is grid based I could easily scale the image to a convenient Photoshop grid and made a "Jump template" as seen in the image below.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdHksm2J5HDyTDbGYXoBTQTPhyMIagbEBxhtl0vfPT30Ru_efr9bgFZv8XEszBmfY4eS6Wd7SpKjERS-1_2cXoMr3_ifBegwV1wfyZDSpBJpVDFQRWxCqTmAC-Bj3z0069fOYk3WacTm9F/s1600/JumpTemplate.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdHksm2J5HDyTDbGYXoBTQTPhyMIagbEBxhtl0vfPT30Ru_efr9bgFZv8XEszBmfY4eS6Wd7SpKjERS-1_2cXoMr3_ifBegwV1wfyZDSpBJpVDFQRWxCqTmAC-Bj3z0069fOYk3WacTm9F/s320/JumpTemplate.jpg" height="166" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">"Jump Template" in Photoshop</td></tr>
</tbody></table>
<br />
This template is a single image which can be moved around the Photoshop file to check distances between platforms and gaps.</div>
<div style="color: #222222; font-family: arial; font-size: small;">
<br /></div>
<div style="color: #222222; font-family: arial; font-size: small;">
Next I inserted images of the level assets like platforms, crates and pickups and created grid based Photoshop Smart Objects of these. Smart Objects are extremely convenient when you need a lot of instances of the same image in a single Photoshop file.</div>
<div style="color: #222222; font-family: arial; font-size: small;">
<br /></div>
<div style="color: #222222; font-family: arial; font-size: small;">
When all this has been set up I only need to snap copies of the level objects on the grid and check with my "jump template" if all platforms etc. are reachable.</div>
<div style="color: #222222; font-family: arial; font-size: small;">
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwlSdloRFdanDAqUBnHgYZD4lfVsgfRFvv01-Fa19b-0F4DUWwJW0tW6NrytNJ4WwB3k__yTNEh8oONHj_kS_ckV8ZbdlhNxYdnApqrz3IF9B-jdjWh551pjNnwU5b46k1_LvIt_2Dlo4d/s1600/PhotoShop.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwlSdloRFdanDAqUBnHgYZD4lfVsgfRFvv01-Fa19b-0F4DUWwJW0tW6NrytNJ4WwB3k__yTNEh8oONHj_kS_ckV8ZbdlhNxYdnApqrz3IF9B-jdjWh551pjNnwU5b46k1_LvIt_2Dlo4d/s320/PhotoShop.jpg" height="119" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">a level design mockup in Photoshop</td></tr>
</tbody></table>
When I'm happy with a level design I save it to an image and use this to create the level in Unity.</div>
<div style="color: #222222; font-family: arial; font-size: small;">
<br /></div>
<div style="color: #222222; font-family: arial; font-size: small;">
<br /></div>
<div style="color: #222222; font-family: arial; font-size: small;">
Cheers,</div>
<div style="color: #222222; font-family: arial; font-size: small;">
Matt</div>
Xformhttp://www.blogger.com/profile/11465248769948238845noreply@blogger.com25tag:blogger.com,1999:blog-1109055551036769632.post-21698037415082747992013-06-05T17:24:00.001+02:002013-06-05T17:32:29.396+02:00Run Hammer Run!!!!<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<span lang="EN-GB" style="color: #444444; font-size: 11.5pt; mso-ansi-language: EN-GB; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-fareast-language: NL; mso-hansi-font-family: Calibri;">Hello everyone, </span><br />
<span lang="EN-GB" style="color: #444444; font-size: 11.5pt; mso-ansi-language: EN-GB; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-fareast-language: NL; mso-hansi-font-family: Calibri;">already level 50 with Burnin Rubber? Beated Super Mud Mania on hard difficulty?<o:p></o:p></span></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<br /></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<a href="http://www.shockwave.com/gamelanding/burnin-rubber-5.jsp"><span lang="EN-GB">http://www.shockwave.com/gamelanding/burnin-rubber-5.jsp</span></a><span lang="EN-GB" style="color: #444444; font-size: 11.5pt; mso-ansi-language: EN-GB; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-fareast-language: NL; mso-hansi-font-family: Calibri;"><o:p></o:p></span></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<br /></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<a href="http://www.a10.com/racing-games/super-mud-mania">http://www.a10.com/racing-games/super-mud-mania</a></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<br /></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<span lang="EN-GB" style="color: #444444; font-size: 11.5pt; mso-ansi-language: EN-GB; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-fareast-language: NL; mso-hansi-font-family: Calibri;">Last couple of weeks I’ve been working on the Hammer game. Been doing all
kinds of stuff, character animation, been working on the level with Joep, did
some weapon related stuff, yeah there will be weapons and explosions again!!!
:D<o:p></o:p></span></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<span lang="EN-GB" style="color: #444444; font-size: 11.5pt; mso-ansi-language: EN-GB; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-fareast-language: NL; mso-hansi-font-family: Calibri;">Ever heard of the M202, well that’s just one of all the weapons that
will be in game. <o:p></o:p></span></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<br /></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<span lang="EN-GB" style="color: #444444; font-size: 11.5pt; mso-ansi-language: EN-GB; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-fareast-language: NL; mso-hansi-font-family: Calibri;">.</span></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<span lang="EN-GB" style="color: #444444; font-size: 11.5pt; mso-ansi-language: EN-GB; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-fareast-language: NL; mso-hansi-font-family: Calibri;"><br /></span></div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_jOn9j_i-pIBkKJUPNUVPywUGFI40ZuxSm0aMuiH0ilObKVwg37zTVUCaT87O6aZFhV3nkiyNFBeH2AntzNonzdJaSeyAYwLRo_dJ_8Nv-hzEK7ltZ_YmG91ddRDCVsaxyDvfKx2m4vNq/s1600/WeaponIcons_Texture.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_jOn9j_i-pIBkKJUPNUVPywUGFI40ZuxSm0aMuiH0ilObKVwg37zTVUCaT87O6aZFhV3nkiyNFBeH2AntzNonzdJaSeyAYwLRo_dJ_8Nv-hzEK7ltZ_YmG91ddRDCVsaxyDvfKx2m4vNq/s200/WeaponIcons_Texture.jpg" width="200" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><span style="background-color: white; color: #444444; font-size: 15.555556297302246px; line-height: 20.85069465637207px; text-align: start;">The M202, made by one of our interns</span></td></tr>
</tbody></table>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<span style="color: #444444; font-size: 11.5pt; line-height: 15.65pt;"><br /></span></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<span style="color: #444444; font-size: 11.5pt; line-height: 15.65pt;">Last time I've talked about the Hammer, about symmetry, rigging etc etc. I want
to continue were I left off.</span></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<span lang="EN-GB" style="color: #444444; font-size: 11.5pt; mso-ansi-language: EN-GB; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-fareast-language: NL; mso-hansi-font-family: Calibri;">So the next step is animating the character. <o:p></o:p></span></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<span lang="EN-GB" style="color: #444444; font-size: 11.5pt; mso-ansi-language: EN-GB; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-fareast-language: NL; mso-hansi-font-family: Calibri;">I've been doing all Sorts of animations, run, idle, jump, roll, slide, an sort
of uber uppercut!!<o:p></o:p></span></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<br /></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<span lang="EN-GB" style="color: #444444; font-size: 11.5pt; mso-ansi-language: EN-GB; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-fareast-language: NL; mso-hansi-font-family: Calibri;">Creating a run animation was tricky. It needs to loop perfect, the way
how the body moves during an run, how the arms swing (or not when holding and
aiming with gun), on what frames the feet touch the ground, etc etc. </span><br />
<span lang="EN-GB" style="color: #444444; font-size: 11.5pt; mso-ansi-language: EN-GB; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-fareast-language: NL; mso-hansi-font-family: Calibri;"><br /></span>
<span lang="EN-GB" style="color: #444444; font-size: 11.5pt; mso-ansi-language: EN-GB; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-fareast-language: NL; mso-hansi-font-family: Calibri;">That the feet
touches the ground and stay on the ground can easily be done with planted and sliding
keys. When the feet touches the ground make sure it’s a planted key, then
change it to a sliding key, so it slides nicely over the ground while you
moving your biped up or down. <o:p></o:p></span></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<br /></div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhix1pTaxf4j5Ylk8NPk4zRNkhxR7dsdEBbcLoJfcglyI1dIc2ffq4kcTFDiQky6ik0bBz7k6pkEJXCoRMaejYwwK3mZbctDPGwTrTZbA5cpXkzHHKQp3V4IV_heEpOOruode1WwTx-GWGK/s1600/Keys.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="53" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhix1pTaxf4j5Ylk8NPk4zRNkhxR7dsdEBbcLoJfcglyI1dIc2ffq4kcTFDiQky6ik0bBz7k6pkEJXCoRMaejYwwK3mZbctDPGwTrTZbA5cpXkzHHKQp3V4IV_heEpOOruode1WwTx-GWGK/s320/Keys.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Here you see a part of the run animation. Started with the right foot going down, touching the ground and sliding back as it moves forward, then going up, then that same sequence begin only with the left foot, then right again etc etc. </td></tr>
</tbody></table>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<br /></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<span style="color: #444444; font-size: 11.5pt; line-height: 15.65pt;">So now we have done the running animation, time to add the guns!! We can easily
align those with his hands, with the align tool. </span><span style="color: #444444; font-size: 11.5pt; line-height: 15.65pt;"> </span></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<span lang="EN-GB" style="color: #444444; font-size: 11.5pt; mso-ansi-language: EN-GB; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-fareast-language: NL; mso-hansi-font-family: Calibri;">Then in the schematic view we link those on the hands.<o:p></o:p></span><br />
<span lang="EN-GB" style="color: #444444; font-size: 11.5pt; mso-ansi-language: EN-GB; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-fareast-language: NL; mso-hansi-font-family: Calibri;"><br /></span></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjl16HQ5MWreI6x3igA8H7emI3F-MIUCW6E6MM3qdSvLaZNx1OP8i2Hz5f_lZxKNFZbdTHJ1R7uP5nCM0WexVauKj5LS5XHbAJYh-WUAu81kRr_cSg-gEYYW2jiMCuJx5wprJvnUj3pXZX4/s1600/Linked.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="154" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjl16HQ5MWreI6x3igA8H7emI3F-MIUCW6E6MM3qdSvLaZNx1OP8i2Hz5f_lZxKNFZbdTHJ1R7uP5nCM0WexVauKj5LS5XHbAJYh-WUAu81kRr_cSg-gEYYW2jiMCuJx5wprJvnUj3pXZX4/s320/Linked.jpg" width="320" /></a></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<br /></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<span lang="EN-GB" style="color: #444444; font-size: 11.5pt; mso-ansi-language: EN-GB; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-fareast-language: NL; mso-hansi-font-family: Calibri;"><br /></span></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<span lang="EN-GB" style="color: #444444; font-size: 11.5pt; mso-ansi-language: EN-GB; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-fareast-language: NL; mso-hansi-font-family: Calibri;">If we don’t link the weapons with the hands, they won’t follow the hands
during the animation and just be staying at one point. <o:p></o:p></span></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<span lang="EN-GB" style="color: #444444; font-size: 11.5pt; mso-ansi-language: EN-GB; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-fareast-language: NL; mso-hansi-font-family: Calibri;">When it looks good and the hands are proper animated. Unlink the weapons
again and make it export ready, so it can be placed in game. <o:p></o:p></span></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<br /></div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJeOdlU6LbTnMsk9SriSLZJAUTk6GX2xhUi46GYEuMA5SKNqUP9Zi73YTIykhRsqe4mKn86Rs9_0YZyN_Or109pHBQdz1txHZheuQ9LkJfRKQ3ga_-VIonA0fYMYuRs70gTYDpygr-zV6L/s1600/Untitled-2.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJeOdlU6LbTnMsk9SriSLZJAUTk6GX2xhUi46GYEuMA5SKNqUP9Zi73YTIykhRsqe4mKn86Rs9_0YZyN_Or109pHBQdz1txHZheuQ9LkJfRKQ3ga_-VIonA0fYMYuRs70gTYDpygr-zV6L/s320/Untitled-2.jpg" width="245" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><br /></td></tr>
</tbody></table>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<span lang="EN-GB" style="color: #444444; font-size: 11.5pt; mso-ansi-language: EN-GB; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-fareast-language: NL; mso-hansi-font-family: Calibri;"><br /></span></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<span style="color: #444444; font-size: 11.5pt; line-height: 15.65pt;">That’s all for now, </span></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<br /></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<span lang="EN-GB" style="color: #444444; font-size: 11.5pt; mso-ansi-language: EN-GB; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-fareast-language: NL; mso-hansi-font-family: Calibri;">Hails,<o:p></o:p></span></div>
<div class="MsoNormal" style="background: white; line-height: 15.65pt; margin-bottom: .0001pt; margin-bottom: 0cm;">
<span lang="EN-GB" style="color: #444444; font-size: 11.5pt; mso-ansi-language: EN-GB; mso-ascii-font-family: Calibri; mso-bidi-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-fareast-language: NL; mso-hansi-font-family: Calibri;">Eugene<o:p></o:p></span></div>
<br />
<div class="MsoNormal">
<br /></div>
Xformhttp://www.blogger.com/profile/11465248769948238845noreply@blogger.com11tag:blogger.com,1999:blog-1109055551036769632.post-42283341659459620172013-05-29T09:18:00.001+02:002013-05-29T09:18:51.857+02:00Endless worlds<div class="" style="color: #222222; font-family: arial;">
Two weeks ago, the project I was working on went gold. More about this new release soon, I promise <span style="font-family: Wingdings;">J</span>. So I switched to a new project. The new project which I’m currently working on is all about running in infinity without knowing it! This may sound kind of strange and somewhat impossible (infinity), but in fact it is not that complicated and I’ll try to explain it to you.</div>
<div class="" style="color: #222222; font-family: arial;">
<br /></div>
<div class="" style="color: #222222; font-family: arial;">
The new project will feature you, the player, as a running character through a world that is endless. The world is infinite. We do this by creating a variety of ‘Blocks’ of the world. Think of this as a slice or tile of an environment.</div>
<div class="" style="color: #222222; font-family: arial;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNYLY3BE4cFUaSY5qbUUfW1U8_MI00VTltWmHlqcuuJ1T_VpChdQl1eBgpj_rSX9a3x7PrAdEBAK6EsmRiuQB88engzSEtOFpN-bW51jFhR_1ZJBAbQkFOv5mdzFmgUgtOKfQhPzrhg8dr/s1600/Block.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="243" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNYLY3BE4cFUaSY5qbUUfW1U8_MI00VTltWmHlqcuuJ1T_VpChdQl1eBgpj_rSX9a3x7PrAdEBAK6EsmRiuQB88engzSEtOFpN-bW51jFhR_1ZJBAbQkFOv5mdzFmgUgtOKfQhPzrhg8dr/s320/Block.jpg" width="320" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="" style="color: #222222; font-family: arial;">
Most of the blocks can be placed (snapped) next to each other. We can say that they 'Tile' with eachother. This is possible because the road is always the same width for example. Also, all of the blocks have the same dimensions, this is very important. Creating the blocks this way lets us tile them behind each other seamlessly to create infinite worlds. Well infinite infinite.. More of a repeating world kind of, as you can see here:</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikuVhYv2Yb04W7Sl10k3BPd6CQsT1gBKAM2R5dy6Pma6BiQHKPLdvHT3juSd90Rm0Z_Ba8RDbxCrEfVVTyFWGVffV4ZPnubPVj-P5OgIi2k5qw5paBPiZPqLamjVvANjWbXXzRJXs2k171/s1600/BlocksTiled.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="168" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikuVhYv2Yb04W7Sl10k3BPd6CQsT1gBKAM2R5dy6Pma6BiQHKPLdvHT3juSd90Rm0Z_Ba8RDbxCrEfVVTyFWGVffV4ZPnubPVj-P5OgIi2k5qw5paBPiZPqLamjVvANjWbXXzRJXs2k171/s320/BlocksTiled.jpg" width="320" /></a></div>
<div style="clear: both; color: #222222; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikuVhYv2Yb04W7Sl10k3BPd6CQsT1gBKAM2R5dy6Pma6BiQHKPLdvHT3juSd90Rm0Z_Ba8RDbxCrEfVVTyFWGVffV4ZPnubPVj-P5OgIi2k5qw5paBPiZPqLamjVvANjWbXXzRJXs2k171/s1600/BlocksTiled.jpg" style="color: #1155cc; margin-left: 1em; margin-right: 1em;" target="_blank"><img border="0" height="168" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikuVhYv2Yb04W7Sl10k3BPd6CQsT1gBKAM2R5dy6Pma6BiQHKPLdvHT3juSd90Rm0Z_Ba8RDbxCrEfVVTyFWGVffV4ZPnubPVj-P5OgIi2k5qw5paBPiZPqLamjVvANjWbXXzRJXs2k171/s320/BlocksTiled.jpg" width="320" /></a></div>
<div style="clear: both; color: #222222;">
<span style="color: #222222; font-family: arial;">As you can see in the above image, the world looks pretty repetitive. Which isn't surprising since there just is one block involved to create the</span><span style="font-family: arial;"> above tileset. On the other hand, placing three of the same blocks after one another as a 'section' of the world doesn't feel that strange. I found that moving through three blocks of the same type was actually quite satisfying IF there was some variation after the tileset. It makes it kind of feel walking from one neighbourhood to another.</span></div>
<div style="clear: both; color: #222222;">
<span style="color: #222222; font-family: arial;"><br /></span></div>
<div style="clear: both; color: #222222;">
<span style="color: #222222; font-family: arial;">Next to the city's downtown area we decided it should have some other area's too. We came up with a few and one of them is a subway area. The player runs along the subway's railroad tracks towards.. infinity. The subway area has several blocks ranging from plain straight ones to some which have little subway stations and platforms in them. One good thing of using the subway as a theme for this kind of game is that a subway is quite repetitive from itself already. This makes it feel, and this may sound strange, less repetitive in-game. Since you and me accept it being repetititve </span><span style="font-family: Wingdings;">J</span><span style="color: #222222; font-family: arial;">. </span></div>
<div style="clear: both; color: #222222;">
<span style="color: #222222; font-family: arial;"><br /></span></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTFVU23BqAXEG226SeyIQPTduXnUsRGwfRbIW0-Dk5cN6zigF-2gpGFvhcsyB-2Ppj7XgCgWKw3EA6lYUcX7R7pMrFsePhJX0O464jUn3TIsdkImikSXV42rljaYAmmlvWxe2L2hHcMdAK/s1600/Subway.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="168" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTFVU23BqAXEG226SeyIQPTduXnUsRGwfRbIW0-Dk5cN6zigF-2gpGFvhcsyB-2Ppj7XgCgWKw3EA6lYUcX7R7pMrFsePhJX0O464jUn3TIsdkImikSXV42rljaYAmmlvWxe2L2hHcMdAK/s320/Subway.jpg" width="320" /></a></div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: start;">
<span style="color: #222222; font-family: arial;">This all sounds nice however, a subway and a generic city street don't match up that well, being tiles in our game. Also the subway being underground makes it not logically align with an above ground street. There for we created several 'Transfer' blocks. These blocks are used when we want the player to dive underground into the subway while running on the street for example. The other around visa versa, we need a kind of transfer block to get the player out of the subway back above ground onto the street. </span></div>
<div class="separator" style="clear: both; text-align: start;">
<span style="color: #222222; font-family: arial;"><br /></span></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8vPm8DznS7984i2Gj6jpX5IXvHvS9QV__CQM95cev_ekFcZvUppHgT3rXZ7CXynKnOZGr9J95hCTNnBiuU8TEx8dlZgT637XNwnLprqWHKzC9SD_xGs6jLpsRiapsSGu-1u4i_NTwhy3J/s1600/Transfer.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="175" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8vPm8DznS7984i2Gj6jpX5IXvHvS9QV__CQM95cev_ekFcZvUppHgT3rXZ7CXynKnOZGr9J95hCTNnBiuU8TEx8dlZgT637XNwnLprqWHKzC9SD_xGs6jLpsRiapsSGu-1u4i_NTwhy3J/s320/Transfer.jpg" width="320" /></a></div>
<div class="separator" style="clear: both; text-align: left;">
<span style="color: #222222; font-family: arial;"><br /></span></div>
<div class="separator" style="clear: both; text-align: left;">
<span style="color: #222222; font-family: arial;">To go back to the street from the subway we use a similar transfer block:</span></div>
<div class="separator" style="clear: both; text-align: left;">
<span style="color: #222222; font-family: arial;"><br /></span></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimvk73442zQ4vfkSKQsdEcC2iY7I8ckZCA8L_tOVIRuSvVP2QrRR78OtsKyNxqU_XcdqxT6tWvb0QO5FUVHjuh7TuXcwB232k8_nab7dZ9UBlq_lJmTaeRSrjCacvX3_8FSXMaqSg_BmPH/s1600/Transfer2.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="175" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimvk73442zQ4vfkSKQsdEcC2iY7I8ckZCA8L_tOVIRuSvVP2QrRR78OtsKyNxqU_XcdqxT6tWvb0QO5FUVHjuh7TuXcwB232k8_nab7dZ9UBlq_lJmTaeRSrjCacvX3_8FSXMaqSg_BmPH/s320/Transfer2.jpg" width="320" /></a></div>
<div class="separator" style="clear: both; text-align: left;">
<span style="color: #222222; font-family: arial;"><br /></span></div>
<div class="separator" style="clear: both; text-align: left;">
<span style="color: #222222; font-family: arial;">So now we have our running towards infinity pretty much covered. However this doesn't make it a game yet ;). We decided to place several obstacles along the way for the player to avoid. When the player makes a mistake and hits one it is game over.</span></div>
<div class="separator" style="clear: both; text-align: left;">
<span style="color: #222222; font-family: arial;"><br /></span></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjp5n2gtukNCbphuMmkx5yLnwXrKE8u2jMEiVzR22UyDCDNS-IWUhqVUuhHhfpEWuJaLfVVPdky8sz9fkkVjNO4IBD3Dyl3a6B1E81Ofi_D_jDJHhOB3cyQA-C1AJ6hP00zJTEhH5dAO3_L/s1600/Obstacles.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="134" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjp5n2gtukNCbphuMmkx5yLnwXrKE8u2jMEiVzR22UyDCDNS-IWUhqVUuhHhfpEWuJaLfVVPdky8sz9fkkVjNO4IBD3Dyl3a6B1E81Ofi_D_jDJHhOB3cyQA-C1AJ6hP00zJTEhH5dAO3_L/s320/Obstacles.jpg" width="320" /></a></div>
<div class="separator" style="clear: both; text-align: left;">
<span style="color: #222222; font-family: arial;"><br /></span></div>
<div class="separator" style="clear: both; text-align: left;">
<span style="color: #222222; font-family: arial;">Placing obstacles isn't anything new and fancy. Just place nodes with the corrensponding names of the obstacle you want to put there and voila! The programmers now have their reference points of where to instansiate what object for a player to avoid. But remember.. Our world is infinite.. so how would that work?</span></div>
<div class="separator" style="clear: both; text-align: left;">
<span style="color: #222222; font-family: arial;"><br /></span></div>
<div class="separator" style="clear: both; text-align: left;">
<span style="color: #222222; font-family: arial;">Playing through the same obstacle composition all the time wouldn't be much fun would it? No.. not really. Especially not when every level block tile has the same corresponding obstacle set which doesn't change .Every block would be the same when the player walks through them again, which is boring. Also it wouldn't be possible to make the game harder over time, resulting in the player never dying in the first place if the obstacle sets are too easy. Or it could be the case that the first ever obstacle set which the player encounters is too hard and instantly makes the player go game over.</span></div>
<div class="separator" style="clear: both; text-align: left;">
<span style="color: #222222; font-family: arial;"><br /></span></div>
<div class="separator" style="clear: both; text-align: left;">
<span style="color: #222222; font-family: arial;">The solution we came up with is to create several obstacle sets per block. These obstacle sets are divided in several difficulties ranging from very easy to very hard. The image below shows 3 difficulty sets of obstacles for one block, ranging from easy to hard.</span></div>
<div class="separator" style="clear: both; text-align: left;">
<span style="color: #222222; font-family: arial;"><br /></span></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjB78Fcd789RenWCSs1iV_OD37VC8nUguyBooNqv3E3Y6u4GsJBUqAaB4yWK1DH_P5xei6lPzpQ7fgHP6XFiLYh5wFamv2WqHeWAmuS2leODWxtj8qnZ8h7JYt0EaS0pRXsn3KAPClX9jrY/s1600/ObstacleSets.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="165" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjB78Fcd789RenWCSs1iV_OD37VC8nUguyBooNqv3E3Y6u4GsJBUqAaB4yWK1DH_P5xei6lPzpQ7fgHP6XFiLYh5wFamv2WqHeWAmuS2leODWxtj8qnZ8h7JYt0EaS0pRXsn3KAPClX9jrY/s320/ObstacleSets.jpg" width="320" /></a></div>
<div class="separator" style="clear: both; text-align: left;">
<span style="color: #222222; font-family: arial;"><br /></span></div>
<div class="separator" style="clear: both; text-align: left;">
<span style="color: #222222; font-family: arial;">Now when playing the game, it doesn't really matter what kind of block tile the player encounters first. Since every block has it's own obstacle sets in all difficulties available. It is now possible to start with block A and have it use it's Easy obstacle set. Then move over to let's say block B with an obstacle set in Medium difficulty, keeping the game getting harder in a linear way. After block B we can use block A again but this time using block A's hard difficulty obstacle set.</span></div>
<div class="separator" style="clear: both; text-align: left;">
<span style="color: #222222; font-family: arial;"><br /></span></div>
<div class="separator" style="clear: both; text-align: left;">
<span style="color: #222222; font-family: arial;">If we have enough block sets and enough obstacle sets per block we can make the world feel infinite for the player. We also can have a complete different world combination the next time the player plays it by using a different order of block tiles and obstacle sets. This contributes to the replay value of the game, since the player encounters a lot of variety in gameplay everytime he or she starts the game again.</span></div>
<div class="separator" style="clear: both; text-align: left;">
<span style="color: #222222; font-family: arial;"><br /></span></div>
<div class="separator" style="clear: both; text-align: left;">
<span style="color: #222222; font-family: arial;">Greetings,</span></div>
<div class="separator" style="clear: both; text-align: left;">
<span style="color: #222222; font-family: arial;">Joep</span></div>
<div class="separator" style="clear: both; text-align: left;">
<span style="color: #222222; font-family: arial;"><br /></span></div>
<div class="separator" style="clear: both; text-align: left;">
<span style="color: #222222; font-family: arial;"><br /></span></div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: start;">
<span style="color: #222222; font-family: arial;"><br /></span></div>
<div style="clear: both; color: #222222;">
<span style="color: #222222; font-family: arial; font-size: x-small;"><br /></span></div>
Xformhttp://www.blogger.com/profile/11465248769948238845noreply@blogger.com5tag:blogger.com,1999:blog-1109055551036769632.post-36912228038809641362013-05-22T17:31:00.001+02:002013-05-22T17:45:00.963+02:00Rhino and his friends!<br />
<div class="MsoNoSpacing">
<span lang="EN-US">Hi!<o:p></o:p></span></div>
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
<span lang="EN-US">Today im
going to tell you something about making a Player script that can actually be
used on anything and how to maintain a better view. But first im happy to tell that we are working
on some new projects! Together with Matthew Im working on a spin-off of a game Xform
made 2 years ago. <o:p></o:p></span></div>
<div class="MsoNoSpacing">
<span lang="EN-US">Of course everyone knows this little fellow!<o:p></o:p></span></div>
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
<!--[if gte vml 1]><v:shapetype
id="_x0000_t75" coordsize="21600,21600" o:spt="75" o:preferrelative="t"
path="m@4@5l@4@11@9@11@9@5xe" filled="f" stroked="f">
<v:stroke joinstyle="miter"/>
<v:formulas>
<v:f eqn="if lineDrawn pixelLineWidth 0"/>
<v:f eqn="sum @0 1 0"/>
<v:f eqn="sum 0 0 @1"/>
<v:f eqn="prod @2 1 2"/>
<v:f eqn="prod @3 21600 pixelWidth"/>
<v:f eqn="prod @3 21600 pixelHeight"/>
<v:f eqn="sum @0 0 1"/>
<v:f eqn="prod @6 1 2"/>
<v:f eqn="prod @7 21600 pixelWidth"/>
<v:f eqn="sum @8 21600 0"/>
<v:f eqn="prod @7 21600 pixelHeight"/>
<v:f eqn="sum @10 21600 0"/>
</v:formulas>
<v:path o:extrusionok="f" gradientshapeok="t" o:connecttype="rect"/>
<o:lock v:ext="edit" aspectratio="t"/>
</v:shapetype><v:shape id="Afbeelding_x0020_1" o:spid="_x0000_i1025" type="#_x0000_t75"
style='width:453pt;height:245.25pt;visibility:visible;mso-wrap-style:square'>
<v:imagedata src="file:///C:\Users\Arnold\AppData\Local\Temp\msohtmlclip1\01\clip_image001.jpg"
o:title="RhinoAndRex"/>
</v:shape><![endif]--><!--[if !vml]--><!--[endif]--><span lang="EN-US"><o:p></o:p></span></div>
<div class="MsoNoSpacing">
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEt5n8qOMTwi1hxSiAq4cv2Z_dDdFPXZCe1PZmdDPb7MmWEyZ8wBM901hM5w9Vw5Dz3cC2ompSns4tKWwilGipy44Q6PqjTkfdzgx1cVBvC5lL2Cn-oJO6llFWHJHXJA6A89JDhS-Qbkzf/s1600/RhinoAndRex.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="172" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEt5n8qOMTwi1hxSiAq4cv2Z_dDdFPXZCe1PZmdDPb7MmWEyZ8wBM901hM5w9Vw5Dz3cC2ompSns4tKWwilGipy44Q6PqjTkfdzgx1cVBvC5lL2Cn-oJO6llFWHJHXJA6A89JDhS-Qbkzf/s320/RhinoAndRex.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Rhino with the T-Rex</td></tr>
</tbody></table>
<a href="http://www.blogger.com/blogger.g?blogID=1109055551036769632" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"></a><span lang="EN-US">As you
can see we are making this game in Unity. I've been busy with learning my way
around in Unity cause mainly code in AS3. Luckily the difference between AS3
and C# isn't that big, if I compare it to lingo:)<o:p></o:p></span></div>
<div class="MsoNoSpacing">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEl93Hh_kokSMFopaarIXSWVxRoQ-NfNE7GdtJCqyyZS1qW63LYsW3vHFjxfG-kgddYUoFQ7GoTX1Jm61MaYDBIGrwwWyICtnOjWzrQuahahikKwbk-M8hFYLLYOR0tuvdAQW6p7n90A-o/s1600/RhinoAndRex2.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="173" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEl93Hh_kokSMFopaarIXSWVxRoQ-NfNE7GdtJCqyyZS1qW63LYsW3vHFjxfG-kgddYUoFQ7GoTX1Jm61MaYDBIGrwwWyICtnOjWzrQuahahikKwbk-M8hFYLLYOR0tuvdAQW6p7n90A-o/s320/RhinoAndRex2.jpg" width="320" /></a></div>
<br /></div>
<div class="MsoNoSpacing">
<span lang="EN-US">So when
I started almost a month ago I started programming with the player script. Not
knowing what the project will be about or what the rhino will be doing. So I
started my playerscript, like any other, basic input, assigning a model&materials,
some physics,etc... Just some basic functionality.<o:p></o:p></span></div>
<div class="MsoNoSpacing">
<span lang="EN-US">But then
there was a meeting and we decided that the rhino won't be the only that can be
controlled. So now I know we will be needing a dynamic script for switching the
models/materials/animations. Not that hard, we can set that in its "Init"
function to let it know which prefab it's going to need. These prefabs are perfect for us programmers,
we can drag and drop it to the scene, sets its material, physic collider(box,
sphere, mesh), animation(done by artist), save it as prefab and its ready for
use!</span><br />
<div class="separator" style="clear: both; text-align: center;">
<span lang="EN-US"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBq441N-Emx6-qmkWdJe4TRE7owUFefw4y_AizMm-SxsZuDQN79uxe3SLXoFC7ho1XC2fwBEFggXUQP92kpe9Dno8bf-Kti51fkjGGq-wBZmXxW5pKsgrNzeqIxLvz_K1RE5qynHDPo6ry/s1600/CodeRhino.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBq441N-Emx6-qmkWdJe4TRE7owUFefw4y_AizMm-SxsZuDQN79uxe3SLXoFC7ho1XC2fwBEFggXUQP92kpe9Dno8bf-Kti51fkjGGq-wBZmXxW5pKsgrNzeqIxLvz_K1RE5qynHDPo6ry/s320/CodeRhino.jpg" width="320" /></a></span></div>
<span lang="EN-US"> <o:p></o:p></span></div>
<div class="MsoNoSpacing">
<span lang="EN-US">But what
if all these controllable objects will be having different states or lives,
resets, switches.. <o:p></o:p></span></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://www.blogger.com/blogger.g?blogID=1109055551036769632" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div>
<div class="MsoNoSpacing">
<span lang="EN-US">Now
comes the fun part, at least I like it. We will be needing a BasicPlayerScript that
will handle some basic functionality. <o:p></o:p></span><br />
<br />
<ul>
<li>No hardcoded links to prefabs!</li>
<li>Basic Init, get and set its paramters, and let the specific init handle the rest.</li>
<li>Float function, so we wont have collision all the time to save some performance</li>
<li>Variable movement, every object has its own speed, jump force</li>
<li>Able to receive input and handle input. Create the most common behavior and if a object is going to do something else we can override the function and let it do something else.</li>
<li>State machine! :) Handle the current state. Walk when it needs to walk, wait, jump, die, etc.. Here again, make them very common so when an object needs to do something else let it override the normal one.</li>
<li>Generic stuff.. like changing materials, reset, pickups, and if we need something specific we can easily run its original and add extra functionality if needed</li>
</ul>
</div>
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
<span lang="EN-US">This way
we can easily create objects and let them use this script so we can control it.
Why are we doing this, well, if we want the rhino to run and jump, same goes
for a car, flamingo, rex or whatever we wont need to type or copy paste the
same code over and over. And when an object needs to do something specific,
instead of jumping flying, we can easily adjust in its own script instead of
messing with the basic functionality. </span><br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8nYSnduQLNJ7YmGolll-3SHYUG3GIFDN-7cVsPgduQj27Bqr8AB1chUsTWvKYV2rdWWE0Zo_qnakUGzhwZgbNJxO0MiBjJZcFUrDGuq7JYZIrLDOKULsX12UaKkrS-iWGJq5Uj9JgxFx_/s1600/CodeSideKIck.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8nYSnduQLNJ7YmGolll-3SHYUG3GIFDN-7cVsPgduQj27Bqr8AB1chUsTWvKYV2rdWWE0Zo_qnakUGzhwZgbNJxO0MiBjJZcFUrDGuq7JYZIrLDOKULsX12UaKkrS-iWGJq5Uj9JgxFx_/s320/CodeSideKIck.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><span style="font-size: xx-small; text-align: start;">So when we want a rhino, flamingo or whatever we will create a script that will extend the BasicPlayerScript.</span></td></tr>
</tbody></table>
<span lang="EN-US"><br /></span>
</div>
<div class="MsoNoSpacing">
<span lang="EN-US">This is
something you really want when you are dealing with multiple objects that have
the same functionality. When there is a small adjustment it will be done for
all and if you need a specific adjustment it will done its own script. <o:p></o:p></span><br />
<span lang="EN-US"><br /></span>
<span lang="EN-US">And check out our latest release </span><br />
<span lang="EN-US"><a href="http://www.agame.com/game/super-mud-mania.html">http://www.agame.com/game/super-mud-mania.html</a></span><br />
<span lang="EN-US"><br /></span>
<span lang="EN-US">Greets,</span><br />
<span lang="EN-US">Michael</span></div>
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
<br /></div>
Xformhttp://www.blogger.com/profile/11465248769948238845noreply@blogger.com2tag:blogger.com,1999:blog-1109055551036769632.post-51614123889472714402013-05-15T15:17:00.001+02:002013-05-15T15:17:38.536+02:00The Sound of Music<div align="center">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfxGsw4fPQ7j5ypv2ay1Gdb_4yFeR7KiMcD4RDXfklpYxOwlXpywwhYgedtlrO7iEyxr5IHPgsookxAE2WQZTXVIejLMz-5MyxqfdZSEiYPpa70-s2_ugcC3L1CqU6l59Yx6rPrq2hjhi-/s1600/SoundOfMusicWide.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="120" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfxGsw4fPQ7j5ypv2ay1Gdb_4yFeR7KiMcD4RDXfklpYxOwlXpywwhYgedtlrO7iEyxr5IHPgsookxAE2WQZTXVIejLMz-5MyxqfdZSEiYPpa70-s2_ugcC3L1CqU6l59Yx6rPrq2hjhi-/s400/SoundOfMusicWide.jpg" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div style="text-align: left;">
<span style="font-family: Verdana, sans-serif;"><span style="font-family: Times New Roman;">
</span><span style="font-family: Calibri;">Hi everybody!</span></span></div>
<span style="font-family: Verdana, sans-serif;">
</span><br />
<div style="text-align: left;">
<span style="font-family: Verdana, sans-serif;"><span style="font-family: Times New Roman;">
</span></span></div>
<span style="font-family: Verdana, sans-serif;">
</span><div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Verdana, sans-serif;"><span style="font-family: Calibri;">Melvin here, back for his second Xform blog. This time I'm going
to tell you kids about the creation of music in games, with a small part of
history in game music. </span></span></div>
<span style="font-family: Verdana, sans-serif;">
<div style="text-align: left;">
<span style="font-family: Times New Roman;">
</span></div>
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Calibri;">All games authoring software support wav. Most of them also
support pre-compressed audio files, such as mp3 and ogg vorbis. UDK however only
imports 16 bit WAV files, but compresses them internally using OGG compression
with the ability to tweak the quality/size ration. Unity3D on the other hand
almost imports all audio imaginable and also has the built-in option to
compress audio files (OGG) with quality options.</span></div>
<div style="text-align: left;">
<span style="font-family: Times New Roman;">
</span></div>
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Calibri;">When considering music one of the first question you'll have
to ask yourself is: </span></div>
<div style="text-align: left;">
<span style="font-family: Times New Roman;">
</span></div>
<div align="center" class="MsoNormal" style="margin: 0in 0in 10pt; text-align: center;">
<i style="mso-bidi-font-style: normal;"><span style="font-family: Calibri;">What do you want to do with your music?<o:p></o:p></span></i></div>
<div style="text-align: left;">
<span style="font-family: Times New Roman;">
</span></div>
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Calibri;">Do you just want background music, which plays and loops
till the next level start? In that case we're talking about linear music. Next
to studio recordings of music with real vocalists and musicians, we also have music
created with <strong>DAW</strong> (Digital Audio
Workstation) software such as <i style="mso-bidi-font-style: normal;">Logic Pro</i>,
<i style="mso-bidi-font-style: normal;">Propellerhead Reason</i>, <i style="mso-bidi-font-style: normal;">Ableton Live</i>, <i style="mso-bidi-font-style: normal;">FL Studio</i>. And it's<i style="mso-bidi-font-style: normal;"><strong> </strong></i>somehow still more obvious in the
gaming industry than using recordings. I myself am a big fan of <i style="mso-bidi-font-style: normal;"><strong>Propellerhead
Reason.</strong></i> </span></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMPSJzuVmucIZd0jw-bmz79uHNOlL6JHsM8tcKUOwjKTCBODVQPpsjEsbpp7HJlGwwBpadsCXzmkJFOwan42n9-UpFW2EvVsClvO3GXzS2FNYIwoVbEa5Oidkq460P2uOLlYMU15PT8Z_e/s1600/reason.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="246" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMPSJzuVmucIZd0jw-bmz79uHNOlL6JHsM8tcKUOwjKTCBODVQPpsjEsbpp7HJlGwwBpadsCXzmkJFOwan42n9-UpFW2EvVsClvO3GXzS2FNYIwoVbEa5Oidkq460P2uOLlYMU15PT8Z_e/s400/reason.jpg" width="400" /></a></div>
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
</div>
</span><div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Times New Roman;"><span style="font-family: Calibri;">I've been using it for 12 years now and all the music I
composed for <b style="mso-bidi-font-weight: normal;"><i style="mso-bidi-font-style: normal;">Xform</i></b> are created with <b style="mso-bidi-font-weight: normal;"><i style="mso-bidi-font-style: normal;">Reason</i></b>, including the first <b style="mso-bidi-font-weight: normal;"><i style="mso-bidi-font-style: normal;">Burnin'
Rubber</i></b> (2006) track <b style="mso-bidi-font-weight: normal;"><i style="mso-bidi-font-style: normal;">"Alpha Beta"</i></b>, which was
remixed for <b style="mso-bidi-font-weight: normal;"><i style="mso-bidi-font-style: normal;">Burnin' Rubber 2</i></b> in 2008. This definite version is also heard
in the latest, <b style="mso-bidi-font-weight: normal;"><i style="mso-bidi-font-style: normal;">Burnin' Rubber 5</i></b>.</span></span></div>
<span style="font-family: Times New Roman;">
</span><div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Times New Roman;"><span style="font-family: Calibri;"></span> </span></div>
<span style="font-family: Times New Roman;"><div style="text-align: left;">
<iframe frameborder="no" height="166" scrolling="no" src="https://w.soundcloud.com/player/?url=http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F92302423%3Fsecret_token%3Ds-23o8T" width="100%"></iframe><br />
<iframe frameborder="no" height="166" scrolling="no" src="https://w.soundcloud.com/player/?url=http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F244435" style="height: 214px; width: 100%;" width="100%"></iframe>
</div>
</span><br />
<div style="text-align: left;">
<br />
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Calibri;">Before <b style="mso-bidi-font-weight: normal;"><i style="mso-bidi-font-style: normal;">Reason</i></b>, I used <b style="mso-bidi-font-weight: normal;"><i style="mso-bidi-font-style: normal;">Fasttracker 2</i></b>, a tracker
program for DOS to make music <b style="mso-bidi-font-weight: normal;"><i style="mso-bidi-font-style: normal;">modules</i></b> (mod). <b style="mso-bidi-font-weight: normal;"><i style="mso-bidi-font-style: normal;">Mod</i></b> was a format that
originated from the demo scene in late eighties. Next to <b style="mso-bidi-font-weight: normal;"><i style="mso-bidi-font-style: normal;">MIDI</i></b> this was a format
that was frequently used in games because the files were very small yet
relatively high in fidelity, until mp3 compression became popular. Other games
used music that was on the audio section of the CD-ROM.</span> </div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjM_KhJarJKUv0o3E_Wm0UYXli1KpsEoX3H4AUv9RTA3IfiaNelTBYuHmoJRNmzMJQpg57hJQECnXvqcv5lWX_UOq_aZmyJdIsAf-lrAQ6PmZCwno7O7Jt9nyviMyjCo4G8F9m0t0nW-spt/s1600/fasttracker2.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="250" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjM_KhJarJKUv0o3E_Wm0UYXli1KpsEoX3H4AUv9RTA3IfiaNelTBYuHmoJRNmzMJQpg57hJQECnXvqcv5lWX_UOq_aZmyJdIsAf-lrAQ6PmZCwno7O7Jt9nyviMyjCo4G8F9m0t0nW-spt/s400/fasttracker2.jpg" width="400" /></a></div>
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
</div>
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<i style="mso-bidi-font-style: normal;"><span style="font-family: Calibri;">Interactive soundtrack<o:p></o:p></span></i></div>
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
</div>
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Calibri;">Do you want more complex event triggered music. Layers of
sound fading in and out. Or seamlessly cross fade between a level soundtrack
and a boss soundtrack? In that case it's possible you'll be composing something
that will never sound the way you initially created it, because the player is semi
in charge of the composition.</span></div>
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
</div>
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Calibri;">All major engines (<i style="mso-bidi-font-style: normal;">Unreal
3</i>, <i style="mso-bidi-font-style: normal;">CryEngine</i> and <i style="mso-bidi-font-style: normal;">Unity3D</i>) have <b style="mso-bidi-font-weight: normal;"><i style="mso-bidi-font-style: normal;">FMOD</i></b> integration. <b style="mso-bidi-font-weight: normal;"><i style="mso-bidi-font-style: normal;">FMOD</i></b>
is middleware for managing interactive sound and music. I haven't done much
with it myself. And here at <b style="mso-bidi-font-weight: normal;"><i style="mso-bidi-font-style: normal;">Xform</i></b> most of the music composed here
is for linear use. If there is a demand for interactive music at <b style="mso-bidi-font-weight: normal;"><i style="mso-bidi-font-style: normal;">Xform</i></b>
I'd probably check <b style="mso-bidi-font-weight: normal;"><i style="mso-bidi-font-style: normal;">FMOD</i></b> out, because of the integration in <em>Unity3D.</em> Other interactive sound middleware are for example <em>Miles</em> from<em> Rad Game Tools</em> and<em> Audiokinetic Wwise.</em></span></div>
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
</div>
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Calibri;">The only project where I created an interactive soundtrack was
my own graduation game project back in 2005. I composed the song in <b style="mso-bidi-font-weight: normal;"><i style="mso-bidi-font-style: normal;">Reason</i></b>,
then chopped it in segments and used these segments in a tracker (see <i style="mso-bidi-font-style: normal;">Fasttracker 2</i> above) to create a mod
with 52 separate channels. Events in the game activated or deactivated channels,
which resulted in a varied soundtrack consisting of a nice blend of
instruments. This is one of the simplest form of interactive music, which is
also used in classics such as <em><strong>Super Mario World</strong></em> (when Mario rides on Yoshi's back).</span></div>
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
</div>
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Calibri;">In my next blog I'm going to write about composing in Reason
and you'll be hearing music excerpts of a new Xform game.</span></div>
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
</div>
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Calibri;">Till next time!</span></div>
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Calibri;">Melvin</span></div>
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
</div>
</div>
Xformhttp://www.blogger.com/profile/11465248769948238845noreply@blogger.com11tag:blogger.com,1999:blog-1109055551036769632.post-77052690597259159272013-05-07T17:29:00.002+02:002013-05-07T17:29:41.418+02:00Dealing with slow performanceDear readers,<br /><br />This week I'll talk about slow performance and how we deal with it.<br />Suppose at some point during game development you're playing the game and it starts running slow, big frame drops. The first thing you should pay attention to is what you did to reach this point. Then try to reproduce it. Sometimes it's a freak incidence and you won't be able to reproduce it as it may not be a problem with your game but rather with windows or the game development program (luckily these occurrences are rare). Ok, so you've go a reproducible moment in which the game starts running slow. Now what?<br /><br />First diagnose! To determine the source of the problem you can:<br />- Go through the latest changes that have been made and assess whether these might be the source of the problem. In some cases you won't be able to see anything that should lead to this problem. That's because your changes usually have side effects and so the performance drop might occur somewhere else in the code. It can also happen that this problem was actually always there but has never been noticed before.<br />- Use a profiler. Unity for example has a handy built-in profiler that allows you to see how much time is spend in what areas.<br />- If you don't have a profiler, you can also use time to measure how much time is taken for certain functions.<br />- Comment pieces of code until it is running smoothly again. From there you can usually check the commented code and find the problem.<br />- Debug using breakpoints. This allows you to go through the code at run-time step by step allowing you to see what exactly is happening. I usually consider this to be a last resort and I barely ever have to use it. It may however prove handy when debugging complex code.<br />
<br />
<table cellpadding="0" cellspacing="0" class="tr-caption-container" style="float: left; margin-right: 1em; text-align: left;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCrHacFTQbZANDbjp7CTOl49RBxZZZ2hPbXVqj7oA3GPUDDLE0L9ZfzzGyyCeBjyXU_5kb0cKRe8bl2jkm7HH88vP2pG8EsTco3YIwBUGilFWeelAU9pQsA_mMm3pTrEoPlb1UZu1CKzpm/s1600/UnityProfiler.png" imageanchor="1" style="clear: left; margin-bottom: 1em; margin-left: auto; margin-right: auto;"><img border="0" height="240" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCrHacFTQbZANDbjp7CTOl49RBxZZZ2hPbXVqj7oA3GPUDDLE0L9ZfzzGyyCeBjyXU_5kb0cKRe8bl2jkm7HH88vP2pG8EsTco3YIwBUGilFWeelAU9pQsA_mMm3pTrEoPlb1UZu1CKzpm/s400/UnityProfiler.png" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">The Unity profiler, showing you how much time is spent in each area. (Click to enlarge)</td></tr>
</tbody></table>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
Now solve it! So you've found the source of the problem, what you can do now:<br />- It may be inefficient coding. For instance looking up objects in the scene every frame when you can just as well look it up once and store a reference to the object. So optimize!<br />- If you cannot optimize anymore, you could consider faking the effect you're trying to achieve. Many games fake a lot of effects and it's not even noticeable for most players.<br />- If you cannot optimize anymore, you can use a different calculation that approximates the effect. While less accurate it may still prove acceptable.<br />- If you've exhausted all possible options, it may be that what you're trying to achieve is simply not possible. The game design may have to be altered, but this is usually a last resort. Most game designers usually have a fair understanding (or at least should have) of what is possible and what is not. Also most programmers will pick up on computational complexity when reading the game design and discuss it.<br /><br />As an example I recently had a problem with performance in which the game started running slow when there were too many enemies of a certain type. I got to the point where the game started running slow and opened the unity profiler (as seen above). Here I quickly noticed that 'ParticleSystem.Update' was taken way too much time per frame (over a 100ms). At the same time I noticed how many particles where active in the scene (see image below). This is usually not so much of a problem for Unity, except that each of these particles had collision with the rest of the world which is quite expensive and unnecessary! The problems really became noticeable when many enemies were throwing these projectiles with particles on them. Artists tend to look at what's cool and so much of how cpu or gpu heavy it is. So in this case the problem was quickly fixed by disabling particle collision. Unfortunately not all performance issues are this easy to solve ;)<br />
<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGfTO830VjQ9BTm2f4H_-_ZxXZD8jpugjEFzjqg7bdIRGLLaggKcQuZvGnyPziYk-P0vtuDW7OeuzTYmKUUV2VVHeHEMTpmMljZSNyzzK2Li70ZK0fmNQ78y-ZmXtL8JX5ww-gceOkhH6g/s1600/Cookies.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="221" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGfTO830VjQ9BTm2f4H_-_ZxXZD8jpugjEFzjqg7bdIRGLLaggKcQuZvGnyPziYk-P0vtuDW7OeuzTYmKUUV2VVHeHEMTpmMljZSNyzzK2Li70ZK0fmNQ78y-ZmXtL8JX5ww-gceOkhH6g/s400/Cookies.png" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">The particles on these cookies were causing slow performance as each particle had collision on objects.</td></tr>
</tbody></table>
-- Stijn<br />Xformhttp://www.blogger.com/profile/11465248769948238845noreply@blogger.com27tag:blogger.com,1999:blog-1109055551036769632.post-527086653855146432013-05-01T18:58:00.000+02:002013-05-01T22:24:58.369+02:00I'm the boss!!<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwH8yPbElo25gGRnlq2FBWwv1hRoiyn8EqUOALiY8mwGxCyrFOXkKWrqyx-URoFWH3KcLrMDB_TRUKuiANvBxCTM4t9iVGVUvL75T_h59rm6_FQneL-Ae5BjxEf6RaAVtCAMj9FcVw61ji/s1600/CrawlerInGame.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="225" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwH8yPbElo25gGRnlq2FBWwv1hRoiyn8EqUOALiY8mwGxCyrFOXkKWrqyx-URoFWH3KcLrMDB_TRUKuiANvBxCTM4t9iVGVUvL75T_h59rm6_FQneL-Ae5BjxEf6RaAVtCAMj9FcVw61ji/s400/CrawlerInGame.jpg" width="400" /></a></div>
<span style="color: #222222; font-family: arial;">Hi there,</span><br />
<div style="color: #222222; font-family: arial;">
<br /></div>
<div style="color: #222222; font-family: arial;">
We've just released <a href="http://www.shockwave.com/gamelanding/burnin-rubber-5.jsp" style="color: #1155cc;">Burnin' Rubber 5</a> (BR5) about a week ago and we're very happy with all the positive feedback it's receiving. We hope all you guys have as much fun playing BR5 as we've had making it! </div>
<div style="color: #222222; font-family: arial;">
Please note this post does contain some BR5 spoilers!!</div>
<div style="color: #222222; font-family: arial;">
<br /></div>
<div style="color: #222222; font-family: arial;">
A while back I <a href="http://xformgamedevelopment.blogspot.nl/2013/01/whos-boss.html" style="color: #1155cc;">posted </a>about the creation of an epic boss for an epic game, now I can tell you it's the final stage/boss for BR5. When writing the post we just started on the 3D models and textures, now that the game is done I can show you a lot more about how we setup the files in 3ds Max. </div>
<div style="color: #222222; font-family: arial;">
<br /></div>
<div style="color: #222222; font-family: arial;">
The final boss/stage is split into three files: one for the environment, one for the skybox and one for the giant boss vehicle we've named "the Crawler". </div>
<div style="color: #222222; font-family: arial;">
<div>
<br /></div>
<div>
<b>The Environment file</b></div>
</div>
<div style="color: #222222; font-family: arial;">
The final battle starts off in the desert where the player approaches the giant Crawler in his car. His first task is to open the rear hatch by destroying two power generators within a time limit. </div>
<div>
<span style="color: #222222; font-family: arial;"><br /></span></div>
<div style="color: #222222; font-family: arial;">
We didn't want to create a huge desert environment and wanted to keep the file and download-size small so we only created a small tile-able desert model. This way it's easy to create an "endless" track.</div>
<div style="color: #222222; font-family: arial;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXgqxMIBmFinf0ddFR_uGPN0JcxazEp9PX5E5qhUAsVI5qntyBvz2G7i4-BdlEBONIJpD5ZRfCyVwonq6sigZhizeN1gJmlsDWJjulw-f5eknMvx2xv28ni0OhqnnIg-bwPHjH2jSgMcGe/s1600/Environment.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="307" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXgqxMIBmFinf0ddFR_uGPN0JcxazEp9PX5E5qhUAsVI5qntyBvz2G7i4-BdlEBONIJpD5ZRfCyVwonq6sigZhizeN1gJmlsDWJjulw-f5eknMvx2xv28ni0OhqnnIg-bwPHjH2jSgMcGe/s400/Environment.jpg" width="400" /></a></div>
<div style="color: #222222; font-family: arial;">
<br /></div>
<div style="color: #222222; font-family: arial;">
Here's an explanation of the markers of the image above.</div>
<div style="color: #222222; font-family: arial;">
<ol>
<li>Total triangle count for the desert environment</li>
<li>A one sided "half pipe" model with a tiling cloud texture applied. In the final boss sequence we scroll this texture to simulate speed.</li>
<li>A dummy object used as a location marker for the game's final credits. Dummy's aren't visible in-game but are only used as reference objects. Dummies don't contain a mesh but do have a position, rotation, scale and can even be animated.</li>
<li>Invisible wall object to prevent the player from going places he shouldn't go. Hidden in game of course.</li>
<li>Tile-able desert mesh</li>
<li>Simple plane with a tiling and scrolling dust texture applied. This creates a simple dust wind effect.</li>
</ol>
</div>
<div style="color: #222222; font-family: arial;">
<b>The Skybox file</b></div>
<div style="color: #222222; font-family: arial;">
The skybox is a very important part of the final scene as it's mostly responsible for the tone and feeling.</div>
<div style="color: #222222; font-family: arial;">
In racing games like BR5 the player doesn't look up and down a lot but mostly into the horizon therefore we've used cylinders for our skyboxes. This way we don't spend texture space on sky areas you'll hardly see and they are also easier to create. :)</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPonLuihbyN567VVv2OBGWH7mhJweM6AGt8WMs-3M3R0_JleH59MXgriMOwMfe-eaTqqMXy-w8oFfYDosr58zmrmw8TUvN_9U8esAldaYnyOk0FcISzpUoL1OWCjbbyszL_gefplx7MvHk/s1600/Skybox.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="307" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPonLuihbyN567VVv2OBGWH7mhJweM6AGt8WMs-3M3R0_JleH59MXgriMOwMfe-eaTqqMXy-w8oFfYDosr58zmrmw8TUvN_9U8esAldaYnyOk0FcISzpUoL1OWCjbbyszL_gefplx7MvHk/s400/Skybox.jpg" width="400" /></a></div>
<div style="color: #222222; font-family: arial;">
<br /></div>
<div style="color: #222222; font-family: arial;">
<ol>
<li>Total triangle count for the skybox</li>
<li>The skybox model</li>
<li>Skybox position dummy</li>
<li>Vertically tiling skybox texture. </li>
</ol>
</div>
<div style="color: #222222; font-family: arial;">
<br /></div>
<div style="color: #222222; font-family: arial;">
<b>The Crawler file</b></div>
<div style="color: #222222; font-family: arial;">
This might be one of the most complex 3D files created in the history of Xform. In the image below you only see the outer shell and objects, there's loads more stuff on the inside.</div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div style="color: #222222; font-family: arial;">
To destroy this beast the player has to enter it through its rear hatch, drive up to the second level, battle four opponents continue to the third level shoot the Crawlers core and jump the exploding vehicle. Meanwhile the crawler's top detaches itself and starts flying. Crazy stuff!!</div>
<div style="color: #222222; font-family: arial;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvJD2iAmCnLD2gHSl4Bzup6vJol10eoy8Y2v1kuHMDft7fZCiEBcDRzlM6WbQqe5sx8d7EpPXtQX0xxdv5vE5gqTh6JpBxHEkjEAyqNgkNLWQ6c3aB4daAeF5nB-7VfvfR5Yecsc64wgVF/s1600/crawler.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="190" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvJD2iAmCnLD2gHSl4Bzup6vJol10eoy8Y2v1kuHMDft7fZCiEBcDRzlM6WbQqe5sx8d7EpPXtQX0xxdv5vE5gqTh6JpBxHEkjEAyqNgkNLWQ6c3aB4daAeF5nB-7VfvfR5Yecsc64wgVF/s400/crawler.jpg" width="400" /></a></div>
<div style="color: #222222; font-family: arial;">
<br /></div>
<div style="color: #222222; font-family: arial;">
Here you can see how we set this file up. Open the above image in a new window to get a better view.</div>
<div>
<ol>
<li><span style="color: #222222; font-family: arial;">Total triangle count for the crusher</span></li>
<li style="color: #222222; font-family: arial;">Crusher 3D model which is constructed of multiple parts. We use a lightmap on the second UVW channel to shade this beast.</li>
<li style="color: #222222; font-family: arial;">A dummy for a pick-up. Which pickup it will be is determined by the dummies name.</li>
<li><span style="color: #222222; font-family: arial;">A position marker to lure the player to this location where it will trigger a cut-scene when driving through. As you might notice the marker and some other objects like the engine flames have a black background. These objects will be set in-game to a different blending mode (additive) which "extracts" the black and makes the rest appear to be glowing.</span></li>
<li style="color: #222222; font-family: arial;">Scrolling arrows to guide the player in the right direction.</li>
<li style="color: #222222; font-family: arial;">This file has about 300 objects which can make it hard to keep track of things. This is why we group everything into layers which can easily be shown and hidden from view.</li>
<li style="color: #222222; font-family: arial;">All scene objects are listed in this window. It's crucial to name every object correctly!</li>
<li style="color: #222222; font-family: arial;">Dummy for a turret position</li>
<li style="color: #222222; font-family: arial;">AI vehicle position dummies</li>
<li style="color: #222222; font-family: arial;">Player respawn position dummy</li>
<li style="color: #222222; font-family: arial;">Al waypoint to guide the opponents through the vehicle</li>
<li><span style="color: #222222; font-family: arial;">An animated cut-scene camera</span></li>
<li><span style="color: #222222; font-family: arial;">The crawlers shadow. Real-time shadow's can cut heavily in the game's performance, this is nothing more then a simple texture of the crawlers shadow on a 3D plane. This plane will hoover just above the desert floor.</span></li>
<li style="color: #222222; font-family: arial;">The tracks. This isn't a complex animated mesh but just a small tile-able scrolling texture which give the impression of moving tracks.</li>
<li style="color: #222222; font-family: arial;">Invisible wall to prevent the player form going past the sides of the crawler.</li>
</ol>
</div>
<div style="color: #222222; font-family: arial;">
I hope you've gotten some insight on how we setup our files here at Xform. If you want to see the crawler in action just take a look at this <a href="http://www.youtube.com/watch?v=LIpG1jhGOio" style="color: #1155cc;">youtube </a>video of one of our players or you can play it yourself <a href="http://www.shockwave.com/gamelanding/burnin-rubber-5.jsp" style="color: #1155cc;">online</a>.</div>
<div style="color: #222222; font-family: arial;">
<br /></div>
<div style="color: #222222; font-family: arial;">
Have fun!</div>
<div style="color: #222222; font-family: arial;">
<br />
Matt</div>
<div style="color: #222222; font-family: arial; font-size: small;">
<br /></div>
Xformhttp://www.blogger.com/profile/11465248769948238845noreply@blogger.com13tag:blogger.com,1999:blog-1109055551036769632.post-18185167670051295842013-04-17T09:18:00.004+02:002013-04-17T09:18:48.236+02:00Distorting pixels<span style="background-color: white; color: #222222; font-family: arial;">Hello everyone!</span><br />
<span style="background-color: white; color: #222222; font-family: arial;"><br /></span>
<span style="background-color: white; color: #222222; font-family: arial;">Today I want to talk about refraction, what it is and how you can use it to enhance special effects in your games. </span><br />
<span style="background-color: white; color: #222222; font-family: arial;"><br /></span>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAJ8FjVh4VpUa_qxFQ7wzdz1ekVoKZmj0FqFaoS7o-yGSqKWfk7Ank4sTnxmQ_NiyVPJxB5FZPJnnlj8ELt1FhZ7Tsz2267sJ11W-7A9i_BoOwtcDsn6umI28bV5X7hi9u4U_a3p5m-u7I/s1600/Refraction.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="195" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAJ8FjVh4VpUa_qxFQ7wzdz1ekVoKZmj0FqFaoS7o-yGSqKWfk7Ank4sTnxmQ_NiyVPJxB5FZPJnnlj8ELt1FhZ7Tsz2267sJ11W-7A9i_BoOwtcDsn6umI28bV5X7hi9u4U_a3p5m-u7I/s400/Refraction.jpg" width="400" /></a></div>
<span style="background-color: white; color: #222222; font-family: arial;"><br /></span>
<span style="background-color: white; color: #222222; font-family: arial;"><br /></span>
<span style="color: #222222; font-family: arial;">In the image above, you can clearly see that the pixels are distorted, they are not rendered at the place you'd expect them to be. The light seems to bend around something in the 3D world. This is what we call a refraction effect, gamewise. In the real world refraction works a bit more complicated than just pixels being distorted on the screen, but that doesn't matter for now. I think you can clearly see the point of what I'm trying to explain from the image.</span><br />
<span style="color: #222222; font-family: arial;"><br /></span>
<span style="color: #222222; font-family: arial;">There is a shader involved which renders this effect using simple geometry ( billboarding plane). The shader renders the object as of its 100% transparent. It also renders the object after the first 'transparent object render pass', this is important. In Unity you use the tag ' Tags { "Queue"="Transparent+1"} </span><span style="color: #222222; font-family: arial;">' to achieve this in the shader. </span><br />
<span style="color: #222222; font-family: arial;">However, it also transforms the already rendered pixels behind this piece of geometry according to a normalmap. This all sounds quite complicated just from plain text, maybe some pictures can make it a bit more clear.</span><br />
<span style="color: #222222; font-family: arial;"><br /></span>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7vFuNTf3k4wNUsvEwveeGof8aG4ynF52AFGkLcVFsOlU3jiMM2sohFUOsFLtghmCRsxQKouaubjvc7FVs7mlpLzI4fIC2JeHzWBmsZDiklNe-T7lovik48BnD_ltSd4VE3u29tqjZicLm/s1600/Normal.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="225" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7vFuNTf3k4wNUsvEwveeGof8aG4ynF52AFGkLcVFsOlU3jiMM2sohFUOsFLtghmCRsxQKouaubjvc7FVs7mlpLzI4fIC2JeHzWBmsZDiklNe-T7lovik48BnD_ltSd4VE3u29tqjZicLm/s400/Normal.jpg" width="400" /></a></div>
<span style="color: #222222; font-family: arial;"><br /></span>
<span style="color: #222222; font-family: arial;">The above image shows you schemetically what normally happens during rendering without any refraction effect applied. As you can see every geometry is being rendered using its material onto the screen, nothing fancy. </span><br />
<span style="color: #222222; font-family: arial;"><br /></span>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvsfPPMFWrdxG9prP0kmbtLT9QCjfIGGBAi49W176C18C_T69-r-Im2aZwn4owKW0z1KIw3gkX8XnEjghcYViPFbwgnaxarTrjVYDBicvYfcT6nXSmrYgoRb4euFL-h0r_DdrkxSqddutK/s1600/Refracted.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="225" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvsfPPMFWrdxG9prP0kmbtLT9QCjfIGGBAi49W176C18C_T69-r-Im2aZwn4owKW0z1KIw3gkX8XnEjghcYViPFbwgnaxarTrjVYDBicvYfcT6nXSmrYgoRb4euFL-h0r_DdrkxSqddutK/s400/Refracted.jpg" width="400" /></a></div>
<span style="color: #222222; font-family: arial;"><br /></span>
<span style="color: #222222; font-family: arial;">The second image shows you what the refraction shader is doing to the already rendered pixels using the simple billboarding plane geometry and it's normalmap texture.</span><br />
<span style="color: #222222; font-family: arial;"><br /></span>
<span style="color: #222222; font-family: arial;">This render techinique can be used to enhance your special effects. For example to visualize a shockwave moving through the world coming from a big explosion. Or a heat effect, wich makes the light 'ripple' in front of the viewer's eyes.</span><br />
<span style="color: #222222; font-family: arial;"><br /></span>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYOm3aAtTiARHJVk2VPz8aeILLnm9JE_qYWS5dGD52ULtm6NgDkF4iKlbMIueIOQpz4ktzRd5ytdkkIEIL4rmxsmNscwfQ3jEbk5ZM3F8iiHFyb93t2k4rmqFtw6IX2bgWdXZ6RvfU5mcm/s1600/Explosion.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="193" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYOm3aAtTiARHJVk2VPz8aeILLnm9JE_qYWS5dGD52ULtm6NgDkF4iKlbMIueIOQpz4ktzRd5ytdkkIEIL4rmxsmNscwfQ3jEbk5ZM3F8iiHFyb93t2k4rmqFtw6IX2bgWdXZ6RvfU5mcm/s400/Explosion.jpg" width="400" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div style="text-align: start;">
<span style="color: #222222; font-family: arial;">One big issue with this technique is that you can't fade the refraction effect by default. In the non-refracted shockwave particles I created, I made the particles fade out by altering their alpha values. However this doesn't doesn't affect the normal distortion off course. I fixed this problem by taking the vertex alpha's into the normals calculation of the effect. </span></div>
<div style="text-align: start;">
<span style="color: #222222; font-family: arial;"><br /></span></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWWZLlReoqtjD_KATTjcVhI6tGvE2qGMfjmDKnrP835D2TTQOlbjN2_YPrWat3x_5_3poEGSuatV7LzkQ1FpXpfUsLL5jvz4b23CqwDXBkzChfopzILOICPZYSPOUSIZA3srOTNbY6yyp8/s1600/AlphaInCalculation.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWWZLlReoqtjD_KATTjcVhI6tGvE2qGMfjmDKnrP835D2TTQOlbjN2_YPrWat3x_5_3poEGSuatV7LzkQ1FpXpfUsLL5jvz4b23CqwDXBkzChfopzILOICPZYSPOUSIZA3srOTNbY6yyp8/s400/AlphaInCalculation.jpg" width="400" /></a></div>
<div style="text-align: start;">
<span style="color: #222222; font-family: arial;"><br /></span></div>
<div style="text-align: start;">
<span style="color: #222222; font-family: arial;"><br /></span></div>
<div style="text-align: start;">
<span style="color: #222222; font-family: arial;">During the lifetime of a shockwave particle, it's alpha decreases from 1.0 to 0.0. I multiply this value by the normals I get from the refraciton normalmap. Less alpha means less distortion, which makes the effect able to fade in/out.</span></div>
<br />
<br />
<span style="color: #222222; font-family: arial;">When taking this technique several steps further you could combine it with reflection to create realistic looking water reflections and distortions.. the possibilities are endless :) !</span><br />
<span style="color: #222222; font-family: arial;"><br /></span>
<span style="color: #222222; font-family: arial;">Greetings,</span><br />
<span style="color: #222222; font-family: arial;">Joep</span><br />
<span style="color: #222222; font-family: arial;"><br /></span>
<span style="color: #222222; font-family: arial;"><br /></span>
<span style="color: #222222; font-family: arial; font-size: x-small;"><br /></span>Xformhttp://www.blogger.com/profile/11465248769948238845noreply@blogger.com7tag:blogger.com,1999:blog-1109055551036769632.post-47874641422440776012013-04-11T08:52:00.000+02:002013-04-11T08:52:31.033+02:00Recycle for a better game environment!<br />
Hi!<br />
Today some news about a new game! Just like Eugene im working on a new project as well!<br />
And I am going to tell you a technique to reduce the memory usage by recycling objects.<br />
<br />
In this game we are re-using a lot of objects during the game. Like in every other game but this time we are re-using it at the time we are not using it any more. So when we are following a path, we pass numerous objects. Once we pass them we will recycle it and not destroying it. We set it to the next possible spot. This way we won't need to delete it and create it again.<br />
Just a quick reset of its variables and visuals and then set it again for another use! A very nice way of recycling!<br />
<table cellpadding="0" cellspacing="0" class="tr-caption-container" style="float: right; margin-left: 1em; text-align: right;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEge3vavytDnhblg00Yb3HnspxRgZPHJqGOinwkKYcit_s5IqpjZNl1HR1cX0ZHLUkYkT6vpVTwGOU-6aZJULnBQ51pGrEh9wcWT_KGel0CHn3cGRNF2EtjjXWu1yPyip9sRL7cR72VCq4yE/s1600/LevelNotModified.jpg" imageanchor="1" style="clear: right; margin-bottom: 1em; margin-left: auto; margin-right: auto;"><img alt="" border="0" height="180" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEge3vavytDnhblg00Yb3HnspxRgZPHJqGOinwkKYcit_s5IqpjZNl1HR1cX0ZHLUkYkT6vpVTwGOU-6aZJULnBQ51pGrEh9wcWT_KGel0CHn3cGRNF2EtjjXWu1yPyip9sRL7cR72VCq4yE/s320/LevelNotModified.jpg" title="" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Level unmodified</td></tr>
</tbody></table>
<br />
Well this sounds very promising but we need to cooperate with the artist for this. Normally u want to place all these objects in Max and export it the normal way. But since we are recycling all of those objects we don't want a normal export. The export we want, to save some memory and size, has to be modified.<br />
<br />
<br />
<br />
<br />
Their are some things we need to know of that model, name, position, scale and rotation. So its name and transform. This can be done in several ways without actually exporting the models. Write all of its data to a text file or replace the model with a dummy and give it the same properties. There are several other ways but we are going to use the dummies. To do this we are using a max script that will search through the scene and replace all the models with dummies.<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0JC4fFFnJ2nVcLb5C2EnbaZZvVhUdrUfwqCt9_pheJ3DtbC7n2Nmj_mBp_mtIvgwQuafm2FQekKWxnWVdk1Rq-rNwOJF8Eps2YtEgxrHJLC2JamI0NOQ7EXjvpQ4VnlJIf0qZkUbR05ay/s1600/LevelModified.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="" border="0" height="180" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0JC4fFFnJ2nVcLb5C2EnbaZZvVhUdrUfwqCt9_pheJ3DtbC7n2Nmj_mBp_mtIvgwQuafm2FQekKWxnWVdk1Rq-rNwOJF8Eps2YtEgxrHJLC2JamI0NOQ7EXjvpQ4VnlJIf0qZkUbR05ay/s320/LevelModified.jpg" title="" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Models replaced by dummies</td></tr>
</tbody></table>
<br />
We can then search for the specific dummies and add their transform to a array.<br />
So let's say we want to create different sets of objects we now know the type, position, rotation and scale of that specific object. The next part to make it all work, we need a pool of those object types. For each object type we need an original model so we can clone that and put it in a object pool.<br />
So when we need to create a set of objects we can get it from the pool, get its transform we listed before.<br />
<br />
This can sound a bit weird but it's very useful.<br />
This can actually increase your game's performance if you use the same objects over and over again. Instead of destroying them on the end and allocating new ones later we are now recycling them. So stop wasting the garbage collector with the same stuff over and over again!<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQpcNrwPAd093TOz94CpyJWFp3Q9jel4027HAeirr09xcUua-Yf52iN09x5DeZZoLz5zvy5hagUasx-yn0pTB2CSDZZ1r5S74wemGET4e0v_Mhf7hgj9-0qtZqxOvttAXqr2YdFUcTjLhC/s1600/TruckA.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="" border="0" height="238" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQpcNrwPAd093TOz94CpyJWFp3Q9jel4027HAeirr09xcUua-Yf52iN09x5DeZZoLz5zvy5hagUasx-yn0pTB2CSDZZ1r5S74wemGET4e0v_Mhf7hgj9-0qtZqxOvttAXqr2YdFUcTjLhC/s320/TruckA.jpg" title="" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">In game</td></tr>
</tbody></table>
Greetings,<br />
<br />
MichaelXformhttp://www.blogger.com/profile/11465248769948238845noreply@blogger.com17tag:blogger.com,1999:blog-1109055551036769632.post-61423109403127399942013-04-04T11:18:00.001+02:002013-04-04T11:46:08.285+02:00The Art of Looping<br />
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<b style="mso-bidi-font-weight: normal;"><span style="font-family: Calibri;">The Art of looping<o:p></o:p></span></b></div>
<b style="mso-bidi-font-weight: normal;"><o:p><span style="font-family: Calibri;"> </span></o:p></b><br />
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Calibri;">Hi everybody!</span></div>
<br />
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Calibri;">Melvin here, senior audio designer and animator at Xform for
just about two months now and this my first Xform blog ever.</span></div>
<br />
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Calibri;">Well kids, today I'm going to tell you a story about a thing
called "looping". The reason why I'm going to discuss this is that I
want to show you the relation between sound and movement. And also because this
is something you have to deal with, whether as an audio designer or an
animator.<span style="mso-spacerun: yes;"> </span>In music and sound we use the
word <i style="mso-bidi-font-style: normal;">loop</i> where in animation we often
use the term <i style="mso-bidi-font-style: normal;">cycle</i>.</span></div>
<br />
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Calibri;">They key thought when creating a seamless loop in audio and
animation is that the loop should roughly be like a sine in a graphical
approach. I mentioned roughly because it's not necessary to be as curvy as a <i style="mso-bidi-font-style: normal;">sine</i>. You could see a sine as a drawn
circle, cycle or better yet, a loop in a certain time. We could say we have
come full circle!</span></div>
<br />
<div align="center" class="MsoNormal" style="margin: 0in 0in 10pt; text-align: center;">
<b style="mso-bidi-font-weight: normal;"><i style="mso-bidi-font-style: normal;"><span style="font-family: Calibri;">A sine starts at y=0 and ends at
y=0, the origin. The audio example below consists of two sinuses, thus two
loops or cycles.The red markers indicate where the loop starts and ends.<o:p></o:p></span></i></b></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyF_VVRQiUEC3wH3K4kog5WCZLrpgxRuBRDG0bbWHFf0-tdOHDd-lNWAikVAfr374tPRx70zDL264bekbh8fqviY6sH0-UWzg06u6LDxUiMKFHyYgd0GQAo-8Vo8TEaLGmlFLL6ZbsKIzc/s1600/Sine.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="84" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyF_VVRQiUEC3wH3K4kog5WCZLrpgxRuBRDG0bbWHFf0-tdOHDd-lNWAikVAfr374tPRx70zDL264bekbh8fqviY6sH0-UWzg06u6LDxUiMKFHyYgd0GQAo-8Vo8TEaLGmlFLL6ZbsKIzc/s320/Sine.png" width="320" /></a></div>
<br />
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Calibri;">Avoiding this story to sound as your monday morning
mathclass, I'll just say the more your visual representation of your audio file
or animation resembles a sine, the better your loop will be. Thus, if you want a
flawless loop, your start and end should have the same y-coordinates and the
same angle. The y-coordinate doesn't necessarily need to be 0. <span style="mso-spacerun: yes;"> </span>If you do not do this, your animation loop
will stutter and in case of your audio loop, it will pop and click.</span></div>
<br />
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Calibri;">There are some exceptions in animation where you actually
want mirrored angles. A bouncing ball is an example of that.</span></div>
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
</div>
<div align="center" class="MsoNormal" style="margin: 0in 0in 10pt; text-align: center;">
<b style="mso-bidi-font-weight: normal;"><i style="mso-bidi-font-style: normal;"><span style="font-family: Calibri;">Here is an examples of bad a
loop. (the loop is indicated in blue)</span></i></b></div>
<br />
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrVkqXipq7SaPGc3qNb6H6yRAkm5vZ4AH_9elJYwwUoXDbiQysY_4-OREyLf2uAxwTIyw9iGm5t7CteLqdEW3CjpXdah3nQxepPunGh0JEEnW_9udDJhFL-MVPv2J5Va30VSDwGyWrf_s-/s1600/SineWrongA.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="105" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrVkqXipq7SaPGc3qNb6H6yRAkm5vZ4AH_9elJYwwUoXDbiQysY_4-OREyLf2uAxwTIyw9iGm5t7CteLqdEW3CjpXdah3nQxepPunGh0JEEnW_9udDJhFL-MVPv2J5Va30VSDwGyWrf_s-/s400/SineWrongA.png" width="400" /></a></div>
<span style="mso-no-proof: yes;"></span><br /></div>
<span style="font-family: Calibri;">
</span><br />
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Calibri;">Although the loop start and ends at the same y-value, the
loop will pop because the angles are mirrored.</span></div>
<span style="font-family: Calibri;">
<span style="font-family: Times New Roman;">
</span>3ds Max users know that if you open the Track View - Curve
Editor you will see the graphic representation of your animation. </span><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhD460oxqzzkRwoJvizvLaS70YU83UOhaQaaBjrfIQT3LJtZbvahSt_yFclEiyTTOtK-S1oI05ieQUQOc8ZDyPoCOd1k_33T8d92DQ5ETay4hsiO3Eq7VFaBPcE15UKzMF9Jkpcj_YYHM1z/s1600/CandyRun2.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhD460oxqzzkRwoJvizvLaS70YU83UOhaQaaBjrfIQT3LJtZbvahSt_yFclEiyTTOtK-S1oI05ieQUQOc8ZDyPoCOd1k_33T8d92DQ5ETay4hsiO3Eq7VFaBPcE15UKzMF9Jkpcj_YYHM1z/s1600/CandyRun2.gif" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<br />
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Calibri;">Here is an example of the movement of a biped pelvis in the
animation above. Notice the similarities between this graph and that of the sine
audio example.</span><br />
<span style="font-family: Calibri;"></span><br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkKSORCGcjrWL_TaanjnxUaqwkMXBu7zb-Aa7EkkkUUV-08JlMK0MRjQ5lRCC9qPlXqF2LqmeqvWLuOLaWITxFpUUUdnBbS5KJzdFnK73COmA5GPNmI6h9_iPz-MocEXorvYgH4mc6pKsT/s1600/WalkCycle.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="66" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkKSORCGcjrWL_TaanjnxUaqwkMXBu7zb-Aa7EkkkUUV-08JlMK0MRjQ5lRCC9qPlXqF2LqmeqvWLuOLaWITxFpUUUdnBbS5KJzdFnK73COmA5GPNmI6h9_iPz-MocEXorvYgH4mc6pKsT/s400/WalkCycle.png" width="400" /></a></div>
<span style="font-family: Calibri;"></span><br />
<span style="font-family: Calibri;">Of course in real life sound isn’t just one sine and neither
do all of we have the same walk cycle. Otherwise everything would be monotonous
and boring.<span style="mso-spacerun: yes;"> </span>If we look at a more complex
audio loop such as this lava audio loop, we can see all of different sorts of
sinuses. This gives the sound authenticity. </span></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhxpkfyq0muQzw142PDcbexOS-qHuM4L4KGjO9UDY_6gf0HuGTPzau1r-fy8kVg3FqikrJHauvVe36hYLKNfyFd7v6KHzmKKKVO4tgqQKQ3pfdzKlsZcB2Iic-dzSUlht0XNw7Oxo2P9kZV/s1600/LavaLoop.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="216" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhxpkfyq0muQzw142PDcbexOS-qHuM4L4KGjO9UDY_6gf0HuGTPzau1r-fy8kVg3FqikrJHauvVe36hYLKNfyFd7v6KHzmKKKVO4tgqQKQ3pfdzKlsZcB2Iic-dzSUlht0XNw7Oxo2P9kZV/s400/LavaLoop.png" width="400" /></a></div>
<span style="font-family: Calibri;"><embed autostart="False" height="60" loop="TRUE" src="http://www.elektrafungi.com/www/Lava_SFX.wav" width="144"></embed><br />
</span><span style="font-family: Calibri;"><span style="mso-spacerun: yes;">
<b style="mso-bidi-font-weight: normal;">Importing files<o:p></o:p></b><br />
<span style="font-family: Times New Roman;">
</span><br />
</span></span><span style="font-family: Calibri;"><span style="mso-spacerun: yes;">I always save my sounds as wav files, and consider them as
my master source files, which I can encode to other formats such as ogg, wma or
mp3. I try to avoid saving to mp3 because of the problem, that mp3 encoding
places several frames of silence at the start and end of the waveform, which
makes looping impossible. The way Unity3d handles audio files is actually quite
nice. You can import wav files and choose in Unity3d how it handles its audio files.
It also ogg-vorbis compression to keep your final file small.</span></span><br />
<br />
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Calibri;"><span style="mso-spacerun: yes;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: x-small;">
</span><span style="font-family: "Calibri","sans-serif"; font-size: 11pt; line-height: 115%; mso-ansi-language: EN-US; mso-ascii-theme-font: minor-latin; mso-bidi-font-family: "Times New Roman"; mso-bidi-language: AR-SA; mso-bidi-theme-font: minor-bidi; mso-fareast-font-family: Calibri; mso-fareast-language: EN-US; mso-fareast-theme-font: minor-latin; mso-hansi-theme-font: minor-latin;"><span style="font-family: Verdana, sans-serif; font-size: x-small;">So
this is a small portion of what I do at Xform, I hope haven't dozed you off <span style="mso-spacerun: yes;"> </span>to sleep and you can use this in your own
work.</span><span style="font-family: Times New Roman;"> <span style="mso-spacerun: yes;"> </span></span></span><span style="font-family: Times New Roman;"></span></span></span><br />
<span style="font-family: Calibri;">Lets's say goodbye with a seamless loopable track from the forthcoming smash hit </span><br />
<span style="font-family: Calibri;"><strong><em>Burnin' Rubber 5</em></strong>.</span></div>
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Calibri;">Enjoy!</span><br />
<span style="font-family: Calibri;"></span> </div>
<iframe frameborder="no" height="166" scrolling="no" src="https://w.soundcloud.com/player/?url=http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F86324919%3Fsecret_token%3Ds-ub1Jg" width="100%"></iframe>
<br />
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<o:p><span style="font-family: Calibri;"> </span></o:p></div>
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Calibri;">Cheers,</span></div>
<br />
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<span style="font-family: Calibri;">Melvin</span></div>
<br />
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<i style="mso-bidi-font-style: normal;"><o:p><span style="font-family: Calibri;"> </span></o:p></i></div>
<br />
<div align="center" class="MsoNormal" style="margin: 0in 0in 10pt; text-align: center;">
<i style="mso-bidi-font-style: normal;"><o:p><span style="font-family: Calibri;"> </span></o:p></i></div>
<br />
<div align="center" class="MsoNormal" style="margin: 0in 0in 10pt; text-align: center;">
<i style="mso-bidi-font-style: normal;"><o:p><span style="font-family: Calibri;"> </span></o:p></i></div>
<br />
<div class="MsoNormal" style="margin: 0in 0in 10pt;">
<div class="separator" style="clear: both; text-align: center;">
<iframe allowfullscreen='allowfullscreen' webkitallowfullscreen='webkitallowfullscreen' mozallowfullscreen='mozallowfullscreen' width='320' height='266' src='https://www.blogger.com/video.g?token=AD6v5dz9QAo_ZRwZkju9t0e_lShE6zdj2mZcrsIT6L_2k0dEQ6-hcpsdDdCemU_wp_w2keQVwATYyiekFKyNMoofxQ' class='b-hbp-video b-uploaded' frameborder='0'></iframe></div>
<o:p><span style="font-family: Calibri;"> </span></o:p></div>
Xformhttp://www.blogger.com/profile/11465248769948238845noreply@blogger.com1tag:blogger.com,1999:blog-1109055551036769632.post-74642208208391436072013-03-18T11:50:00.001+01:002013-03-18T11:50:24.684+01:00Hammer!!! <br />
<div class="MsoNoSpacing">
<span lang="EN-GB">Hey
everyone!<o:p></o:p></span></div>
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
<span lang="EN-GB">This
week I’m going to talk about the character I've been working on the last couple
of days. <o:p></o:p></span></div>
<div class="MsoNoSpacing">
<span lang="EN-GB">I’m not
going to tell much about the project that I’m working on. One thing I can tell, it has nothing to do with
cars or what so ever. <o:p></o:p></span></div>
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
<span lang="EN-GB">I had to
make a character with the same looks as the main character of the game called “The
Hammer”. This is one of the first games Xform made! <o:p></o:p></span></div>
<div class="MsoNoSpacing">
<span lang="EN-GB"><br /></span></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhohMRBYyLC_ySGbiMf_QeT6kMIGV4qzWE6b9tpqTKhbuL3mtK8-AsLNSqUh2D1sRmbPSqUyT1Jt-zebDmOeJmcERgi5WxwgRwnCkrmS9wc5bsQA7JUXrc2YkzYs75ebDv2bUlhO97dH1uX/s1600/hammer_01.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="300" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhohMRBYyLC_ySGbiMf_QeT6kMIGV4qzWE6b9tpqTKhbuL3mtK8-AsLNSqUh2D1sRmbPSqUyT1Jt-zebDmOeJmcERgi5WxwgRwnCkrmS9wc5bsQA7JUXrc2YkzYs75ebDv2bUlhO97dH1uX/s400/hammer_01.jpg" width="400" /></a></div>
<div class="MsoNoSpacing">
<span lang="EN-GB"><br /></span></div>
<div class="MsoNoSpacing">
<span lang="EN-GB"> </span>So with
that game as my main reference. I started to begin on my character.</div>
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
<span lang="EN-GB">I always
make one half of an object. I do this with almost everything I make, cars,
props, weapons and in this case a character.<o:p></o:p></span></div>
<div class="MsoNoSpacing">
<span lang="EN-GB"><br /></span></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBQ-zy2mVcEt7qvvQ05_CRt_ZrNyXWGSne_-SquaUuG9wWOe0klNqs21mjd23w_QPS1mVXkNz23IU8QBdSlO6jYmnHlDDfeVonpyiS2t655ZKw5lyhiiAs41JaJyQY3zvURjnO-3xJlsA3/s1600/H3.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="171" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBQ-zy2mVcEt7qvvQ05_CRt_ZrNyXWGSne_-SquaUuG9wWOe0klNqs21mjd23w_QPS1mVXkNz23IU8QBdSlO6jYmnHlDDfeVonpyiS2t655ZKw5lyhiiAs41JaJyQY3zvURjnO-3xJlsA3/s320/H3.jpg" width="320" /></a></div>
<br />
During modelling
an object you always want to know how the model will look like in total. For this,
there are several easy methods in 3Ds Max to get that. Personally I always make
an instance of my model. This allows me
to work on one model while the other one also get the same changes. There is
also another tool in 3Ds Max what you can use, called symmetry.<br />
<div class="MsoNoSpacing">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNCmadx293XyK7H6VMXSMVY2fQh02NIOWc1Y3OQc66kv6Xqb1CnxgprEug3H2ODk0nDkHkRMtpfCpZ9dqJJ8uEGpRfkJXx7HYOTyOZeLAS-Co2rqFnYkk4wreXf3Dsy9-SR5vZBLInbE7I/s1600/H2.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="171" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNCmadx293XyK7H6VMXSMVY2fQh02NIOWc1Y3OQc66kv6Xqb1CnxgprEug3H2ODk0nDkHkRMtpfCpZ9dqJJ8uEGpRfkJXx7HYOTyOZeLAS-Co2rqFnYkk4wreXf3Dsy9-SR5vZBLInbE7I/s320/H2.jpg" width="320" /></a></div>
<div class="MsoNoSpacing">
<span lang="EN-GB"><br /></span></div>
<div class="MsoNoSpacing">
<span lang="EN-GB"><br /></span></div>
<div class="MsoNoSpacing">
When I’m
satisfied with my model, I begin to unwrap. After unwrapping is done I attach
the model to the other to get it complete. I do this after unwrapping so I won’t
have to unwrap everything. Now I just have to separate the unwraps of each
other and weld them together. </div>
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
<span lang="EN-GB">After
that I added the biped to my character and used skin to rig him. <o:p></o:p></span></div>
<div class="MsoNoSpacing">
<span lang="EN-GB"><br /></span></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLt_cGK3gogXyR4tOpMbcXKe3ab6C2E0n4pKHyV5Zv-HB9fC_16ZnyloIG43emgRed6jO9cSf-VrSlpZvWNxP-AP3Mtb-L-tbYYVnPmO6c-w7rHOo6t-aL30DR3xYhbsNTi7f3UA7jwc2s/s1600/H3.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="171" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLt_cGK3gogXyR4tOpMbcXKe3ab6C2E0n4pKHyV5Zv-HB9fC_16ZnyloIG43emgRed6jO9cSf-VrSlpZvWNxP-AP3Mtb-L-tbYYVnPmO6c-w7rHOo6t-aL30DR3xYhbsNTi7f3UA7jwc2s/s320/H3.jpg" width="320" /></a></div>
<div class="MsoNoSpacing">
<span lang="EN-GB"><br /></span></div>
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
When the
rig is done, I always make an test animation to check if the character is
rigged well.</div>
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
<span lang="EN-GB">Here is an
example <o:p></o:p></span></div>
<div class="MsoNoSpacing">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLC8sCPPzPYOkYAGHdHJ1YPWw7WeSJ7JUUoQy9coTKYZFJZl2P5w7tzxFgstIrI1KRa-V8cTNkmHV2TCRNSipMZD5GgsLWjpX3LNvt6cqcm-9ea0yNRMvz1g8IR7y7TeheCS5lo8IHCYiZ/s1600/H4.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="171" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLC8sCPPzPYOkYAGHdHJ1YPWw7WeSJ7JUUoQy9coTKYZFJZl2P5w7tzxFgstIrI1KRa-V8cTNkmHV2TCRNSipMZD5GgsLWjpX3LNvt6cqcm-9ea0yNRMvz1g8IR7y7TeheCS5lo8IHCYiZ/s320/H4.jpg" width="320" /></a></div>
<div class="MsoNoSpacing">
<span lang="EN-GB"><br /></span></div>
<div class="MsoNoSpacing">
As you
can see, there is one vertex that is sticking out. Apparently that vertex was
also attached to the Left Upper Arm.</div>
<div class="MsoNoSpacing">
So I select the vertexes that are attached to
the wrong bones and reattach them to the correct bones.</div>
<div class="MsoNoSpacing">
This is easily
done in the skin modifier.</div>
<div class="MsoNoSpacing">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjO6uplzSKNwzF_sJ0nN71gxUEdHakrU8iYA3xAD7THItPaGLtHwIA5eFxsr46x4JDNaAIN1kIrWeqAkPewMpNYWzKxZzzp5NbrCkpizN1RsjUwU-sfhv8xpYYc2DP-F51Qhqf8W1SWYF2P/s1600/h5.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="171" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjO6uplzSKNwzF_sJ0nN71gxUEdHakrU8iYA3xAD7THItPaGLtHwIA5eFxsr46x4JDNaAIN1kIrWeqAkPewMpNYWzKxZzzp5NbrCkpizN1RsjUwU-sfhv8xpYYc2DP-F51Qhqf8W1SWYF2P/s320/h5.jpg" width="320" /></a></div>
<div class="MsoNoSpacing">
<span lang="EN-GB"><br /></span></div>
<div class="MsoNoSpacing">
So after
the Rig is completed I started with my texture.
I’m not going into this. That is for another time.</div>
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
<span lang="EN-GB"> A nice end pose, added some random weapons.
And the deed is done for now! <o:p></o:p></span></div>
<div class="MsoNoSpacing">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgM5bplWxPYryYBOQciJDbdXWBwP235hpKyGn2L5wL1M9t7jN2IJDJ98-kQyE4_XEW5hx9RJuTX0TPSzeskrKrJD02XMxM3RW_gUrjBJpzhxi0RSfeqAsKuqpxsJjzuzQOWM9dZqA5oHRf8/s1600/H6.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="171" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgM5bplWxPYryYBOQciJDbdXWBwP235hpKyGn2L5wL1M9t7jN2IJDJ98-kQyE4_XEW5hx9RJuTX0TPSzeskrKrJD02XMxM3RW_gUrjBJpzhxi0RSfeqAsKuqpxsJjzuzQOWM9dZqA5oHRf8/s320/H6.jpg" width="320" /></a></div>
<div class="MsoNoSpacing">
<span lang="EN-GB"><br /></span></div>
<div class="MsoNoSpacing">
Hails!</div>
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
<span lang="EN-GB">Eugène <o:p></o:p></span></div>
Xformhttp://www.blogger.com/profile/11465248769948238845noreply@blogger.com6tag:blogger.com,1999:blog-1109055551036769632.post-7970524096627403502013-02-22T17:34:00.000+01:002013-02-22T18:01:35.152+01:00Start your weekend with a smile!<div style="text-align: left;">
<span style="font-family: Arial, Helvetica, sans-serif;">Hi all,</span></div>
<div style="text-align: left;">
<br /></div>
<br />
<div style="text-align: left;">
<span style="font-family: Arial, Helvetica, sans-serif;">As much as we like to work hard, we also like to have a good laugh.</span></div>
<span style="font-family: Arial, Helvetica, sans-serif;"><div style="text-align: left;">
This laugh can be brought to us by listening silly songs, telling stupid stories or making wacky sounds ourselves.</div>
<div style="text-align: left;">
But there's another thing that can put a smile on our face: the game comments players add to our games!</div>
</span><br />
<div style="text-align: left;">
<br /></div>
<table cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: left;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirn1VMNdZpFNTmgVl6aP5ip2f2zG3OmjTbuEdAjC4dZQA5kWJBHtfBtda28keA0hHbFlV0W4S8xl0SkJ3AHLvk4T-Wj4kTJCRneSjHuoi1VCoZW8aDQpyLAGu4Z1ExM5y_8SwSHe003VAR/s1600/ShootinCybertrash_Screenshot07.bmp" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="225" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirn1VMNdZpFNTmgVl6aP5ip2f2zG3OmjTbuEdAjC4dZQA5kWJBHtfBtda28keA0hHbFlV0W4S8xl0SkJ3AHLvk4T-Wj4kTJCRneSjHuoi1VCoZW8aDQpyLAGu4Z1ExM5y_8SwSHe003VAR/s400/ShootinCybertrash_Screenshot07.bmp" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">What do players think while playing our games?</td></tr>
</tbody></table>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
<span style="font-family: Arial, Helvetica, sans-serif;"><span style="font-family: Arial, Helvetica, sans-serif;"></span></span><br /></div>
<span style="font-family: Arial, Helvetica, sans-serif;"><span style="font-family: Arial, Helvetica, sans-serif;"></span></span><br />
<div style="text-align: left;">
<div style="text-align: left;">
<span style="font-family: Arial, Helvetica, sans-serif;"><span style="font-family: Arial, Helvetica, sans-serif;">Players just say the funniest things. And we made a small selection for you! </span></span></div>
<div style="text-align: left;">
<span style="font-family: Arial, Helvetica, sans-serif;"><span style="font-family: Arial, Helvetica, sans-serif;"><span style="font-family: Arial, Helvetica, sans-serif;">So sit back... and enjoy!</span></span></span></div>
<div style="text-align: left;">
<span style="font-family: Arial, Helvetica, sans-serif;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div style="text-align: left;">
<span style="font-family: Arial, Helvetica, sans-serif;"><span style="font-family: Arial, Helvetica, sans-serif;">Cheers,</span></span></div>
<div style="text-align: left;">
<span style="font-family: Arial, Helvetica, sans-serif;"><span style="font-family: Arial, Helvetica, sans-serif;">Shirley</span></span></div>
</div>
<span style="font-family: Arial, Helvetica, sans-serif;"><span style="font-family: Arial, Helvetica, sans-serif;">
</span></span><span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<div style="text-align: left;">
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br /></div>
<div style="text-align: center;">
<span style="font-family: Arial, Helvetica, sans-serif;">About <a href="http://www.agame.com/game/katie-commando.html">Katie Commando</a>:</span></div>
<div style="text-align: center;">
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjMk12ZvH7pwK7TMXh0OJnt6XXrI96iDWSqmcgdjMfiLztNfx8b9CRvZf4U_Ip-AU12PDi_yYZgQ-tLvD_D4q-jM487Q_idvH6tCvN3AK5gegngN7m3Qy16xxoIWIAQzd5egUxmB4W5qFY/s1600/KC02.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: left;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjMk12ZvH7pwK7TMXh0OJnt6XXrI96iDWSqmcgdjMfiLztNfx8b9CRvZf4U_Ip-AU12PDi_yYZgQ-tLvD_D4q-jM487Q_idvH6tCvN3AK5gegngN7m3Qy16xxoIWIAQzd5egUxmB4W5qFY/s1600/KC02.png" /></a><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBdB7rfW49jtImCyBzOm7ZEViwvQNzQPTDGCgtyEWjL2ZJZYQjOeowp4gtR9TavZcLsUw4XYgdCf1DeF1SxvY46mKnGiIQ97ScO9MN-XGEy20uHULdPopLaPBq9d9kkfZoQ0ld3T5ktszy/s1600/KC01.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: left;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBdB7rfW49jtImCyBzOm7ZEViwvQNzQPTDGCgtyEWjL2ZJZYQjOeowp4gtR9TavZcLsUw4XYgdCf1DeF1SxvY46mKnGiIQ97ScO9MN-XGEy20uHULdPopLaPBq9d9kkfZoQ0ld3T5ktszy/s1600/KC01.png" /></a><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEim8f9IWyoVXTi3zh6414p0qU7BD9R0ioh9RKTp1hAsQS0UvCorP1ytQhpvHJdlhyZF-xqBxx5MKFNN6Ia5OzQkv7BjLLHTgc6vteJUzOhzezO-_VFtiSgKQm2zP7P4UT9pXVAoTLTSreJk/s1600/KC03.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEim8f9IWyoVXTi3zh6414p0qU7BD9R0ioh9RKTp1hAsQS0UvCorP1ytQhpvHJdlhyZF-xqBxx5MKFNN6Ia5OzQkv7BjLLHTgc6vteJUzOhzezO-_VFtiSgKQm2zP7P4UT9pXVAoTLTSreJk/s1600/KC03.png" /></a></div>
<br />
<div style="text-align: center;">
<span style="font-family: Arial, Helvetica, sans-serif;">About </span><a href="http://www.shockwave.com/gamelanding/go-kart-go-nitro.jsp" style="font-family: Arial, Helvetica, sans-serif;">Go Kart Go! Nitro!</a><span style="font-family: Arial, Helvetica, sans-serif;">:</span></div>
<div style="text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHslh8EZ-Sgp9j8XbZX0bDZ_z574torSfPAhG4Qn5dpKfFzIKDOD4GfSZqu2LsXLA8gP30iZv3-MFYVdBWY8kKMpHji0fy_AjvFEzvq4rpekkmf2ggvUbxNrxBvDRIakuljdOJUlg9iQ4j/s1600/GKGN03.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: left;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHslh8EZ-Sgp9j8XbZX0bDZ_z574torSfPAhG4Qn5dpKfFzIKDOD4GfSZqu2LsXLA8gP30iZv3-MFYVdBWY8kKMpHji0fy_AjvFEzvq4rpekkmf2ggvUbxNrxBvDRIakuljdOJUlg9iQ4j/s1600/GKGN03.png" /></a><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbDQ-_D1GWFEmyL6coUDCBhV1E_TLaUDW0_asXZxpWAHwPt2M0QRG38DrphvkRFbP9wkbpooyu-umg3-PULyk-GjMOsh3RSckH-MG1CcR6QZGCd-Sv1qw6YhITNyjaXnAmb5BYIYPvmoqW/s1600/GKGN02.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: left;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbDQ-_D1GWFEmyL6coUDCBhV1E_TLaUDW0_asXZxpWAHwPt2M0QRG38DrphvkRFbP9wkbpooyu-umg3-PULyk-GjMOsh3RSckH-MG1CcR6QZGCd-Sv1qw6YhITNyjaXnAmb5BYIYPvmoqW/s1600/GKGN02.png" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSZ8VdyAF4CyxzL7UTPSLPP6w5CjIlCFGdFZmrRaAJZQ-eifSUz6h0VH-xgYDFdkLclcQcl-ipZoAigDU-jKrNY5YUeRlkXn4GWe_eBtt7PClO8tyEX2FdI0YZHtbKT_YpxXncgFfag6JZ/s1600/GKGN01.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: left;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSZ8VdyAF4CyxzL7UTPSLPP6w5CjIlCFGdFZmrRaAJZQ-eifSUz6h0VH-xgYDFdkLclcQcl-ipZoAigDU-jKrNY5YUeRlkXn4GWe_eBtt7PClO8tyEX2FdI0YZHtbKT_YpxXncgFfag6JZ/s1600/GKGN01.png" /></a></div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: center;">
<span style="font-family: Arial, Helvetica, sans-serif;">About </span><a href="http://www.shockwave3d.com/index.cfm?category=game&page=852" style="font-family: Arial, Helvetica, sans-serif;">Shootin' Cybertrash</a><span style="font-family: Arial, Helvetica, sans-serif;">:</span></div>
<div style="text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNxcEIucKytsgRmuDHjuUNHul575Wl_6sABPhj-D4RKPBbh4fm1avuXxaY4wImZfP8IoIJPzExgFYF2czvvPDfLSqi1fWjzHxYN8jMcAKMckU8wYOYuoa-PTsQC1drFl0k91L8TZXXPrz9/s1600/SC01.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: left;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNxcEIucKytsgRmuDHjuUNHul575Wl_6sABPhj-D4RKPBbh4fm1avuXxaY4wImZfP8IoIJPzExgFYF2czvvPDfLSqi1fWjzHxYN8jMcAKMckU8wYOYuoa-PTsQC1drFl0k91L8TZXXPrz9/s1600/SC01.png" /></a><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAHfvJgakiH-DCpjJTl1puLbbwUt9Ve3jhNYORMpn92_wT6cD9uatt0aoh3jE7aie4_t69v-2vIMw6hMLV0QjO-T6zCujXb31pEu10hxG-av8r2aqvps2wuJozKH9UJl6Esg1cCv-o6Q6i/s1600/SC03.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: left;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAHfvJgakiH-DCpjJTl1puLbbwUt9Ve3jhNYORMpn92_wT6cD9uatt0aoh3jE7aie4_t69v-2vIMw6hMLV0QjO-T6zCujXb31pEu10hxG-av8r2aqvps2wuJozKH9UJl6Esg1cCv-o6Q6i/s1600/SC03.png" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiLuoxcoOvikgVk2PRTluFcZvnj8zPTzWtc3aCmG8nhYIOvAgQPifdJY3eOCobiBQQ133IltNx2Xn13bifc_p4XGJbu7NjLcyzI6T9pP_q2TqY0_Doq_wlEqaUiJzAhJeAyZxc-qUN1Zsv/s1600/SC02.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: left;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiLuoxcoOvikgVk2PRTluFcZvnj8zPTzWtc3aCmG8nhYIOvAgQPifdJY3eOCobiBQQ133IltNx2Xn13bifc_p4XGJbu7NjLcyzI6T9pP_q2TqY0_Doq_wlEqaUiJzAhJeAyZxc-qUN1Zsv/s1600/SC02.png" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div style="text-align: left;">
<div style="text-align: center;">
<span style="font-family: Arial, Helvetica, sans-serif;">And can you guess the games of these comments?</span></div>
<div style="text-align: center;">
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
</div>
<div style="text-align: left;">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj95jl8wtYt_FrVCPNEW6MfuG8sfFKOJcOIA5guP6gMg9scT-JJqreeC9V0B4p4GvFwyU9uYvOSL2JCkEOcj9HzBlcw8OkM6JONC_emw7ObX_1wDn58H7Wy6BjZ_0UOPOT3LPHpirRzZ4Nx/s1600/FSW01.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: left;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj95jl8wtYt_FrVCPNEW6MfuG8sfFKOJcOIA5guP6gMg9scT-JJqreeC9V0B4p4GvFwyU9uYvOSL2JCkEOcj9HzBlcw8OkM6JONC_emw7ObX_1wDn58H7Wy6BjZ_0UOPOT3LPHpirRzZ4Nx/s1600/FSW01.png" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEix0dCbIGO4Yiz0ldewZN2QNjI3jjbpZSLnxKxpESQmnQxVP5X8_w89gFUvOblvbpUmC0A1iIhgJ_UmnaZ17YSJgpMoRltSWDtB78_xMrVyJHMGfAomisfAix0u-wEVCBUfi7NTGCCjZQre/s1600/AZ01.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: left;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEix0dCbIGO4Yiz0ldewZN2QNjI3jjbpZSLnxKxpESQmnQxVP5X8_w89gFUvOblvbpUmC0A1iIhgJ_UmnaZ17YSJgpMoRltSWDtB78_xMrVyJHMGfAomisfAix0u-wEVCBUfi7NTGCCjZQre/s1600/AZ01.png" /></a><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgL_kLKhQ-nCTpjfkRWrxZf0aQTvHDodRI2kWvJBTe8FomF__amqPEc2mAPp1WfG11w8DWqxFXyUE3kliuPcIzurKoM-Xu7ykrpZpKFSv2pOhug7ke9pBcNS32N2UsD_dUYfJYpgwhA_31I/s1600/RTR01.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: left;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgL_kLKhQ-nCTpjfkRWrxZf0aQTvHDodRI2kWvJBTe8FomF__amqPEc2mAPp1WfG11w8DWqxFXyUE3kliuPcIzurKoM-Xu7ykrpZpKFSv2pOhug7ke9pBcNS32N2UsD_dUYfJYpgwhA_31I/s1600/RTR01.png" /></a></div>
</div>
Xformhttp://www.blogger.com/profile/11465248769948238845noreply@blogger.com7tag:blogger.com,1999:blog-1109055551036769632.post-44268926230700487372013-02-20T17:05:00.000+01:002013-02-21T14:07:41.999+01:00Lightmapped tinting<div id="fb-root">
</div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
Dear readers,<br />
<br />
Today I'd like to explain a technique we're using in our new game considering lighting. It involves using the lightmap to shade models like bullet impacts and characters. A lightmap is actually just another texture applied to a model in combination with the second texture coordinates. The lightmap is blended with the primary texture to obtain a model that is shaded without there being any (hardware) light in the scene. The reason this is done is because it is much faster to render than real-time lighting/shadows. The downside is that it is computed beforehand and so is static (i.e. not real-time). Below you see an example of a scene that uses a lightmap for shading and below that an example of what a lightmap texture looks like.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAUHJFbW-XyQVHkIIui3kHIXFoII4Qlq9dSWihZd9m0yTsarVTPdexP-NaPQ25gB4wf45lgyyx9t4jHazCmf8xhtERY0pmoyvD_AEtjL2J__3JlBpoHs0IDFcaLWflN7fC13zT62nbPcBJ/s1600/LightmappedScene.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="173" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAUHJFbW-XyQVHkIIui3kHIXFoII4Qlq9dSWihZd9m0yTsarVTPdexP-NaPQ25gB4wf45lgyyx9t4jHazCmf8xhtERY0pmoyvD_AEtjL2J__3JlBpoHs0IDFcaLWflN7fC13zT62nbPcBJ/s400/LightmappedScene.jpg" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">An example of a lightmapped scene, notice the shadows of the trees and hills.</td></tr>
</tbody></table>
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhd3ysS4XA-R1_U3t0l53uRQzPMkIQugbNXjpauVhyphenhyphenmHjKyPddX59wzOjPjNTnvCWBEHU5qxNAb__t0P6U1cwWMZ8wc-NXQ2l2ZZAcqRyb8L5ATY2lgPckZyVMYrcVlYVMI-P5oXTgQJ2FD/s1600/LightmapTexture.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhd3ysS4XA-R1_U3t0l53uRQzPMkIQugbNXjpauVhyphenhyphenmHjKyPddX59wzOjPjNTnvCWBEHU5qxNAb__t0P6U1cwWMZ8wc-NXQ2l2ZZAcqRyb8L5ATY2lgPckZyVMYrcVlYVMI-P5oXTgQJ2FD/s320/LightmapTexture.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">An example of a lightmap texture. You can see the shadows of trees and buildings in this texture.</td></tr>
</tbody></table>
<br />
Now what we'd like is that when a character walks through the scene and walk into a shaded area, the character also becomes darker (because it's walking in the shade). To do this we cast a ray from the character onto the ground and get the second texture coordinate of the point on the ground. We then use this color on the character material and in this way it'll shade appropriately.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiu0gQ3DTUZYyjwZ7_Np2iu5O4GcFqEHvJuK9mPn3YpKMJHp-JH4B_PdDpkaXyKLaBl_4b5-tgbM8vDU8_Vkgfoit0a1vKp5OhDGvYmNPprZSmOurwoubmJTJOCtLo-A3gFMwikPwR8-sb-/s1600/LightmappedCharacter.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="224" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiu0gQ3DTUZYyjwZ7_Np2iu5O4GcFqEHvJuK9mPn3YpKMJHp-JH4B_PdDpkaXyKLaBl_4b5-tgbM8vDU8_Vkgfoit0a1vKp5OhDGvYmNPprZSmOurwoubmJTJOCtLo-A3gFMwikPwR8-sb-/s320/LightmappedCharacter.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">A character in light on the left and in shadow on the right.</td></tr>
</tbody></table>
This also works for other objects such as bullet holes, but care should be taken. As bullet holes share the same material, adjusting the color on that material changes the appearence of all bullet holes which is not what we want (as some are in light, others in shadow). Creating a separate material for each bullet hole is possible, but not desirable: it slows down rendering. Instead we create just two materials: one for in light, the other for in shadow and assign one of the two materials to the bullet hole depending on whether it is in light or shadow.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJKBwN7m7aDwSYh_pxB_u6-i3pVGHppsI7ZeEPF9QMZUlsjembSj7CIMStMKpKgfPBgglMyPyAyCyc1rA2Nobw-ND3b_FuEqyLKyK3Q1b9JqZmG4axMrEGVbI4aTVMnEImPM9et0xWpEFQ/s1600/LightmappedBulletHoles.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="225" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJKBwN7m7aDwSYh_pxB_u6-i3pVGHppsI7ZeEPF9QMZUlsjembSj7CIMStMKpKgfPBgglMyPyAyCyc1rA2Nobw-ND3b_FuEqyLKyK3Q1b9JqZmG4axMrEGVbI4aTVMnEImPM9et0xWpEFQ/s320/LightmappedBulletHoles.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Bullet holes in light on the left and in shadow on the right.</td></tr>
</tbody></table>
-- Stijn
<br />
<div class="fb-like" data-href="http://xformgamedevelopment.blogspot.nl/2013/02/lightmapped-tinting.html" data-send="true" data-show-faces="true" data-width="450">
</div>
Xformhttp://www.blogger.com/profile/11465248769948238845noreply@blogger.com3tag:blogger.com,1999:blog-1109055551036769632.post-78595322351129614062013-02-18T15:52:00.005+01:002013-02-21T14:08:45.461+01:00Designing and building an interface<div id="fb-root">
</div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
Hi guys,<br />
<br />
Today I'm going to show you some tips and tricks on how we design and build our interfaces here at Xform. <br />
Always start with a good game and interface design document before starting the interface design in Photoshop. You need to have a good idea of all the elements that need to be displayed on screen and also when an interface element is displayed.<br />
<br />
When I setup a file I always start by creating layer folders and sub folders in Photoshop. As you can see in the right column in the image below, I've created an Interface folder which contains all the elements of the interface in sub folders. This makes it easy to turn separate or unique interface elements on and off. This also prevents me from cloning a lot of graphic elements which are used in multiple screens, like the speedometer.<br />
<br />
When all screens are done I setup layer compositions (left column of the image below) to make it even easier to switch between all the possible interface screens. Setting a layer compositions doesn't actually change anything in your Photoshop file, it only remembers which layers have to be turned on or off when it's selected. Don't forget to use this tool, it can save you a lot of time!<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiqcvIDQ4Bp4B8FWwfjoZCS2Q00LM4Bc6OBq3afDZmUlFMRPxuxhSiHnM1J8uoZZUoxnC5Ig19cpT3YKZXaaOdcRohnbhFs1P2VEp8GcJ7iYKHjo-joJvF-7n5BkHqHnUqO9dwkJCJSFI/s1600/MockupBossBattle.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="156" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiqcvIDQ4Bp4B8FWwfjoZCS2Q00LM4Bc6OBq3afDZmUlFMRPxuxhSiHnM1J8uoZZUoxnC5Ig19cpT3YKZXaaOdcRohnbhFs1P2VEp8GcJ7iYKHjo-joJvF-7n5BkHqHnUqO9dwkJCJSFI/s1600/MockupBossBattle.jpg" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Interface mock-up in Photoshop </td></tr>
</tbody></table>
<br />
When the mock-up is approved it's time to turn the interface elements into a compact texture. Here I've chosen to work with an 512x512px texture. All the elements I need are placed in a grid of 16x16 pixels. It's very important for me to work inside this grid since we'll use the same mesh grid in 3ds Max.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgji0Iwm0_Clu8bZrmaMGWAiJmD-rtwGxV-bEXhH92kA2-jse4OXgbyFK058_VazSSA_QKQJpTtKaskJ5MaiXxdZvOipLyT6pSpKnT4lKwIyZ5A_z2fjpgaL202PYqPHoLvnsaFUpg-lBQ/s1600/TextureOnGrid.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgji0Iwm0_Clu8bZrmaMGWAiJmD-rtwGxV-bEXhH92kA2-jse4OXgbyFK058_VazSSA_QKQJpTtKaskJ5MaiXxdZvOipLyT6pSpKnT4lKwIyZ5A_z2fjpgaL202PYqPHoLvnsaFUpg-lBQ/s1600/TextureOnGrid.jpg" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">512x512 px texture. Photoshop grid size 16x16px</td></tr>
</tbody></table>
<div class="separator" style="clear: both; text-align: left;">
</div>
<div class="separator" style="clear: both; text-align: left;">
The final textures will be imported in 3ds Max and placed on a plane of the same dimensions: 512x512 units. To "recreate" the Photoshop grid we set the length and width segments to 32x32, which creates squares of 16x16 units. This makes it easy for me to cut-up the plane into separate interface elements.</div>
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh67l287FokGBy01ni6xo-D8BOPB7HlF5OdLRcCKRQc3lSwxMmd6zFPQMc1MdOfsZifRJkHF9ChjofP4_zEtc1KMtyr2eEWOxuL5NmopR5Vk0vPrwmBfYyQFpLD9HtzRJQ_xZeyOH64cyE/s1600/Texture3D.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="272" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh67l287FokGBy01ni6xo-D8BOPB7HlF5OdLRcCKRQc3lSwxMmd6zFPQMc1MdOfsZifRJkHF9ChjofP4_zEtc1KMtyr2eEWOxuL5NmopR5Vk0vPrwmBfYyQFpLD9HtzRJQ_xZeyOH64cyE/s1600/Texture3D.jpg" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">512x512 px texture on a 512x512 units 3D plane divided in 32x32 segments</td></tr>
</tbody></table>
<br />
The elements are set into place in an orthographic view using the original Photoshop image as a template. Although the interface is created in a 3D software program it'll still be displayed as an 2D interface. Therefore we use an orthographic view instead of an perspective view.<br />
As you can see in the lower part of the image below the elements are ordered in 3D space, but will be rendered in game as seen in the top area of the image below. The white boxes on top of the interface are used to display dynamic text, like weapon and enemy names.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRbhyD17XF3NOq8l_HitVct8rC9QVYyKHcOg1wItxH5vcXzLE7UOyRmXHI2aW4dFWN_yzgC-mI8c9vPd7ajaDjmmfZ22CUdkfJ830x6xyyfFN-89VwdU1X0PJSNjR-UEGW8lP63yc3U98/s1600/3DS_Max.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRbhyD17XF3NOq8l_HitVct8rC9QVYyKHcOg1wItxH5vcXzLE7UOyRmXHI2aW4dFWN_yzgC-mI8c9vPd7ajaDjmmfZ22CUdkfJ830x6xyyfFN-89VwdU1X0PJSNjR-UEGW8lP63yc3U98/s1600/3DS_Max.jpg" width="373" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Interface in 3ds Max. Top orthographic view. Bottom Perspective view.</td></tr>
</tbody></table>
<div class="separator" style="clear: both; text-align: left;">
</div>
<div class="separator" style="clear: both; text-align: left;">
When the max file is done our programmers will have to make the interface work in game. And there you have it... a working interface!</div>
<div class="separator" style="clear: both; text-align: left;">
</div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJoqdFuZe3qs0Ce1uSinz5ltiRIXmfgEUaYRoGftjD82YUu5oLCake329LCBE54aeW_vT0N1wIj2IJbpqL_OwTPREvE6z0x6t8kGGf9h_80L2x0aBx9aldh3g7S5AJljnZMqokbkbO_nI/s1600/FinalInterface.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="225" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJoqdFuZe3qs0Ce1uSinz5ltiRIXmfgEUaYRoGftjD82YUu5oLCake329LCBE54aeW_vT0N1wIj2IJbpqL_OwTPREvE6z0x6t8kGGf9h_80L2x0aBx9aldh3g7S5AJljnZMqokbkbO_nI/s1600/FinalInterface.jpg" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Final in-game interface</td></tr>
</tbody></table>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
Cheers,<br />
Matt
<br />
<div class="fb-like" data-href="http://xformgamedevelopment.blogspot.nl/2013/02/designing-and-building-interface.html" data-send="true" data-show-faces="true" data-width="450">
</div>
Unknownnoreply@blogger.com16tag:blogger.com,1999:blog-1109055551036769632.post-1096337399313145642013-02-14T09:09:00.001+01:002013-02-20T17:39:09.076+01:00Mud madness dirt cross car racing game<div id="fb-root">
</div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<span lang="EN-GB">Hey
everyone!<o:p></o:p></span><br />
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
<span lang="EN-GB">Congrats
to the winners of the Burnin Rubber contest! Good job! <o:p></o:p></span></div>
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
<span lang="EN-GB">Last
couple of weeks I’ve been working on the Mud Madness Dirt Cross Car Race game.<o:p></o:p></span></div>
<div class="MsoNoSpacing">
<span lang="EN-GB">I did
some optimizing off the tracks, made some small menu changes and animations. <o:p></o:p></span></div>
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
<span lang="EN-GB">But now
I’m going to show you some of the menu backgrounds I made. <o:p></o:p></span></div>
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
<span lang="EN-GB">I
started with making a nice setup for my menu background. Used one of our
tracks, placed some cars in it and played with the camera a bit 'till I got the
view I wanted. <o:p></o:p></span></div>
<div class="MsoNoSpacing">
<span lang="EN-GB">Then I made a
print screen of the viewport in 3Ds max and placed it as my background of the
menu. <o:p></o:p></span></div>
<div class="MsoNoSpacing">
<span lang="EN-GB">You have
all seen this in my last blog post. T</span><span lang="EN-GB">his
is how it looked like:</span></div>
<div class="MsoNoSpacing">
<span lang="EN-GB"><br /></span></div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmaio6QgWMXp-GaKkJflXL9G7LaS8LOP0TyVnDa4VQLnNOo9fjZHbIpmv1-iQLim5ET9GQFv-m5k5fuDAy2khNk730ZcBwfYYFogQjTQA5TUM0gd7ZMMB6sYR3nqv_8fN3qWBkqYfxLpc/s1600/A.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="180" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmaio6QgWMXp-GaKkJflXL9G7LaS8LOP0TyVnDa4VQLnNOo9fjZHbIpmv1-iQLim5ET9GQFv-m5k5fuDAy2khNk730ZcBwfYYFogQjTQA5TUM0gd7ZMMB6sYR3nqv_8fN3qWBkqYfxLpc/s320/A.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Step 1</td></tr>
</tbody></table>
<div class="MsoNoSpacing">
<span lang="EN-GB"><br /></span></div>
<div class="MsoNoSpacing">
After I
made the environment a bit smoother, I rendered the diffuse map without the
cars first.</div>
<div class="MsoNoSpacing">
<span lang="EN-GB">I need
those separated in the photoshop file. <o:p></o:p></span></div>
<div class="MsoNoSpacing">
<br /></div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghEQ2Qd_T9hZu9HrOdR7_4XzV3bWy92GrdWQOpKfAo1HDB98SgYptrqVCDX_psK2Doka4rnhPTVxFh8C3Tkc5uNSVdBSLBMvQfCHaeLLa5tur436ae1SJmw36sdkQKkJEpfkklFmJSz6I/s1600/1.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="180" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghEQ2Qd_T9hZu9HrOdR7_4XzV3bWy92GrdWQOpKfAo1HDB98SgYptrqVCDX_psK2Doka4rnhPTVxFh8C3Tkc5uNSVdBSLBMvQfCHaeLLa5tur436ae1SJmw36sdkQKkJEpfkklFmJSz6I/s320/1.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Step 2</td></tr>
</tbody></table>
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
<span lang="EN-GB">After
that I placed a direct light and renderd the shadows, then I rendered it with a
skylight, then an ambient occlusion map. <o:p></o:p></span></div>
<div class="MsoNoSpacing">
<span lang="EN-GB">After
some work in Photoshop, I got this as a result:</span></div>
<div class="MsoNoSpacing">
</div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBKYckcRLrH59gGLOBabmG8cR9rVYlc9iZfi2yzyPwnFg-Ba8KjvyM0kCAw41Kr43YyKircGttIggzY4iXQrbWIHZ3KK_YP5wOTLyVyKxMnlDPBx43jonxk4ASiVgR-9A09_2xTjbSIXM/s1600/2.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="180" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBKYckcRLrH59gGLOBabmG8cR9rVYlc9iZfi2yzyPwnFg-Ba8KjvyM0kCAw41Kr43YyKircGttIggzY4iXQrbWIHZ3KK_YP5wOTLyVyKxMnlDPBx43jonxk4ASiVgR-9A09_2xTjbSIXM/s320/2.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Step 3</td></tr>
</tbody></table>
<div class="MsoNoSpacing">
<span lang="EN-GB"><br /></span></div>
<div class="MsoNoSpacing">
Now it
was time to start rendering the cars. First I made the cars a bit smoother.</div>
<div class="MsoNoSpacing">
<span lang="EN-GB">I decided to render the front car as first, then
the cars in the back. And just like the environment I rendered the diffuse map
first, then a render with a skylight and an ambient occlusion map. <o:p></o:p></span></div>
<div class="MsoNoSpacing">
<span lang="EN-GB">After
some work in photoshop I got this result:</span></div>
<div class="MsoNoSpacing">
<span lang="EN-GB"></span> </div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibvp5BT2aif2HUbxgbyJotrqetDc6YUWgEaOxdUKIHcR3IbaayX3REtqQqmBIpR-6OQlDKb4LTPBK705zfLWfdZgRxCYYy_Yp110S77volScaj-Re6jozXZkrgnMzITcP9B00dnv4Xyvs/s1600/3.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="180" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibvp5BT2aif2HUbxgbyJotrqetDc6YUWgEaOxdUKIHcR3IbaayX3REtqQqmBIpR-6OQlDKb4LTPBK705zfLWfdZgRxCYYy_Yp110S77volScaj-Re6jozXZkrgnMzITcP9B00dnv4Xyvs/s320/3.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Step 4</td></tr>
</tbody></table>
<div class="MsoNoSpacing">
<span lang="EN-GB"><br /></span></div>
<div class="MsoNoSpacing">
<span lang="EN-GB">Now it
was time to add everything in one photoshop file and add some dirt spats, mud, etc. So it would feel
like an action shot and not a fancy rendered background. <o:p></o:p></span></div>
<div class="MsoNoSpacing">
</div>
<div class="MsoNoSpacing">
<br /></div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJCLwrHtrcK990IwF7UYVe4kngnGiFZ4a9TgLaLDNAS5KEdeeaeHglf_HqsUG41_lNxavAp_xfEQfmiAPAJTay7ME0Em79Iyfmva4a080pvdVneel3BjwEZ_poi-QbJYU5JeyBil-FuKU/s1600/4.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="180" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJCLwrHtrcK990IwF7UYVe4kngnGiFZ4a9TgLaLDNAS5KEdeeaeHglf_HqsUG41_lNxavAp_xfEQfmiAPAJTay7ME0Em79Iyfmva4a080pvdVneel3BjwEZ_poi-QbJYU5JeyBil-FuKU/s320/4.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Final!</td></tr>
</tbody></table>
<div class="MsoNoSpacing">
<span lang="EN-GB"><br /></span></div>
<div class="MsoNoSpacing">
<span lang="EN-GB">That’s
all for now!<o:p></o:p></span></div>
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
<span lang="EN-GB">Hails, <o:p></o:p></span></div>
<div class="MsoNoSpacing">
<span lang="EN-GB">Eugène</span></div>
<div class="fb-like" data-href="http://xformgamedevelopment.blogspot.nl/2013/02/mud-madness-dirt-cross-car-racing-game.html" data-send="true" data-show-faces="true" data-width="450">
</div>
Unknownnoreply@blogger.com5tag:blogger.com,1999:blog-1109055551036769632.post-91813749590351008272013-02-07T09:10:00.000+01:002013-02-07T09:26:58.748+01:00Mockup using loft<div id="fb-root">
</div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<span style="background-color: white; color: #222222; font-family: arial, sans-serif; font-size: 13px;">Hi there!</span><br />
<div style="background-color: white; color: #222222; font-family: arial, sans-serif; font-size: 13px;">
<br /></div>
<div style="background-color: white; color: #222222; font-family: arial, sans-serif; font-size: 13px;">
First I want to tell you that our new car crash game <a href="http://www.agame.com/game/traffic-slam-3.html" target="_blank">Traffic Slam 3</a> has been released! It is free to play, so check it out and have fun :)! It was a fun project to work on, I also learned a few new things here and there during development.</div>
<br />
<div style="background-color: white; color: #222222; font-family: arial, sans-serif; font-size: 13px;">
Of course we haven't been sitting around eating sandwiches with chees on top.. No.. we have started a new project and I've been working on the mockup environment to be used in the alpha version. It is a bit of a unique project compared to our usual games we make. Such as a racing or a shooter game. It is a more 'move from point a to point b' kind of game, which I like.</div>
<div style="background-color: white; color: #222222; font-family: arial, sans-serif; font-size: 13px;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimKGFio-ST9RBHIbD2_YA4mliLUoPZnFtfA1QXbp2a8QcjKqp_djJwaxONGelhcjufSitCy-5VSJ0oxm-zggpUEcI3fpYtJvByV5ct5rXB_fniAXDkNkAYYVtKj_BRaHlS8rtzxjkCHks/s1600/1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="180" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimKGFio-ST9RBHIbD2_YA4mliLUoPZnFtfA1QXbp2a8QcjKqp_djJwaxONGelhcjufSitCy-5VSJ0oxm-zggpUEcI3fpYtJvByV5ct5rXB_fniAXDkNkAYYVtKj_BRaHlS8rtzxjkCHks/s320/1.jpg" width="320" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div style="background-color: white; color: #222222; font-family: arial, sans-serif; font-size: 13px;">
I want to show you a quick trick on how I made the mockup. The level is a kind of 'path' from the start location towards the end. The 'path' is the main part of the environment, everything is built around it. I made a spline using the shape tools in 3dsmax. Then I used a compound object called 'Loft', to generate the main path mesh from the spline. </div>
<div style="background-color: white; color: #222222; font-family: arial, sans-serif; font-size: 13px;">
<br /></div>
<div style="background-color: white; color: #222222; font-family: arial, sans-serif; font-size: 13px;">
Loft also has the ability to auto generate UV coordinates which is very nice. When generating a mesh from the spline you have to tell the loft modifier what kind of mesh 'slice' or mesh 'shape' you want to use. I made it way wider than the road would be most of the time. Then I deleted moest of the widest parts again, except for the places where I wanted them to be. </div>
<div style="background-color: white; color: #222222; font-family: arial, sans-serif; font-size: 13px;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVYibbD2e1WuCxM4u5EB-ejOAA4Ui_P9Aep9VOSHgUVy7UltnNmLOpBjyxi_QbVdnqy4xNfTUk7jYiux0UIuh79CArDGK9k0xFuRhMYsrEqwUSP5gPREx1XB3vlC1qSB_vddf-RlYhMZw/s1600/2.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="180" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVYibbD2e1WuCxM4u5EB-ejOAA4Ui_P9Aep9VOSHgUVy7UltnNmLOpBjyxi_QbVdnqy4xNfTUk7jYiux0UIuh79CArDGK9k0xFuRhMYsrEqwUSP5gPREx1XB3vlC1qSB_vddf-RlYhMZw/s320/2.jpg" width="320" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div style="background-color: white; color: #222222; font-family: arial, sans-serif; font-size: 13px;">
Next to the ground mesh of the mockup I also worked on the placement of some of the assets we want the level to have. And made one part of the level more detailed, to give ourselves an idea of what it could look like in the final stages.</div>
<div style="background-color: white; color: #222222; font-family: arial, sans-serif; font-size: 13px;">
<br /></div>
<div style="background-color: white; color: #222222; font-family: arial, sans-serif; font-size: 13px;">
Thats it for now! Until next time,</div>
<div style="background-color: white; color: #222222; font-family: arial, sans-serif; font-size: 13px;">
Joep</div>
<div class="fb-like" data-href="http://xformgamedevelopment.blogspot.nl/2013/02/mockup-using-loft.html" data-send="true" data-show-faces="true" data-width="450">
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-1109055551036769632.post-43475419294452871212013-02-01T17:21:00.003+01:002013-02-04T14:37:02.907+01:00Mud Racing Madness<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<br />
<div class="MsoNoSpacing">
<span lang="EN-US">Hi guys!</span></div>
<div class="MsoNoSpacing">
<div class="MsoNoSpacing">
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguOLROB1UaI8sx7F2TMD9zvvPrW-So0emAdpXJoPnSyAtVl-Q3VKJkUgY9e-NK-F592h8xXYGrPuWfvCpeitPlHRlzltbgRBLETOdi6E4QhZ4JYhNFOH2sZQiZbqkEZYNTXX-uWppe6d4/s1600/MudRacing3.jpg" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"><img border="0" height="165" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguOLROB1UaI8sx7F2TMD9zvvPrW-So0emAdpXJoPnSyAtVl-Q3VKJkUgY9e-NK-F592h8xXYGrPuWfvCpeitPlHRlzltbgRBLETOdi6E4QhZ4JYhNFOH2sZQiZbqkEZYNTXX-uWppe6d4/s320/MudRacing3.jpg" width="320" /></a><span lang="EN-US">A new
update for one of our upcoming releases!<o:p></o:p></span></div>
<div class="MsoNoSpacing">
<span lang="EN-US">One of
our race games! And no not BR5!<o:p></o:p></span></div>
<div class="MsoNoSpacing">
<span lang="EN-US">Our mud
racer! The game is making lots of progress the last couple of weeks.<o:p></o:p></span></div>
<div class="MsoNoSpacing">
<span lang="EN-US">Most of
the art is almost finished but the finishing touch is still missing. So we are
very busy with finalizing my code and tweak/improve the texture. And of course
most important, the performance.<o:p></o:p></span></div>
</div>
<div class="MsoNoSpacing">
<br />
<div class="MsoNoSpacing">
<span lang="EN-US">We are
trying to get the best out of Flash 3d and the last week it was very
challenging for myself to improve my code. A nice project to keep myself busy
for a week:) <o:p></o:p></span></div>
</div>
<div class="MsoNoSpacing">
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRNfF8AyXf1fTIFHz2WooCi3yv4aOTDtfBRBUuQ1IAfb2r_u4kdAqxrFoj01rOOrMpIsfqFKl_bjmCUMUUNYMoSnHa9wPNap6fFnWZrzS22N5By3dKzqkOGYVtIKnlyYd2SHUvLl_Lf0o/s1600/MudRacing.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="165" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRNfF8AyXf1fTIFHz2WooCi3yv4aOTDtfBRBUuQ1IAfb2r_u4kdAqxrFoj01rOOrMpIsfqFKl_bjmCUMUUNYMoSnHa9wPNap6fFnWZrzS22N5By3dKzqkOGYVtIKnlyYd2SHUvLl_Lf0o/s320/MudRacing.jpg" width="320" /></a></div>
<br /></div>
<div class="MsoNoSpacing">
<br />
<div class="MsoNoSpacing">
</div>
<div class="MsoNoSpacing">
<span lang="EN-US">We need
to know on what environment type we are driving, driving on different types of environment
means different settings. In water we need more drag, on oil it needs to be
uncontrollable. So the detection of different types of environments is very
important since it changes your car behavior. In the beginning we just had
those 2, but later on we got more. So the system had to be improved! There are
several ways to do this but I choose to check on mesh names<o:p></o:p></span></div>
<div class="MsoNoSpacing">
<span lang="EN-US">Easy way
and quick way:) since we already know we have collision with the ground.. The
only thing we need to do is slice the ground in more parts.<o:p></o:p></span></div>
<div class="MsoNoSpacing">
<span lang="EN-US">When we
know the type of ground we can give the car a new set of properties. Those
settings can be like drag, speed
limiter, sound, particles, etc..<o:p></o:p></span></div>
<br /></div>
<div class="MsoNoSpacing">
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtq0eptcEAN4kqfRoEb46Sfu_fpuDj5WLZbbhmq0SDpvU9XTVN8pdL9iEYh45fae0Osvr-0JwHuK0iX2liVkO0c_BFi3TDzSA4At49le8JpiueyCfMcy4ugs80AE6-UoDOeoaYPCuGg_A/s1600/MudRacing4.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="165" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtq0eptcEAN4kqfRoEb46Sfu_fpuDj5WLZbbhmq0SDpvU9XTVN8pdL9iEYh45fae0Osvr-0JwHuK0iX2liVkO0c_BFi3TDzSA4At49le8JpiueyCfMcy4ugs80AE6-UoDOeoaYPCuGg_A/s320/MudRacing4.jpg" width="320" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
</div>
<div class="MsoNoSpacing">
<br />
<div class="MsoNoSpacing">
<span lang="EN-US">So since
I'm working on this part of improvement, my brother Eugene is improving the
tracks that were created. Mostly to slice the parts and duplicate so we can use
those for our physics system. <o:p></o:p></span></div>
<div class="MsoNoSpacing">
<span lang="EN-US">I'm not
going into details but it's easier for flash that those models will have less
triangles.<o:p></o:p></span></div>
<br />
<span lang="EN-US"><br /></span>
Everyone good luck with the BR5 contest!!<br />
<span lang="EN-US"><br /></span>
<span lang="EN-US">One last image:)</span><br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5FgDko49WEv7XNzW_5cy18rtmVPNIuoHmgQrO1aS_HXGUXp1Bfc3nrNTHesVxDP9tFvJuppOEJEF_qYXNfvZKtOdbrHYmPuYjbn_bS50hfbTyeMqO5iTF4rBtbzfA9K2VE4B-j1IsXvQ/s1600/MudRacing2.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="164" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5FgDko49WEv7XNzW_5cy18rtmVPNIuoHmgQrO1aS_HXGUXp1Bfc3nrNTHesVxDP9tFvJuppOEJEF_qYXNfvZKtOdbrHYmPuYjbn_bS50hfbTyeMqO5iTF4rBtbzfA9K2VE4B-j1IsXvQ/s320/MudRacing2.jpg" width="320" /></a></div>
<span lang="EN-US"><br /></span>
<span lang="EN-US"><br /></span>
<span lang="EN-US">Greeting, Michael</span><br />
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
</div>
<div class="fb-like" data-href="http://xformgamedevelopment.blogspot.nl/2013/02/mud-racing-madness.html" data-send="true" data-width="450" data-show-faces="true"></div>Unknownnoreply@blogger.com12tag:blogger.com,1999:blog-1109055551036769632.post-43518185786680202482013-01-31T15:09:00.001+01:002013-02-04T14:38:29.308+01:00BURNIN' RUBBER 5 CONTEST<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<span style="font-family: Arial, Helvetica, sans-serif;">See this image?</span><br />
<span style="font-family: Arial;"></span><br />
<table cellpadding="0" cellspacing="0" class="tr-caption-container" style="float: left; margin-right: 1em; text-align: left;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGCDgSL5psocaGYukZCS-vvyujVx2Hathhcj4B765MnvnQ2iv8365T23peNMCCelxDdRc9bFUkNfO31vYjyoMEgjzJTvJlAxvsSCb3M5Xddj62Qvo0_CitY660ewwINQomdtpJhcOERUw/s1600/Contest.png" imageanchor="1" style="clear: left; margin-bottom: 1em; margin-left: auto; margin-right: auto;"><img border="0" height="228" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGCDgSL5psocaGYukZCS-vvyujVx2Hathhcj4B765MnvnQ2iv8365T23peNMCCelxDdRc9bFUkNfO31vYjyoMEgjzJTvJlAxvsSCb3M5Xddj62Qvo0_CitY660ewwINQomdtpJhcOERUw/s320/Contest.png" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Will these guys reward you with a special BR5 prize?</td></tr>
</tbody></table>
<br />
<br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;">It's hidden somewhere in Burnin' Rubber 4.</span><br />
<span style="font-family: Arial;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;">1. Go find it and make a screenshot.</span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"><br />2. Post your screenshot on the <a href="https://www.facebook.com/Xform" target="_blank">Xform Facebook page</a>. Post it BEFORE friday February 8 of this year.<br />
<br />3. Our panel of judges will pick a winner.<br />
<br />
</span><span style="font-family: Arial, Helvetica, sans-serif;">4. The winner will get a special reward in BURNIN RUBBER 5!!!</span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;">HINT:</span><br />
<br />
<table cellpadding="0" cellspacing="0" class="tr-caption-container" style="float: left; margin-right: 1em; text-align: left;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiG0_I_4I1pNIRybmQhfO6FtSjqgTmlMMQIxr6n6SY2lIVZh69LWkeEjlDf6KQ7leUgISIgvVXluLLcEWske8MQisEhUaB0v11Jw6vylB1ZQvBbZqijMeksyyiuCsYNoxjgEQSEUIHtFFM/s1600/MiniMapJungle.jpg" imageanchor="1" style="clear: left; margin-bottom: 1em; margin-left: auto; margin-right: auto;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiG0_I_4I1pNIRybmQhfO6FtSjqgTmlMMQIxr6n6SY2lIVZh69LWkeEjlDf6KQ7leUgISIgvVXluLLcEWske8MQisEhUaB0v11Jw6vylB1ZQvBbZqijMeksyyiuCsYNoxjgEQSEUIHtFFM/s320/MiniMapJungle.jpg" width="266" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Search everywhere...</td></tr>
</tbody></table>
<br />
<span style="font-family: Arial;"></span><br />
<span style="font-family: Arial;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;">So, what are you waiting for?</span><br />
<span style="font-family: Arial;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;">Go, go... GO!!!</span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;">Play Burnin' Rubber 4 now: </span><a href="http://www.shockwave.com/gamelanding/burnin-rubber-4.jsp"><span style="font-family: Arial, Helvetica, sans-serif;">http://www.shockwave.com/gamelanding/burnin-rubber-4.jsp</span></a>
<div class="fb-like" data-href="http://xformgamedevelopment.blogspot.nl/2013/01/burnin-rubber-5-contest.html" data-send="true" data-width="450" data-show-faces="true"></div>Unknownnoreply@blogger.com6tag:blogger.com,1999:blog-1109055551036769632.post-29516467784361074212013-01-25T15:11:00.000+01:002013-02-04T15:19:57.363+01:00This one's for the fans!<div id="fb-root">
</div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<span style="font-family: Arial, Helvetica, sans-serif;">For all those fans that are yearning for the release of Burnin' Rubber 5:<br />Don't worry! We did NOT stop the development. </span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;">In fact, the guys here are still working on it, like crazy. <br />And I can tell you: the game is going to be great! </span><span style="font-family: Arial, Helvetica, sans-serif;">But great is just not good enough for this final episode in our trilogy. </span><span style="font-family: Arial, Helvetica, sans-serif;">BR5 simply needs to be epic! And more.</span><br />
<span style="font-family: Arial, Helvetica, sans-serif;">S</span><span style="font-family: Arial, Helvetica, sans-serif;">o that's why we're still busy with tweaking.</span><br />
<span style="font-family: Arial, Helvetica, sans-serif;">And tweaking.</span><br />
<span style="font-family: Arial;">And some more tweaking.</span><br />
<span style="font-family: Arial, Helvetica, sans-serif;">And balancing.</span><br />
<span style="font-family: Arial, Helvetica, sans-serif;">And adding special content.</span><br />
<br />
<span style="font-family: Arial, Helvetica, sans-serif;">But in the meantime we will arrange something special for you.<br />Something that did never ever happened before in the Burnin' Rubber history...</span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;">Xform proudly presents:</span><span style="font-family: Arial, Helvetica, sans-serif; font-size: x-small;"> </span><br />
<span style="font-family: Arial, Helvetica, sans-serif; font-size: x-small;"><br />
<span style="font-size: small;"><strong>THE BIG </strong><strong>BURNIN' RUBBER CONTEST!!!</strong></span><br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVWjHrYmvznHlNxClFKYujs4-S3coajAyBxRWS_JTFDG9UJaw_5zPj-_Bxt7Tmp7rJb9rlk-G26JcxP5dBmBFsdFRbqnrpFLH8s5UlGWmpqvl2uhatafiC5g4P2XJ5pW2aWoB2tDNYctE/s1600/BR5.png" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="146" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVWjHrYmvznHlNxClFKYujs4-S3coajAyBxRWS_JTFDG9UJaw_5zPj-_Bxt7Tmp7rJb9rlk-G26JcxP5dBmBFsdFRbqnrpFLH8s5UlGWmpqvl2uhatafiC5g4P2XJ5pW2aWoB2tDNYctE/s400/BR5.png" width="400" /></a><br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<span style="font-size: small;"></span><br />
<span style="font-size: small;"></span><br />
<span style="font-size: small;"></span><br />
<span style="font-size: small;">A </span><span style="font-size: small;">contest for the biggest BR5 fans.</span><br />
<span style="font-size: small;">A contest in which you can win an epic price.</span><br />
<br /><span style="font-size: small;">
We will SOON reveal the rules, how to participate and the price you can win!</span><br />
<span style="font-size: small;">Sounds awesome? It is!</span><br />
<span style="font-size: small;"></span><br />
<span style="font-size: small;">So please keep checking our Facebook fanpage for more info: </span><span style="font-size: small;"><a href="https://www.facebook.com/Xform">https://www.facebook.com/Xform</a></span><br />
<span style="font-size: small;"></span><br />
<span style="font-size: small;">Cheers,</span><br />
<span style="font-size: small;">Shirley</span></span>
<br />
<div class="fb-like" data-href="http://xformgamedevelopment.blogspot.nl/2013/01/this-ones-for-fans.html" data-send="true" data-show-faces="true" data-width="450">
</div>
Unknownnoreply@blogger.com15tag:blogger.com,1999:blog-1109055551036769632.post-71513328231913441632013-01-23T17:02:00.000+01:002013-01-23T17:24:36.775+01:00Trick trails<div id="fb-root">
</div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<br />
Dear readers,<br />
<br />
First of all we're happy to inform you that Traffic Slam 3 has just been released! You can play it <a href="http://www.agame.com/game/traffic-slam-3.html" target="_blank">here</a>. I really enjoyed working on Traffic Slam 3 and think it's absolutely a worthy successor of <a href="http://www.agame.com/game/traffic-slam-2.html" target="_blank">Traffic Slam 2</a>.<br />
<br />
In the meantime I've been working on a snowboard game, which is nearing completion. In this game you'll be going through the city and completing challenges. Some challenges are completed by getting a certain score, others by doing certain kind of tricks. With every kind of trick you score points. Needless to say, doing tricks is the main goal of the game. As such, tricks should look cool and be fun to do. Besides making the animations cool, we've also added trails when doing tricks. The trails are added to the hands and the board and only show when a trick is being done. An example is shown below:<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTYQPDgwyIOGjT82LX-mXV8VyMytQG7CjTCaB-vNwsGaVsB6_rY2lG4hr0t2xf0-ME5ek90P7lycY7XghbrEGrRhxkSqO0DdFHZvVAh_vkihtVzwgTkDMAg1tNUiK32QEECn8VBVfh2FU/s1600/SnowboardTrails.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="225" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTYQPDgwyIOGjT82LX-mXV8VyMytQG7CjTCaB-vNwsGaVsB6_rY2lG4hr0t2xf0-ME5ek90P7lycY7XghbrEGrRhxkSqO0DdFHZvVAh_vkihtVzwgTkDMAg1tNUiK32QEECn8VBVfh2FU/s320/SnowboardTrails.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Player doing a trick with trails showing the movement of the board and hands.</td></tr>
</tbody></table>
<br />
So how do we create these trails? The trail is a mesh (a strip of triangles) that is updated each frame: whenever the object that the trail is following moves the trail is updated. It generates new vertices on the position where the followed object is now and updates old vertices (setting vertex colors for a fading trail and eventually removing them). It is also important that the generated trail does not create its vertices on one plane but rather banks with the followed object as can be seen below:<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicnJLZqC6NH8FpWsvJkyhmBx_eiaTCaQl9E0mkuaZAYu2x0NmQ3ez7XqMNQ8tdvvIuL-EqnwoPzyZrBXRg8dg8rd2vu2tH9mqx94-csF-aNFVwRudHeIqnzkDkM_wC4UuzZ0-uHO7oXdA/s1600/SnowboardTrails3.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="138" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicnJLZqC6NH8FpWsvJkyhmBx_eiaTCaQl9E0mkuaZAYu2x0NmQ3ez7XqMNQ8tdvvIuL-EqnwoPzyZrBXRg8dg8rd2vu2tH9mqx94-csF-aNFVwRudHeIqnzkDkM_wC4UuzZ0-uHO7oXdA/s320/SnowboardTrails3.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">A trial is made out of a mesh as shown by the blue lines.</td></tr>
</tbody></table>
<br />
And of course for any kind of feature you create, you should ask yourself: could it be useful in future games as well? If so: can the feature be made generic (to a certain extent and without using too much time) so that parameters can be tweaked. For the trails the answer is yes: trails are pretty common in games. Parameters for the trail can be the trail width, fade speed, color, etc.<br />
<br />
-- Stijn
<br />
<div class="fb-like" data-href="http://xformgamedevelopment.blogspot.nl/2013/01/trick-trails.html" data-send="true" data-show-faces="true" data-width="450">
</div>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-1109055551036769632.post-80533938687034992992013-01-18T17:08:00.000+01:002013-01-18T17:16:09.627+01:00Who's the boss?<div id="fb-root">
</div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<br />
A few weeks back we playtested one of our games currently in development, although the game already is pretty awesome we felt it didn't end good. It was ok but not the awesome ending you expect from an awesome epic game :). That's why we sat around the table with a few beers and discussed how it should end. After the vodka bottles, we ended up with lots of crazy ideas and, finally picked one....the craziest one of course! I don't want to spoil it for you and give away too much details about the boss, but I can tell you it's a huge vehicle which the player has to enter and work it's way to the top.<br />
<br />
We needed to test this idea as soon as possible before creating the final art and realizing it wasn't such a good idea after all. I quickly blocked out a prototype of the boss in 3ds Max, imported it into an existing level. Once in the game, it's much easier for instance to determine the objects scale and internal tunnel and room sizes.<br />
<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9rlE82GrxsaOwhOjAUI2FDOQbTZO6dY6XLmRLJK62LAVZZnnhclH46lM3SOuG0n4sFuPs5f7k9Rp9w1nCroM7kplFCiA17kwY96I7nuEr143BDFq2WzhE2Rt49-DOxwjXxriaMnGDO9M/s1600/Boss.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="175" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9rlE82GrxsaOwhOjAUI2FDOQbTZO6dY6XLmRLJK62LAVZZnnhclH46lM3SOuG0n4sFuPs5f7k9Rp9w1nCroM7kplFCiA17kwY96I7nuEr143BDFq2WzhE2Rt49-DOxwjXxriaMnGDO9M/s1600/Boss.jpg" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Mockup of the boss</td></tr>
</tbody></table>
<br />
Once that was done, it was time to think about how split the whole thing up into boss 'building blocks'. In the image above, you can see two building blocks: a tunnel-segment and a door. When I was satisfied with that, I created an initial version of the texture. First collected some style reference though! It's imperative that you unwrap all segments first before copying them. That's what I'm doing now. When that's done, I can weld them all together and do some final modeling and texturing of stuff I can't do with the building blocks. Then we test it some more, and then we can do the lighting for the whole thing!<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhN_9CRpM0Rz3jfcdicXJdGI4HwAFU_yeRAyXsMkQyxR0EaTHIBvmdAk6E4MQVEyKu4e7-SAOUoxlIFceAZNsp1vnP0aMeq0OFbDVuMk9FXu21VqqCCo9MSxSuj46AEnnSeUO8SqLboPIU/s1600/BuildingBlocks.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="175" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhN_9CRpM0Rz3jfcdicXJdGI4HwAFU_yeRAyXsMkQyxR0EaTHIBvmdAk6E4MQVEyKu4e7-SAOUoxlIFceAZNsp1vnP0aMeq0OFbDVuMk9FXu21VqqCCo9MSxSuj46AEnnSeUO8SqLboPIU/s1600/BuildingBlocks.jpg" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Building blocks</td></tr>
</tbody></table>
<br />
Lucky for me, I have 2 other guys working on some other neat stuff going on in the boss fight (can't tell too much about it right now ;)). Awesome!!!<br />
<br />
Matt
<br />
<div class="fb-like" data-href="http://xformgamedevelopment.blogspot.nl/2013/01/whos-boss.html" data-send="true" data-show-faces="true" data-width="450">
</div>
Unknownnoreply@blogger.com29tag:blogger.com,1999:blog-1109055551036769632.post-5067018116662639412012-12-24T12:43:00.001+01:002012-12-24T13:35:43.347+01:00Happy Holidays!<div id="fb-root">
</div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script><br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSmY2VVkWaTfq5Tc_PDdqVzoJHBcnYQF7RI2ZfyhWYieYOhOl14ZSe1m87Iw1MNVMP9undtbytqIH-vEH2ZQb0XYSv1cbfzPhglOFpoLy62EplpOzr-f9JLoksccJbKjAFmKlQY4mH3n4/s1600/Christmascard2013.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="225" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSmY2VVkWaTfq5Tc_PDdqVzoJHBcnYQF7RI2ZfyhWYieYOhOl14ZSe1m87Iw1MNVMP9undtbytqIH-vEH2ZQb0XYSv1cbfzPhglOFpoLy62EplpOzr-f9JLoksccJbKjAFmKlQY4mH3n4/s1600/Christmascard2013.jpg" width="400" /></a></div>
<div>
<br /></div>
<div>
<br /></div>
2012 was a great year for us with lots of games released. We all look forward to 2013, because we know it'll be another year packed with awesome Xform games. Best wishes to all of you and remember...<br />
<div>
Keep on playing!<br />
<div>
<br /></div>
<div>
Cheers,</div>
<div>
Xform</div>
</div>
<div class="fb-like" data-href="http://xformgamedevelopment.blogspot.nl/2012/12/happy-holidays.html" data-send="true" data-show-faces="true" data-width="450">
</div>
Unknownnoreply@blogger.com1tag:blogger.com,1999:blog-1109055551036769632.post-60020209302089077652012-12-20T23:10:00.002+01:002012-12-21T11:12:28.523+01:00Xform prevails 12-21<div id="fb-root">
</div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
Hey everyone!<br />
<br />
If we have to believe the Mayan calendar this should be the last blog of Xform ever!!
So they gave me the honour to create the last blog!<br />
But Xform will prevail anyway! Hahaha...<br />
<br />
This week is all about the menu and interface of the new race game and no not of Burning Rubber 5, but a race game way cooler than that one!! Ha!
I already created some mockup screens a couple of weeks ago. So after the mockup we going to replace the placeholder objects with some self created stuff.<br />
<br />
<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYZkrewz7z-UBdPwJ8LxJW53OLSz0BCPKE6XEJ20roBMz9c_qvwdadeE2VxfG3XJP7d5RbOs5Lr2ZAjWMARpG7OUVptwi0Mao3-QZDetzH70QLclJQN9akqVtMNO6q3pfLnOp4FsrQNc4/s1600/Main1.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="180" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYZkrewz7z-UBdPwJ8LxJW53OLSz0BCPKE6XEJ20roBMz9c_qvwdadeE2VxfG3XJP7d5RbOs5Lr2ZAjWMARpG7OUVptwi0Mao3-QZDetzH70QLclJQN9akqVtMNO6q3pfLnOp4FsrQNc4/s320/Main1.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Before</td></tr>
</tbody></table>
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh73Ma2AupohRmtHFxveDLj3caW7HrV89hKDUWdaDsNizelHhpQZ5wjernyvLgbNRVP0mTkqBrjDsCgBDdzDqOtolLzwAKphHmfVCPvgBEdg9ZCkMYsgKaOQRo8Vj8iskYasE4-ISvBGlE/s1600/Main2.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="180" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh73Ma2AupohRmtHFxveDLj3caW7HrV89hKDUWdaDsNizelHhpQZ5wjernyvLgbNRVP0mTkqBrjDsCgBDdzDqOtolLzwAKphHmfVCPvgBEdg9ZCkMYsgKaOQRo8Vj8iskYasE4-ISvBGlE/s320/Main2.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">After</td></tr>
</tbody></table>
As you can see some small things were replaced. For example the background, when I'm creating a mockup screen I use pictures of games/movies, to create a style so I can see what colours I will use.
The title of the game in both screens is a working title and will be replaced after the title is final.
Here another example.<br />
<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJCNf8A-V5D_3ddBrKsloKbD7GeqnrilEWlNxvSzNz4j4nWT_51WRf5MgNLV7lbvcAMF9HSnetrMevmCAj_REHFNwxdq7U42X7MdcLxjAjMsoplgdddTxrOM_xR9JFc3ugE3MaGKVMFuY/s1600/Shop2.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="180" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJCNf8A-V5D_3ddBrKsloKbD7GeqnrilEWlNxvSzNz4j4nWT_51WRf5MgNLV7lbvcAMF9HSnetrMevmCAj_REHFNwxdq7U42X7MdcLxjAjMsoplgdddTxrOM_xR9JFc3ugE3MaGKVMFuY/s320/Shop2.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Before</td></tr>
</tbody></table>
<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTm40TB9jrQ3zVml_wHF5VHOs6rMD_3YI1FUEzHrNBhnK5YTdeE_kRb901eWakdns-lBl_Vam-7AFglmOzR_HA4YpenkyrM3wCfiaXLge1T3zOErZWHoII4QoL2_MPH6kX3MeAC5JTxkE/s1600/Shop1.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="180" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTm40TB9jrQ3zVml_wHF5VHOs6rMD_3YI1FUEzHrNBhnK5YTdeE_kRb901eWakdns-lBl_Vam-7AFglmOzR_HA4YpenkyrM3wCfiaXLge1T3zOErZWHoII4QoL2_MPH6kX3MeAC5JTxkE/s320/Shop1.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">After</td></tr>
</tbody></table>
In the mockup screen you can see I used some random pictures as icons and replaced later with our own stuff.
A thing we always do, is placing the back button left and the next/continue button right.
It’s a thing everyone does, you want to move forward. Same with reading, you read from left to right. So left --> right! Check our previous games and you will see. ;)
<br />
<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUzG382-xGgkLQNYJRYay7PXLi5DBp23oe527i8T38Q1ZhfKDPCPwiNDuuZkKtHrKoV-JvO1j7tXuC6YYYRBxGFhK1WXLtjLN7VyOe5bQLqKHRZSSynOe-MkbyWk7fNcePoEEioRRyNik/s1600/Shop.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="180" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUzG382-xGgkLQNYJRYay7PXLi5DBp23oe527i8T38Q1ZhfKDPCPwiNDuuZkKtHrKoV-JvO1j7tXuC6YYYRBxGFhK1WXLtjLN7VyOe5bQLqKHRZSSynOe-MkbyWk7fNcePoEEioRRyNik/s320/Shop.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Back Button on the left. Next button on the right.</td></tr>
</tbody></table>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
Or in some cases there are no next buttons, for instance if you need to check the How to Play screen.
<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggUwt5ZuP3G_SLMwX3manII3_vP9dCJFwOdViWSY2KvNbGQEiblu9eOedfUWdYqVAnUSGZbUKmK_CiNE24YaNPk1rSfQnerua3j2IQYIk5HSo_g5lEqbmgp1T5aYRtIIZoYVkyiuj9w_o/s1600/Howtplay.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="180" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggUwt5ZuP3G_SLMwX3manII3_vP9dCJFwOdViWSY2KvNbGQEiblu9eOedfUWdYqVAnUSGZbUKmK_CiNE24YaNPk1rSfQnerua3j2IQYIk5HSo_g5lEqbmgp1T5aYRtIIZoYVkyiuj9w_o/s320/Howtplay.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Back Button on the left.</td></tr>
</tbody></table>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
So, that was it for today!<br />
Now back to work!<br />
<br />
Hails!<br />
Eugène
<br />
<div class="fb-like" data-href="http://xformgamedevelopment.blogspot.nl/2012/12/xform-prevails-12-21.html" data-send="true" data-show-faces="true" data-width="450">
</div>
Unknownnoreply@blogger.com1tag:blogger.com,1999:blog-1109055551036769632.post-89462844749479446702012-12-19T09:35:00.000+01:002012-12-19T10:03:50.253+01:00Character Animation II<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<br />
<div class="MsoNormal">
<span style="background: white; color: #222222; font-family: "Arial","sans-serif"; font-size: 9.5pt;">Hello all!</span></div>
<div class="MsoNormal" style="background: white;">
<br /></div>
<div class="MsoNormal" style="background: white;">
<span style="color: #222222; font-family: "Arial","sans-serif"; font-size: 9.5pt;">Today I want to tell you guys
something about 3D character animation in our games. Most of our
games are vehicle or car based, what has the advantage of not having 3D
characters walking around on the screen. I call this an advantage because
making games which feature 3D characters, or bone based animations takes more
time and effort than games without them.<o:p></o:p></span></div>
<div class="MsoNormal" style="background: white;">
<br /></div>
<div class="MsoNormal" style="background: white;">
<span style="color: #222222; font-family: "Arial","sans-serif"; font-size: 9.5pt;">For the character rigs we use
biped and / or CAT-rigs. One has several advantages over the other as well as
the other way around. The character in the image below uses a biped skeleton.
Each vertex of the character mesh is linked to a bone, or several bones in the
skeleton. By transforming (moving and rotating) the bones in 3D space we are
able to pose the character.</span></div>
<div class="MsoNormal" style="background: white;">
<span style="color: #222222; font-family: "Arial","sans-serif"; font-size: 9.5pt;"><br /></span></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="MsoNormal" style="background: white;">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLtWd7Wdg9vTFi4azjhS7CcQ5DVoqniyySmSEEP4YuJw6ZWeev0Tm59KgdQelQQ88XfomLtUyYWy3NtjlfR9C0knuMOp4Hvg7BizHCeRp3d_MOU50m71HtgkkLUsA2CSjyp2CiAfCGt_Q/s1600/2.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLtWd7Wdg9vTFi4azjhS7CcQ5DVoqniyySmSEEP4YuJw6ZWeev0Tm59KgdQelQQ88XfomLtUyYWy3NtjlfR9C0knuMOp4Hvg7BizHCeRp3d_MOU50m71HtgkkLUsA2CSjyp2CiAfCGt_Q/s320/2.jpg" width="320" /></a></div>
<span style="color: #222222; font-family: "Arial","sans-serif"; font-size: 9.5pt;"><br /></span></div>
<div class="MsoNormal" style="background: white;">
<span style="color: #222222; font-family: "Arial","sans-serif"; font-size: 9.5pt;">The animations are done by
setting different poses of a character in a sequence, called keyframes. The
computer figures out most of the motion between these poses, so we don't have
to set every animation frame manually.<o:p></o:p></span></div>
<div class="MsoNormal" style="background: white;">
<br /></div>
<div class="MsoNormal" style="background: white;">
<span style="color: #222222; font-family: Arial, sans-serif; font-size: 9.5pt;">When we use 3D animated
characters in our games there are usually more than just one character walking
around. Think of enemies, friendly's or even maybe another player character.
The skeletons ( biped or CAT) we use, have the same structure and names for all
of the characters. This allows us to use all of our created animations on every
3D character in the game. A walk animation on one skeleton can work on a
slightly different skeleton too. I say slightly different.. Big changes in size
of the character or difference in the length of the limbs can affect the motion
of the animation. So as long as all characters are roughly the same shape it is
possible to use the same animations for them. This reduces the download
size a lot, we don't have to export all the animations for each unique
character doing so.</span><br />
<br /></div>
<div class="MsoNormal" style="background: white;">
<span style="color: #222222; font-family: "Arial","sans-serif"; font-size: 9.5pt;">Greetings,<o:p></o:p></span></div>
<div class="MsoNormal" style="background: white;">
<span style="color: #222222; font-family: "Arial","sans-serif"; font-size: 9.5pt;">Joep<o:p></o:p></span></div>
<div class="fb-like" data-href="http://xformgamedevelopment.blogspot.nl/2012/12/character-animation-ii.html" data-send="true" data-width="450" data-show-faces="true"></div>Unknownnoreply@blogger.com4tag:blogger.com,1999:blog-1109055551036769632.post-57562738273941162002012-12-10T17:17:00.001+01:002012-12-19T10:04:52.622+01:00Cheating 3D graphics<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<br />
<div class="MsoNoSpacing">
<span lang="EN-US" style="background: white; font-family: "Century Gothic","sans-serif"; mso-ansi-language: EN-US;">Hello all!<o:p></o:p></span></div>
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
<span lang="EN-US" style="background: white; font-family: "Century Gothic","sans-serif"; mso-ansi-language: EN-US;">After working on one of our new
racing games Its time to get back to the sniper game and finish up the game. When
a game is almost finished it needs to be tested and when that needs to happen
we mostly switch to a new game and work on that for a while. This way we get
enough time to test the game and gather all the bugs, think for new features or
e.g. simplify the game if it's too hard.
<o:p></o:p></span></div>
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqOWy4E4SkxvRGzAvzHFE5f7knqaj1xzYJnc3D0SCCvQifQC_Fk9BmACtTK8aeE-WK4BbI3p2o2WhHEzwBglP16f-V7oKKIxV5BsGm9ec3xFECFov8eZuf1UHj2_WOpzgHQ86rFyYuhRg/s1600/kill1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="205" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqOWy4E4SkxvRGzAvzHFE5f7knqaj1xzYJnc3D0SCCvQifQC_Fk9BmACtTK8aeE-WK4BbI3p2o2WhHEzwBglP16f-V7oKKIxV5BsGm9ec3xFECFov8eZuf1UHj2_WOpzgHQ86rFyYuhRg/s400/kill1.jpg" width="400" /></a></div>
<span lang="EN-US" style="background: white; font-family: "Century Gothic","sans-serif"; mso-ansi-language: EN-US;">Scrolling score is one of those
features that was created during a test session. One of the main aspects of the
game is to collect money to improve your team. And to do that you will need to
defend your base from waves of enemies. Those enemies will give you money only
when they did it wasn't rewarding enough. We heard a sound and we thought we
need to enlighten that part a bit more.<o:p></o:p></span></div>
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
<span lang="EN-US" style="background: white; font-family: "Century Gothic","sans-serif"; mso-ansi-language: EN-US;">So we came up to add a scrolling
score. The scrolling score would appear at the enemies position and scroll up
and removed after a while in 3D. Only a new problem was created, it needed to
be scaled because of the distance between you and the enemy. When you are close
or far away it needs to look the same, it can't be too big or too small. And to
create a system that would update all the score sign and scale them based on
the distance would take more time than just add them in the interface. <o:p></o:p></span></div>
<div class="MsoNoSpacing">
<br /></div>
<div class="MsoNoSpacing">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIaLJpY7gULiOC5uXZ2t3-huCCVT6EppMARqJAg-YEokx4t9yiecQzyKDfnNKaRZw-TodHvTK3YEhidzEyZuCrAekiHx2MmwdLXdRQbX9MowTZ0DLYEqVLoRg1BbA9F2ZG7MoJlVm3JQE/s1600/kill2.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="205" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIaLJpY7gULiOC5uXZ2t3-huCCVT6EppMARqJAg-YEokx4t9yiecQzyKDfnNKaRZw-TodHvTK3YEhidzEyZuCrAekiHx2MmwdLXdRQbX9MowTZ0DLYEqVLoRg1BbA9F2ZG7MoJlVm3JQE/s400/kill2.jpg" width="400" /></a></div>
<span lang="EN-US" style="background: white; font-family: "Century Gothic","sans-serif"; mso-ansi-language: EN-US;">But to let them appear in the
interface we need a 3d position and project that on the 2d interface. Create a
textField on that position and let it scroll. To let this happen we will need
to keep track of certain things, the <b>spawn
location</b>, <b>timer</b>, <b>scroll offset</b> and which <b>textfield</b>.<o:p></o:p></span></div>
<div class="MsoNoSpacing">
<span lang="EN-US" style="background: white; font-family: "Century Gothic","sans-serif"; mso-ansi-language: EN-US;">The <b>spawn location</b> is needed to calculate the projection to your
interface and when you turn your camera or move to a different location we will
need a new projection.<o:p></o:p></span></div>
<div class="MsoNoSpacing">
<span lang="EN-US" style="background: white; font-family: "Century Gothic","sans-serif"; mso-ansi-language: EN-US;">With the <b>timer</b> we will know when to disable and remove the textfield.<o:p></o:p></span></div>
<div class="MsoNoSpacing">
<span lang="EN-US" style="background: white; font-family: "Century Gothic","sans-serif"; mso-ansi-language: EN-US;">The<b> Scroll offset</b>, increase each frame and add it to the position.<o:p></o:p></span></div>
<div class="MsoNoSpacing">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsl023s8ONDQpZ64DAUtw2UZoQgqfKUQTbmkg-sbD77P1Gr3-_ZxkoEazplvTMdWaZtcxzg9nZtmVBoYEecd77XEV_4Iy7IK7gQrf-YWGhyphenhyphenP13_dLxHu-F6XEa6nUG82gmhb3DrgujLZk/s1600/Kill3.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="205" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsl023s8ONDQpZ64DAUtw2UZoQgqfKUQTbmkg-sbD77P1Gr3-_ZxkoEazplvTMdWaZtcxzg9nZtmVBoYEecd77XEV_4Iy7IK7gQrf-YWGhyphenhyphenP13_dLxHu-F6XEa6nUG82gmhb3DrgujLZk/s400/Kill3.jpg" width="400" /></a></div>
<br />
Greetings,<br />
Michael</div>
<div class="fb-like" data-href="http://xformgamedevelopment.blogspot.nl/2012/12/cheating-3d-graphics.html" data-send="true" data-width="450" data-show-faces="true"></div>Unknownnoreply@blogger.com0