<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Daniel Sefton</title>
	<atom:link href="http://www.danielsefton.com/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.danielsefton.com</link>
	<description></description>
	<lastBuildDate>Tue, 27 Mar 2012 03:42:38 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.2</generator>
		<item>
		<title>Building boost 1.49 with clang++, iOS 5.1 and Xcode 4.3</title>
		<link>http://www.danielsefton.com/2012/03/building-boost-1-49-with-clang-ios-5-1-and-xcode-4-3/</link>
		<comments>http://www.danielsefton.com/2012/03/building-boost-1-49-with-clang-ios-5-1-and-xcode-4-3/#comments</comments>
		<pubDate>Sun, 25 Mar 2012 23:28:48 +0000</pubDate>
		<dc:creator>Daniel</dc:creator>
				<category><![CDATA[Development]]></category>

		<guid isPermaLink="false">http://www.danielsefton.com/?p=653</guid>
		<description><![CDATA[<p>First of all, Apple haven&#8217;t updated the path given by xcode-select since 4.3. xcode-select -print-path will output &#8220;/Developer&#8221;. To update it for Xcode 4.3&#8242;s new pathing, simply run:</p> <p>sudo xcode-select -switch /Applications/Xcode.app/Contents/Developer</p> <p>I have cloned the git repository of the excellent boost iOS framework script found here: <a href="http://goodliffe.blogspot.co.uk/2010/09/building-boost-framework-for-ios-iphone.html">http://goodliffe.blogspot.co.uk/2010/09/building-boost-framework-for-ios-iphone.html</a></p> <p>You can download all the necessary [...]]]></description>
			<content:encoded><![CDATA[<p>First of all, Apple haven&#8217;t updated the path given by xcode-select since 4.3. xcode-select -print-path will output &#8220;/Developer&#8221;. To update it for Xcode 4.3&#8242;s new pathing, simply run:</p>
<p><code>sudo xcode-select -switch /Applications/Xcode.app/Contents/Developer</code></p>
<p>I have cloned the git repository of the excellent boost iOS framework script found here: <a href="http://goodliffe.blogspot.co.uk/2010/09/building-boost-framework-for-ios-iphone.html">http://goodliffe.blogspot.co.uk/2010/09/building-boost-framework-for-ios-iphone.html</a></p>
<p>You can download all the necessary files from here, which most importantly contains the updated shell script:</p>
<p><a href="https://gitorious.org/~danielsefton/boostoniphone/danielseftons-boostoniphone">https://gitorious.org/~danielsefton/boostoniphone/danielseftons-boostoniphone</a></p>
<p>(You will find an xcode directory in there: I haven&#8217;t touched this and it probably won&#8217;t work &#8211; but this method is easier, trust me).</p>
<p>We&#8217;ll need to sacrifice some automation for now. I have commented out functionality for automatically unpacking the tar.bz file. Once you have cloned the repo, follow these steps:</p>
<p>1) Unpack boost_1_49_0.tar.bz2</p>
<p>2) Apply the &#8220;xcode_43.diff&#8221; patch from here: <a href="https://svn.boost.org/trac/boost/ticket/6686">https://svn.boost.org/trac/boost/ticket/6686</a> &#8211; Note: This is a temporary fix until boost officially supports Xcode 4.3. This may be an unnecessary step in the near future. When it is, it will be safe to re-enable auto unpacking by uncommenting &#8220;rm -rf $BOOST_SRC&#8221; in &#8220;cleanEverythingReadyToStart()&#8221; and &#8220;unpackBoost&#8221; after &#8220;Execution starts here&#8221;.</p>
<p>3) Run:</p>
<p><code>bash boost.sh</code></p>
<p>4) Wait and enjoy!</p>
<p>5) Note: If for any reason you wish to run the script again, because the script will not clean the boost build folder due to the patch we applied, you will get duplication errors in tools/build/v2/user-config.jam. Simply open it up and remove any code under &#8220;Python configuration&#8221;. Then you can happily re-run the script.</p>
<p>A final thanks to the following link for helping me update the script:</p>
<p><a href="http://stackoverflow.com/questions/9100723/using-boostfilesysystem-path-from-framework-on-ios">http://stackoverflow.com/questions/9100723/using-boostfilesysystem-path-from-framework-on-ios</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.danielsefton.com/2012/03/building-boost-1-49-with-clang-ios-5-1-and-xcode-4-3/feed/</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
		<item>
		<title>Game Engine Lessons Learned &#8211; Put Performance First</title>
		<link>http://www.danielsefton.com/2012/02/game-engine-lessons-learned-put-performance-first/</link>
		<comments>http://www.danielsefton.com/2012/02/game-engine-lessons-learned-put-performance-first/#comments</comments>
		<pubDate>Tue, 14 Feb 2012 19:18:03 +0000</pubDate>
		<dc:creator>Daniel</dc:creator>
				<category><![CDATA[Game Dev]]></category>

		<guid isPermaLink="false">http://www.danielsefton.com/?p=645</guid>
		<description><![CDATA[<p>After a 2 year stint of developing a fully featured game engine, I can now look back on what went right and what I should have done differently. One of my regrets is putting design over performance.</p> <p>It&#8217;s very tempting (and lets face it, easier) to write code to satisfy your natural logical thinking &#8211; [...]]]></description>
			<content:encoded><![CDATA[<p>After a 2 year stint of developing a fully featured game engine, I can now look back on what went right and what I should have done differently. One of my regrets is putting design over performance.</p>
<p>It&#8217;s very tempting (and lets face it, easier) to write code to satisfy your natural logical thinking &#8211; I don&#8217;t know if there&#8217;s a term for it, but I&#8217;ll refer to it as &#8220;direct programming&#8221;.</p>
<p>Object-Oriented design could in (many) cases be considered direct programming. It&#8217;s parallel to the way we see things &#8211; as objects. We design systems the way they are because it &#8220;makes sense&#8221; to us conceptually.</p>
<p>What you end up with is a pretty set of logical classes and functions that directly address your problems, and while you&#8217;re proud of your amazingly flexible and extensible architecture, things start to drag &#8211; and that&#8217;s when you begin to optimise.</p>
<p>Too late!</p>
<p>Do yourself a favour and think about cache coherence, memory management and parallelism before anything else. I&#8217;m not saying that you shouldn&#8217;t design a pretty architecture (you should), but if you design and write code without hardware in mind you&#8217;ll regret it later.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.danielsefton.com/2012/02/game-engine-lessons-learned-put-performance-first/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Building Ogre 3D on OSX</title>
		<link>http://www.danielsefton.com/2011/06/building-ogre-3d-on-osx/</link>
		<comments>http://www.danielsefton.com/2011/06/building-ogre-3d-on-osx/#comments</comments>
		<pubDate>Thu, 09 Jun 2011 12:16:38 +0000</pubDate>
		<dc:creator>Daniel</dc:creator>
				<category><![CDATA[Ogre 3D]]></category>
		<category><![CDATA[3d]]></category>
		<category><![CDATA[building]]></category>
		<category><![CDATA[mac]]></category>
		<category><![CDATA[ogre]]></category>
		<category><![CDATA[osx]]></category>
		<category><![CDATA[xcode]]></category>

		<guid isPermaLink="false">http://www.danielsefton.com/?p=337</guid>
		<description><![CDATA[<p>Following on from my popular <a href="http://blog.tidalware.com/2009/08/building-ogre-with-visual-studio/" target="_blank">Building Ogre with Visual Studio</a> guide, I&#8217;m going to show you how to build Ogre on OSX with XCode. This is the cause of a lot of frustration for those new to Ogre/mac, so I thought I&#8217;d address that and show just how easy it is. Let me [...]]]></description>
			<content:encoded><![CDATA[<p>Following on from my popular <a href="http://blog.tidalware.com/2009/08/building-ogre-with-visual-studio/" target="_blank">Building Ogre with Visual Studio</a> guide, I&#8217;m going to show you how to build Ogre on OSX with XCode. This is the cause of a lot of frustration for those new to Ogre/mac, so I thought I&#8217;d address that and show just how easy it is. Let me know in the comments if you have any problems/suggestions.</p>
<h2>Prerequisites</h2>
<ul>
<li>Download and install CMake. 2.8.0 is the most reliable when building Ogre, so grab 	cmake-2.8.0-Darwin-universal.dmg from: <a href="http://www.cmake.org/files/v2.8/" target="_blank">http://www.cmake.org/files/v2.8/</a></li>
<li>Download the latest dependencies package OgreDependencies_OSX_???.zip: <a href="http://sourceforge.net/projects/ogre/files/ogre-dependencies-mac/1.7/" target="_blank">http://sourceforge.net/projects/ogre/files/ogre-dependencies-mac/1.7/</a></li>
<li>Download Ogre from: <a href="https://bitbucket.org/sinbad/ogre/" target="_blank">https://bitbucket.org/sinbad/ogre/</a>. For this tutorial we will be using the 1.7 branch since this is the latest stable version. So where it says &#8220;branches&#8221;, choose &#8220;v1-7&#8243; from the dropdown. Then choose a package from &#8220;get source&#8221;.</li>
</ul>
<h2>Building Ogre</h2>
<p>Extract the Ogre package.</p>
<p>Extract the dependencies package and move the Dependencies folder to the root directory of Ogre.</p>
<p>Open CMake. Point “Where is the source code” to the root directory of Ogre. Now copy and paste that path into “Where to build the binaries” and add &#8220;/build&#8221; to the end.</p>
<p>Press Configure.</p>
<p>It should say &#8220;Build directory does not exist, should I create it?&#8221;. Choose Yes.</p>
<p>&#8220;Specify the generator for this project&#8221; should be &#8220;Xcode&#8221; and &#8220;Use default native compilers&#8221; should be checked.</p>
<p>Wait until configuration has finished.</p>
<p>At this point, you can choose the optional features you&#8217;d like to include when building Ogre. Below I have included a table of features which you may want to consider. Anything I haven&#8217;t included is not relevant for the purpose of this tutorial.</p>
<table border="1" bordercolor="#CCCCCC" width="600" cellpadding="1" cellspacing="0" style="font-size: 12px;">
<tr>
<th width="251" scope="col"><strong>Config value</strong></th>
<th width="330" scope="col"><strong>Description</strong></th>
</tr>
<tr>
<td>OGRE_BUILD_COMPONENT_PAGING</td>
<td>Ogre&#8217;s paging component. This must be checked if you also checked the terrain component below.</td>
</tr>
<tr>
<td>OGRE_BUILD_COMPONENT_PROPERTY</td>
<td>Ogre&#8217;s property component. It&#8217;s rare that you will need this, so leave it unchecked unless you know you need it.</td>
</tr>
<tr>
<td>OGRE_BUILD_COMPONENT_RTSHADERSYSTEM</td>
<td>Ogre&#8217;s <a href="http://www.ogre3d.org/tikiwiki/RT+Shader+System&#038;structure=Development" target="_blank">RT Shader System</a>. I highly recommend this if you are going to be working with shaders.</td>
</tr>
<tr>
<td>OGRE_BUILD_COMPONENT_TERRAIN</td>
<td>Ogre&#8217;s <a href="http://www.ogre3d.org/tikiwiki/Ogre+Terrain+System" target="_blank">terrain component</a>. Leave this checked if you need a terrain system for your project.</td>
</tr>
<tr>
<td>OGRE_BUILD_PLUGIN_BSP</td>
<td>The <a href="http://www.ogre3d.org/tikiwiki/SceneManagersFAQ#BSP_Scene_Manager" target="_blank">Binary Space Partitioning Scene Manager</a>. This is a pretty old format now, only check it if you know you need it.</td>
</tr>
<tr>
<td>OGRE_BUILD_PLUGIN_CG</td>
<td>The CG plugin. You probably want this if you&#8217;re going to work with shaders. Be warned that you may need to install the CG framework on mac if you don&#8217;t already have it. Check the CMake logs to ensure it has been found.</td>
</tr>
<tr>
<td>OGRE_BUILD_PLUGIN_OCTREE</td>
<td>The Octree Scene Manager. I recommend you leave this one checked.</td>
</tr>
<tr>
<td>OGRE_BUILD_PLUGIN_PCZ</td>
<td>The <a href="http://www.ogre3d.org/tikiwiki/Portal+Connected+Zone+Scene+Manager" target="_blank">Portal Connected Zone Scene Manager</a>.</td>
</tr>
<tr>
<td>OGRE_BUILD_PLUGIN_PFX</td>
<td>The ParticleFX plugin for Ogre. You probably need this.</td>
</tr>
<tr>
<td>OGRE_RENDERSYSTEM_GL</td>
<td>Ogre wouldn&#8217;t be very useful without this <img src='http://www.danielsefton.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </td>
</tr>
<tr>
<td>OGRE_BUILD_SAMPLES</td>
<td>Leave it checked if you are new to Ogre and want to check out it&#8217;s samples. Uncheck this if you want faster build times.</td>
</tr>
<tr>
<td>OGRE_CONFIG_THREADS</td>
<td>0 to disable threading. 2 if you only want resource preparation to be threaded. 1 if you want both resource preparation and loading to be threaded. <strong>Caution: You may get link errors related to architecture if threading is enabled due to outdated dependencies. I&#8217;ll update this guide as soon as I find a solution.</strong></td>
</tr>
<tr>
<td>OGRE_STATIC</td>
<td>Check this if you want to build Ogre statically.</td>
</tr>
</table>
<p>Press Configure again. The config values should turn white.</p>
<p>Press Generate.</p>
<p>Navigate to the build directory and open OGRE.xcodeproj.</p>
<p>Select the configuration you wish to build for (by default it&#8217;s set to Debug). I&#8217;d recommend building both Debug and Release.</p>
<p>Hit Build -> Build, or Cmd + B.</p>
<p>Grab some coffee and enjoy <img src='http://www.danielsefton.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </p>
]]></content:encoded>
			<wfw:commentRss>http://www.danielsefton.com/2011/06/building-ogre-3d-on-osx/feed/</wfw:commentRss>
		<slash:comments>10</slash:comments>
		</item>
		<item>
		<title>Making a Successful Game in 32 Hours</title>
		<link>http://www.danielsefton.com/2011/06/making-a-successful-game-in-32-hours/</link>
		<comments>http://www.danielsefton.com/2011/06/making-a-successful-game-in-32-hours/#comments</comments>
		<pubDate>Mon, 06 Jun 2011 23:26:16 +0000</pubDate>
		<dc:creator>Daniel</dc:creator>
				<category><![CDATA[General]]></category>
		<category><![CDATA[XNA]]></category>
		<category><![CDATA[32 hours]]></category>
		<category><![CDATA[blind panic]]></category>
		<category><![CDATA[competition]]></category>
		<category><![CDATA[ducks in space]]></category>
		<category><![CDATA[multiplayer]]></category>
		<category><![CDATA[split screen]]></category>
		<category><![CDATA[xna]]></category>

		<guid isPermaLink="false">http://www.danielsefton.com/?p=168</guid>
		<description><![CDATA[<p>Blind Panic is an annual competition held at Huddersfield University. You can check out a summary of the event along with details about the competitors and winners <a href="http://www.hudunigames.co.uk/2011/06/blind-panic-game-camp-2011/" target="_blank">here</a>.</p> <p>Our task was to make a game in 32 hours themed &#8220;Ducks in Space&#8221; with a team of 4 or 5. We were allowed to [...]]]></description>
			<content:encoded><![CDATA[<p>Blind Panic is an annual competition held at Huddersfield University. You can check out a summary of the event along with details about the competitors and winners <a href="http://www.hudunigames.co.uk/2011/06/blind-panic-game-camp-2011/" target="_blank">here</a>.</p>
<p>Our task was to make a game in 32 hours themed &#8220;Ducks in Space&#8221; with a team of 4 or 5. We were allowed to use libraries and frameworks, but no engines. We also had to produce a trailer within the time frame, which you can watch below:</p>
<p><iframe width="560" height="349" src="http://www.youtube.com/embed/t7bUl6fMe4A" frameborder="0" allowfullscreen></iframe></p>
<p><strong>Preparation</strong></p>
<p>Weeks before the competition we began to discuss various ideas. Of course, we were oblivious to the theme, but we figured we could adapt our ideas to the theme when announced. Our ideas included a stealth game, a top-down split-screen tanks game, a split-screen racing game, and one of the designers introduced me to <a href="http://www.youtube.com/watch?v=O9piUeupkQs" rel="shadowbox[sbpost-168];player=swf;width=640;height=385;" target="_blank">PixelJunk Shooter</a>.</p>
<p>The day before the competition our team got together and we had some final discussions, looking at various indie games and past competition winners. We even started to discuss various art styles.</p>
<p><strong>Technology</strong></p>
<p>We narrowed down our platforms of choice to Ogre 3D, Cocos2D and XNA. Despite the fact most of my experience is with Ogre, attempting to make a complete game in 32 hours with C++, including pulling together libraries for physics, audio and GUI, would have been slightly crazy. My knowledge of Cocos2D is average, and there are a whole bunch of extra complexities involved when developing for iPhone. So I decided to play it safe and choose XNA.</p>
<p><strong>The Idea</strong></p>
<p>As soon as the theme was announced, we began to pull together our ideas and within 15 minutes had a solid plan for our game. I asked one of our designers to outline everything we had come up with in a tidy logical design document for me to refer to:</p>
<div id="attachment_299" class="wp-caption alignnone" style="width: 160px"><a href="http://www.danielsefton.com/wp-content/uploads/2011/06/designdoc.png" rel="shadowbox[sbpost-168];player=img;"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/designdoc-150x150.png" alt="" title="designdoc" width="150" height="150" class="size-thumbnail wp-image-299" /></a><p class="wp-caption-text">The Design Document</p></div>
<p>In fact, many of the mechanics listed above did not make it into the final game.</p>
<p><strong>The Final Idea</strong></p>
<p>The night before the deadline I began to implement bullet collision, and in doing so left the body type as dynamic. Bullets were flying around the map colliding with the walls, and I could push them around. It reminded me of <a href="http://www.sheepgame.co.uk/" target="_blank">Sheep Game</a>, and it struck me that it could work extremely well as a central mechanic. It would be easier to implement, too. The designers had to take my word for it, and a few hours later gameplay was fully functional. We connected 4 controllers, and it was instantly obvious we had nailed something fun and addictive.</p>
<p><strong>Art Style</strong></p>
<p>We went for an old school sci-fi theme with jetpacks, weapons and bubble helmets:</p>
<div id="attachment_305" class="wp-caption alignnone" style="width: 160px"><a href="http://www.danielsefton.com/wp-content/uploads/2011/06/Finalduck.jpg" rel="shadowbox[sbpost-168];player=img;"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/Finalduck-150x150.jpg" alt="" title="Finalduck" width="150" height="150" class="size-thumbnail wp-image-305" /></a><p class="wp-caption-text">Duck Concept Art</p></div>
<p>Our logo reflected the old school theme:</p>
<div id="attachment_303" class="wp-caption alignnone" style="width: 160px"><a href="http://www.danielsefton.com/wp-content/uploads/2011/06/title2.png" rel="shadowbox[sbpost-168];player=img;"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/title2-150x150.png" alt="" title="title2" width="150" height="150" class="size-thumbnail wp-image-303" /></a><p class="wp-caption-text">Game Logo</p></div>
<p>The name of the game is controversial, but it certainly stuck in the minds of the judges. It&#8217;s all about making your game stand out from the rest.</p>
<p><strong>Multiplayer &#038; Split-Screen</strong></p>
<p>After reviewing previous competitions, and watching videos of interviews with judge reactions, I came to the conclusion that the game had to be something which actively involved the judges. Since XNA has Xbox controller support, it was only natural that we introduced some form of cooperative play.</p>
<p>Most modern games have moved on from classic split-screen multiplayer, but that doesn&#8217;t mean it no longer works. Classic multiplayer games like Goldeneye still hold their fun factor even by today&#8217;s standards. Everyone is in the same room, laughing and ranting together. You don&#8217;t get the same experience with online gaming these days.</p>
<div id="attachment_177" class="wp-caption alignnone" style="width: 160px"><a href="http://www.danielsefton.com/wp-content/uploads/2011/06/252420_10150196033709423_588724422_7008659_4179331_n.jpg" rel="shadowbox[sbpost-168];player=img;"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/252420_10150196033709423_588724422_7008659_4179331_n-150x150.jpg" alt="" title="252420_10150196033709423_588724422_7008659_4179331_n" width="150" height="150" class="size-thumbnail wp-image-177" /></a><p class="wp-caption-text">Split-Screen multiplayer is fun!</p></div>
<p><strong>Controls</strong></p>
<p>Left thumbstick is move and the right trigger is shoot. That is all you need to know to play our game. Anybody can pick up the controller and start playing. Not only that, but you can transverse the map and take part in the fun even if you don&#8217;t manage to get eggs, die, or even mash the buttons.</p>
<div id="attachment_172" class="wp-caption alignnone" style="width: 160px"><a href="http://www.danielsefton.com/wp-content/uploads/2011/06/246725_10150196034549423_588724422_7008669_902056_n.jpg" rel="shadowbox[sbpost-168];player=img;"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/246725_10150196034549423_588724422_7008669_902056_n-150x150.jpg" alt="" title="246725_10150196034549423_588724422_7008669_902056_n" width="150" height="150" class="alignnone size-thumbnail wp-image-174" /></a><p class="wp-caption-text">Everyone picking up the controller and having a go! (Image (c) Duke Gledhill)</p></div>
<p><strong>Simplicity</strong></p>
<p>The aim of our game is simple. We were able to explain how to play our game in 2 short sentences: &#8220;Push as many eggs as possible into the nest before the time is up. Use the left thumbstick to move and right trigger to fire&#8221;. This is core to widespread success of an indie game. Angry Birds, Tiny Wings, Cut the Rope, you name it.</p>
<div id="attachment_307" class="wp-caption alignnone" style="width: 160px"><a href="http://www.danielsefton.com/wp-content/uploads/2011/06/helpscreen.jpg" rel="shadowbox[sbpost-168];player=img;"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/helpscreen-150x150.jpg" alt="" title="helpscreen" width="150" height="150" class="size-thumbnail wp-image-307" /></a><p class="wp-caption-text">Simple!</p></div>
<p><strong>Completion</strong></p>
<p>There is nothing worse than having broken features which hinder gameplay, and having to explain this to players. As an example, half way through development I hadn&#8217;t yet implemented collision. Not only that, but players could also travel beyond the bounds of the map and get lost; meaning I had to grab back the controller and correct it for them. I had to explain it wasn&#8217;t yet implemented and how &#8220;it would be cool if it was, honest&#8221;.</p>
<p>In the end, our game was idiot proof, nothing could break it &#8211; collision was perfect, you couldn&#8217;t get stuck, you couldn&#8217;t fall off, there weren&#8217;t any edge case bugs. Players could focus on enjoying the game itself without worrying about messing stuff up.</p>
<div id="attachment_181" class="wp-caption alignnone" style="width: 160px"><a href="http://www.danielsefton.com/wp-content/uploads/2011/06/250310_10150196033649423_588724422_7008658_563037_n.jpg" rel="shadowbox[sbpost-168];player=img;"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/250310_10150196033649423_588724422_7008658_563037_n-150x150.jpg" alt="" title="250310_10150196033649423_588724422_7008658_563037_n" width="150" height="150" class="size-thumbnail wp-image-181" /></a><p class="wp-caption-text">No need for the programmer to intervene.</p></div>
<p><strong>Audio</strong></p>
<p>The <a href="http://soundcloud.com/zakrush/ducks-in-space-main-theme" target="_blank">background track</a> of our game was essential in defining the pace of the game. The sense of fast paced action helped to keep players on their toes. Our sound guy Zak Rush met up with our team to compose the track especially.</p>
<p><strong>Trailer</strong></p>
<p>Within the 32 hours we also had to produce a trailer for our game. Trailers are a keystone for marketing games; they give the player a taste of what your game is about and what they might expect to experience when picking up the controller for themselves. It really helped to &#8220;sell&#8221; our game to the judges.</p>
<div id="attachment_172" class="wp-caption alignnone" style="width: 160px"><a href="http://www.danielsefton.com/wp-content/uploads/2011/06/248840_10150196032569423_588724422_7008645_2259604_n.jpg" rel="shadowbox[sbpost-168];player=img;"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/248840_10150196032569423_588724422_7008645_2259604_n-150x150.jpg" alt="" title="248840_10150196032569423_588724422_7008645_2259604_n" width="150" height="150" class="size-thumbnail wp-image-172" /></a><p class="wp-caption-text">Making our trailer in After Effects</p></div>
<p><strong>Communication</strong></p>
<p>We made extensive use of Facebook&#8217;s chat facilities. We were in contact 24/7 even when our team was not physically present. It was nice to take some time out to work on the game individually in a quiet environment; it meant we could crunch harder and faster with minimal distraction.</p>
<p><strong>Team Spirit</strong></p>
<p>Last but certainly not least, every member of our team worked extremely well together. I cannot stress how important this is. Everybody had an equal sense of worth, and there was no shortage of motivation. As the only programmer, I tried to make sure everyone was well occupied and constantly turning over assets useful to anything I was currently working on. Maximising efficiency is key to achieving great things within such a short space of time.</p>
<div id="attachment_186" class="wp-caption alignnone" style="width: 160px"><a href="http://www.danielsefton.com/wp-content/uploads/2011/06/249455_10150196032629423_588724422_7008646_1934767_n.jpg" rel="shadowbox[sbpost-168];player=img;"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/249455_10150196032629423_588724422_7008646_1934767_n-150x150.jpg" alt="" title="249455_10150196032629423_588724422_7008646_1934767_n" width="150" height="150" class="size-thumbnail wp-image-186" /></a><p class="wp-caption-text">Discussing ideas</p></div>
<p><strong>The Result</strong></p>
<p>We won Best Game Award &#8211; 1st Prize. Judges included employees from Rockstar, Revolution Software and Team 17.</p>
<div id="attachment_138" class="wp-caption alignnone" style="width: 160px"><a href="http://www.danielsefton.com/wp-content/uploads/2010/10/BestGame_1st-SMALL.jpg" rel="shadowbox[sbpost-168];player=img;"><img src="http://www.danielsefton.com/wp-content/uploads/2010/10/BestGame_1st-SMALL-150x150.jpg" alt="" title="BestGame_1st-SMALL" width="150" height="150" class="size-thumbnail wp-image-138" /></a><p class="wp-caption-text">From left to right, Lewis Bibby, Andy Neil, Dr. Rupert Ward (prize giver), Sam Read, Daniel Sefton</p></div>
]]></content:encoded>
			<wfw:commentRss>http://www.danielsefton.com/2011/06/making-a-successful-game-in-32-hours/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Create Your Own Racetrack with Blender 2.49</title>
		<link>http://www.danielsefton.com/2011/06/create-your-own-racetrack-with-blender-2-49/</link>
		<comments>http://www.danielsefton.com/2011/06/create-your-own-racetrack-with-blender-2-49/#comments</comments>
		<pubDate>Mon, 06 Jun 2011 15:17:33 +0000</pubDate>
		<dc:creator>Daniel</dc:creator>
				<category><![CDATA[Blender 3D]]></category>
		<category><![CDATA[Tutorial]]></category>
		<category><![CDATA[3d]]></category>
		<category><![CDATA[blender]]></category>
		<category><![CDATA[racetrack]]></category>
		<category><![CDATA[tutorial]]></category>

		<guid isPermaLink="false">http://www.danielsefton.com/?p=231</guid>
		<description><![CDATA[Introduction <p>I have finally revived the popular racetrack tutorial I wrote in 2006, as featured on <a href="http://www.blendernation.com/2006/06/30/create-your-own-racetrack/" target="_blank">Blender Nation</a>. This tutorial was originally written for 2.40, and I have updated it for 2.49. Sometime in the future I will port it to 2.5x.</p> <p>You can download the end result here:</p> <p><a href='http://www.danielsefton.com/wp-content/uploads/2011/06/DanielSefton.com-Racetrack-Tutorial-Files.zip'>DanielSefton.com &#8211; Racetrack [...]]]></description>
			<content:encoded><![CDATA[<h2>Introduction</h2>
<p>I have finally revived the popular racetrack tutorial I wrote in 2006, as featured on <a href="http://www.blendernation.com/2006/06/30/create-your-own-racetrack/" target="_blank">Blender Nation</a>. This tutorial was originally written for 2.40, and I have updated it for 2.49. Sometime in the future I will port it to 2.5x.</p>
<p>You can download the end result here:</p>
<p><a href='http://www.danielsefton.com/wp-content/uploads/2011/06/DanielSefton.com-Racetrack-Tutorial-Files.zip'>DanielSefton.com &#8211; Racetrack Tutorial Files.zip</a></p>
<p>In this huge tutorial you will learn how to model, texture, light, and test a low poly racetrack. I have tried my best to explain everything in as much detail as possible, but I would advise that if you are new to Blender that you brush up on the basics so that you have a good grounding ready for the more complex methods and features discussed in this tutorial.</p>
<h2>Preparations</h2>
<p><strong>Designing the track</strong></p>
<p>Obviously before we get going, we need to make preparations. To start you need to think about the design of your track, and create a reference image to work from. The following track design is the one I will be using for this tutorial; if you use it or not is up to you, although it would be nice if you could work with your own. You can easily follow from another design.</p>
<div id="attachment_232" class="wp-caption alignnone" style="width: 343px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_trackdesign.jpg" alt="" title="blender_trackdesign" width="333" height="416" class="size-full wp-image-232" /><p class="wp-caption-text">Track Design</p></div>
<p>As you can see the design is fairly basic, but it contains just enough curves for good practice with the bezier tool, which will be explained in the next part of this tutorial.</p>
<p><strong>Importing the design</strong></p>
<p>Once you have your design ready and saved as an image on your computer, we need to import it into Blender. Open the program and delete the default setup. We want the image to display in the background, so, select &#8216;View&#8217; in the 3D window toolbar and click on &#8216;Background Image&#8217;. You will see a small box pop up. Activate the &#8216;Use Background Image&#8217; button. It should now look like this:</p>
<div id="attachment_233" class="wp-caption alignnone" style="width: 233px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_backgroundbox.jpg" alt="" title="blender_backgroundbox" width="223" height="157" class="size-full wp-image-233" /><p class="wp-caption-text">Background Box</p></div>
<p>If you are wondering what the various settings are: &#8216;Blend&#8217; applies transparency to the image, for blending it into the background, &#8216;Size&#8217; defines the size of the image, and the X/Y offsets are used to position the image.</p>
<p>Next, click the small folder icon to the right of the &#8216;Image&#8217; text. You will then see the &#8216;open dialog box&#8217;. Find the location of the image you want to use and then press the &#8216;Select Image&#8217; button in the top right. The image should now appear in the background. Then click the &#8216;X&#8217; to close the box so that it doesn&#8217;t get in the way. Note that image backgrounds only display in a fixed, orthographic view, not in perspective, and only in predefined views such as &#8216;top&#8217;, &#8216;front&#8217; etc.</p>
<h2>Modeling The Track &#8211; Part 1</h2>
<p><strong>Adding curves</strong></p>
<p>To start off, we need to add a bezier curve. Bring up the main menu by pressing &#8216;SPACE&#8217; and select &#8216;Add > Curve > Bezier Curve&#8217;. You will notice a curved line appear in the 3D view. Now, move it to a part on the outside of the track so you can begin to &#8216;trace&#8217; around it.</p>
<p>To adjust the curve simply move the different vertices around (The small dot handles) by right clicking on them and pressing the G key or drawing a movement line. The vertex in the center of the three at each point moves the curve and the two on the outside rotates it.</p>
<p>You can also perform all the other basic transformations like size (&#8216;S&#8217; key) and rotation (&#8216;R&#8217; key). To accurately select the vertices, press the &#8216;B&#8217; key once for box select and the &#8216;B&#8217; key once again for circle selection. The latter gives you more control over selection. Use your scroll wheel or +/- to increase/decrease the size of the circle and press &#8216;ESC&#8217; to exit it.</p>
<p><strong>Tracing the track</strong></p>
<p>Now that you are familiar with how to transform the curve, begin to trace around the outside of the track with the curve. You can add another joint by either selecting the center vertex on one of the sides, holding &#8216;SHIFT&#8217; and again right clicking on the center vertex or by pressing &#8216;E&#8217; to extrude it. You can disable the transformation widget if it gets in the way by deselecting the hand button in the 3D window toolbar. It should look start to look something like this:</p>
<div id="attachment_236" class="wp-caption alignnone" style="width: 362px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_curvestart.jpg" alt="" title="blender_curvestart" width="352" height="168" class="size-full wp-image-236" /><p class="wp-caption-text">Curve Start</p></div>
<p>Transforming the curves can be tricky &#8211; just keep practising and you will get the hang of it eventually.</p>
<p>When you&#8217;re happy, carry on adding curves all the way around the track. Once finished you&#8217;ll probably be thinking &#8220;is there a way to join them up?&#8221; well, yes there is. If you press &#8216;C&#8217; it will join the two ends of the curves together. However, I suggest that you don&#8217;t do this because it will prove to be a problem when it comes to editing the mesh. You can easily join it up manually after converting the curves. By now it should look something like this:</p>
<div id="attachment_237" class="wp-caption alignnone" style="width: 410px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_curveend.jpg" alt="" title="blender_curveend" width="400" height="503" class="size-full wp-image-237" /><p class="wp-caption-text">Curve End</p></div>
<p><strong>Adding depth</strong></p>
<p>Now that we have traced the outline of the track, we can start to add depth. So, exit edit mode (&#8216;TAB&#8217;) and add another bezier curve (&#8216;SPACE&#8217; > Add > Curve > Bezier Curve). This curve profile is what we are going to use to extrude around the track to form the road. So that we don&#8217;t end up with a wonky mesh, we need to straighten the curve. You can do this by pressing &#8216;V&#8217;. Depending on what you want your track to be like, you can add more curve joints. This will add another mesh column to your track so you can add things like a track side, barriers and rumble strips. For my track, I am going to add just two extra joints for the inner landmass and the outer landmass. You&#8217;ll need to think about this carefully, because if you decide to add barriers and rumble strips later on, it won&#8217;t be an easy task. My curve now looks like this:</p>
<div id="attachment_238" class="wp-caption alignnone" style="width: 375px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_extrusioncurve.jpg" alt="" title="blender_extrusioncurve" width="365" height="57" class="size-full wp-image-238" /><p class="wp-caption-text">Extrusion Curve</p></div>
<p>Next, to extrude the curve around the track we need to associate a name with it. Exit edit mode (&#8216;TAB&#8217;) and go into the &#8216;editing&#8217; buttons. In The OB field in the far left box, enter a name (I usually call mine &#8216;cur&#8217;). Then, select the track curve and again in the editing buttons panel, in the far right box, enter the name you just called your extrusion curve into the BevOB field. If you now enter wireframe mode (&#8216;Z&#8217;) you will notice that it looks something like this:</p>
<div id="attachment_239" class="wp-caption alignnone" style="width: 410px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_trackafterextrusion.jpg" alt="" title="blender_trackafterextrusion" width="400" height="496" class="size-full wp-image-239" /><p class="wp-caption-text">Track After Extrusion</p></div>
<p>Looks a bit of a mess, doesn&#8217;t it? To sort out the overlapping all we need to do is increase the size of the track curve. Enter edit mode (&#8216;TAB&#8217;) and press &#8216;A&#8217; to select all the vertices, then increase the size with &#8216;S&#8217;. You can also fiddle about with the &#8216;Width&#8217; property in the &#8216;Curve and Surface&#8217; box which acts in a similar manner. When you then exit edit mode from the first method you will notice that the track looks a lot cleaner, as shown here:</p>
<div id="attachment_240" class="wp-caption alignnone" style="width: 410px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_resizedtrack.jpg" alt="" title="blender_resizedtrack" width="400" height="507" class="size-full wp-image-240" /><p class="wp-caption-text">Resized Track</p></div>
<p>Unfortunately, the track is now way too thin. Just have a play about with the track profile curve until you have it at an appropriate width. Don&#8217;t worry if it slightly overlaps at places, we can sort that out when we convert it to a mesh.</p>
<p>The amount of polygons (faces) in the track looks slightly high. Reducing the number will not only help the game performance but it will also make it much easier to close up the mesh later on. Because the track is still in curve mode we can control and adjust it however we want.</p>
<p>In the &#8216;Curves and Surfaces&#8217; box there is a grey field that says &#8216;DefResolU:&#8217;. At the moment, it is set to 12, so if we reduce that number right down to about 6-8, you will see it automatically reduces the amount of overall polygons. You may also notice that it has reduced overlapping even further. If, however, you feel that the track is too jagged at the edges, or you want a smoother track, by all means increase the value.</p>
<p>At this point I would begin cleaning up the design. Remember that when in-game you don&#8217;t want a wonky road or the corners to be too sharp. Enter edit mode and tweak the curves until everything is just about perfect (I would turn off the background while doing this). At this point it should look something like this:</p>
<div id="attachment_243" class="wp-caption alignnone" style="width: 410px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_reducedpolys.jpg" alt="" title="blender_reducedpolys" width="400" height="460" class="size-full wp-image-243" /><p class="wp-caption-text">Reduced Polys</p></div>
<p><strong>Adding elevation</strong></p>
<p>Finally, now that the track design is done you can enter perspective mode and start to add some elevation. Before you can transform the curves in 3D space, you need to enable it. Just below the &#8216;DefResolU:&#8217; field are three buttons, one of them labeled &#8217;3D&#8217;, select it and then you can begin.</p>
<p>You can switch to perspective mode by pressing &#8216;Num 5&#8242;. To add elevation, just enter edit mode, select the curve joint you want to change, press the &#8216;G&#8217; key and then press &#8216;Z&#8217; to move it vertically. You may not be able to make it out too well at this point, but here is what my track looks like with some elevation:</p>
<div id="attachment_244" class="wp-caption alignnone" style="width: 510px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_trackwithelevation.jpg" alt="" title="blender_trackwithelevation" width="500" height="159" class="size-full wp-image-244" /><p class="wp-caption-text">Track with elevation</p></div>
<h2>Modeling The Track &#8211; Part 2</h2>
<p><strong>Converting to mesh</strong></p>
<p>To start off we need to convert this track from curve to mesh form. Just as a backup or if anything goes horribly wrong &#8211; duplicate the track (SHIFT+D), scale the copy down and move it out of the way. To convert your curves, all you need to do is select the track, press ALT+C and select &#8216;Convert Curve to &#8211; Mesh&#8217;. Next, select the solid shading type in the 3D window header:</p>
<div id="attachment_247" class="wp-caption alignnone" style="width: 190px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_shadetypes.jpg" alt="" title="blender_shadetypes" width="180" height="157" class="size-full wp-image-247" /><p class="wp-caption-text">Shade Types</p></div>
<p>You should now see a grey shading of the track and when you switch to edit mode you will see a solid wireframe of the mesh:</p>
<div id="attachment_248" class="wp-caption alignnone" style="width: 410px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_trackmesh.jpg" alt="" title="blender_trackmesh" width="400" height="462" class="size-full wp-image-248" /><p class="wp-caption-text">Track Mesh</p></div>
<p><strong>Mesh cleaning</strong></p>
<p>Now that the track is converted we can start to fix it up in a lot more detail. If you look carefully there are a lot of purple dots, these are the vertices of the mesh and for now we will be adjusting these. Zoom right into where you see a glitch in the track, such as overlapping. To fix it, select and move the vertices in that area until you are happy that it looks ok. If by any chance the vertices are hidden under the mesh (due to overlapping) you can switch to wireframe mode (Z) and you will be able to see all the ones behind. Below is an example of a quick &#8216;before and after&#8217; of one of the corners:</p>
<div id="attachment_249" class="wp-caption alignnone" style="width: 510px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_glitchfix.jpg" alt="" title="blender_glitchfix" width="500" height="231" class="size-full wp-image-249" /><p class="wp-caption-text">Glitch Fix</p></div>
<p>Once you have finished cleaning up all the minor glitches I will show you how to close up the gap in the road. To do this you need to select the vertices/edges you want to close (either a tri or quad shape), and then press &#8216;F&#8217;. Once you have done that it may look a bit strange, again just fiddle about with the vertices until you are happy the shape blends in:</p>
<div id="attachment_250" class="wp-caption alignnone" style="width: 310px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_gapclosing.jpg" alt="" title="blender_gapclosing" width="300" height="273" class="size-full wp-image-250" /><p class="wp-caption-text">Gap Closing</p></div>
<p>You can now use this technique to remove unnecessary polygons in the straight parts of the track. Just be careful not to remove too many around the elevation points. Select the vertices you wish to remove, press DELETE on your keyboard, then press &#8216;Erase &#8211; Vertices&#8217; and join the two remaining sides:</p>
<div id="attachment_251" class="wp-caption alignnone" style="width: 511px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_removingpolys.jpg" alt="" title="blender_removingpolys" width="501" height="250" class="size-full wp-image-251" /><p class="wp-caption-text">Removing Polys</p></div>
<p>Next it is time to begin closing up the track to add a bit of &#8216;landmass&#8217;. There are several techniques for doing this, but I am going to show you the methods I use. This is probably the longest and most tedious job in track building, but it is worth it. To begin, start filling the smaller enclosures as they will only require single face filling. Again all you need to do is select the vertices you wish to close (3 or 4) and press &#8216;F&#8217;.</p>
<div id="attachment_252" class="wp-caption alignnone" style="width: 310px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_fillstart.jpg" alt="" title="blender_fillstart" width="300" height="300" class="size-full wp-image-252" /><p class="wp-caption-text">Fill Start</p></div>
<p>For the larger enclosures you need to use a special method which &#8216;splits&#8217; the polygons for easy filling. First of all you need to select the vertices you wish to perform this method on (you can only do this to each enclosure individually) then press &#8216;E&#8217;. A popup should appear, select &#8216;Extrude &#8211; Only Edges&#8217; and then press &#8216;S&#8217; to size the extrusion inwards.</p>
<div id="attachment_253" class="wp-caption alignnone" style="width: 310px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_fillextrude.jpg" alt="" title="blender_fillextrude" width="300" height="300" class="size-full wp-image-253" /><p class="wp-caption-text">Fill Extrude</p></div>
<p>You will notice that the area around the extrusion looks &#8216;busy&#8217; and difficult to close. We need to split the vertices into tris. Delete every second vertex and begin to fill the poly&#8217;s as shown below:</p>
<div id="attachment_254" class="wp-caption alignnone" style="width: 510px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_fillsplitmethod.jpg" alt="" title="blender_fillsplitmethod" width="500" height="250" class="size-full wp-image-254" /><p class="wp-caption-text">Fill Split Method</p></div>
<p>Another method of filling if a clean quad doesn&#8217;t fit is to fill triangles around a point. All you need to do is extrude a single vertex to the center of the extrusion area and begin to fill triangles around it, and it should end up like this:</p>
<div id="attachment_255" class="wp-caption alignnone" style="width: 310px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_triangularfilling.jpg" alt="" title="blender_triangularfilling" width="300" height="300" class="size-full wp-image-255" /><p class="wp-caption-text">Triangular Filling</p></div>
<p>You can continue using the same method throughout the entire track &#8211; extruding, splitting and filling. Once you have finished, it should look something like: </p>
<div id="attachment_256" class="wp-caption alignnone" style="width: 410px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_closedtrack.jpg" alt="" title="blender_closedtrack" width="400" height="462" class="size-full wp-image-256" /><p class="wp-caption-text">Closed Track</p></div>
<p>That took me around 30 minutes. It&#8217;s not the cleanest of modeling, but this is roughly what you should be aiming for. As you can see I have used the methods I discussed all the way around the track. It may take some time but eventually you will become faster and produce a much better poly flow. Practice makes perfect!</p>
<p>Finally as you may have gathered, the outside also needs closing. Again, use the same splitting method as mentioned previously, until you have extruded it outwards multiple times. Make sure you pull it outwards quite far and elevating higher each time &#8211; you don&#8217;t want to see over the edge of the track! Here is what my model looks like with a completed mesh. I used the splitting method multiple times when extruding outwards. Remember that the further away from the track, the lower the poly count:</p>
<div id="attachment_257" class="wp-caption alignnone" style="width: 410px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_completemesh.jpg" alt="" title="blender_completemesh" width="400" height="400" class="size-full wp-image-257" /><p class="wp-caption-text">Complete Mesh</p></div>
<h2>Texturing The Track</h2>
<p><strong>Gathering textures</strong></p>
<p>Now, if you haven&#8217;t already, you need to decide what setting you are going to have your track in. A few examples include grass, sand, dirt, snow and city. My track will simply be a summer grass track, it&#8217;s probably the most appropriate to choose for a tutorial.</p>
<p>You need to now start to gather the textures. You could use Google with terms like &#8216;grass texture&#8217; or &#8216;road texture&#8217;, but for seamless textures I recommend <a href="http://www.cgtextures.com/" target="_blank">CG Textures</a> (you can download about a dozen for free). There is also a way to convert standard textures to seamless as described <a href="http://www.switchonthecode.com/tutorials/photoshop-tutorial-create-a-seamless-texture-from-a-photo" target="_blank">here</a>. If you don&#8217;t own Photoshop, then I suggest you try <a href="http://www.gimp.org/" target="_blank">GIMP</a>.</p>
<p>Hopefully you now have a decent collection of textures to work with. Move them to a folder called &#8216;textures&#8217; in the same directory as your .blend file and name them appropriately (e.g. grass.jpg).</p>
<p><strong>The texturing process</strong></p>
<p>To begin, open up your track file. Change the &#8216;Draw type&#8217; to &#8216;Textured&#8217; &#8211; this will display any textures that are applied to the track. Now make sure you are in object mode, select the track object, then in the buttons window select &#8216;New&#8217; next to &#8216;UV Texture&#8217; in the Mesh box. Now make sure the &#8220;Draw type&#8221; is set to Textured. Enter edit mode with (&#8216;TAB&#8217;).</p>
<div id="attachment_259" class="wp-caption alignnone" style="width: 410px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_facemesh.jpg" alt="" title="blender_facemesh" width="400" height="354" class="size-full wp-image-259" /><p class="wp-caption-text">Face Mesh</p></div>
<p>We are now going to apply the road texture. Instead of having to select every individual face we can use a couple of shortcuts. In edit mode, hold &#8216;ALT&#8217; and click the right mouse button on a part of the road. It should loop and select the entire path. If it doesn&#8217;t work, try moving the camera to different angles until it does. Here&#8217;s what it should look like when the entire road is selected:</p>
<div id="attachment_260" class="wp-caption alignnone" style="width: 410px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_facemesh_selected.jpg" alt="" title="blender_facemesh_selected" width="400" height="354" class="size-full wp-image-260" /><p class="wp-caption-text">Face Mesh Selected</p></div>
<p>Now what we need to do is apply the road texture to those faces. On the separator between the button and 3D window, split the 3D area in half. Then click on the &#8216;Window Type&#8217; button to the left of the new window header and select &#8216;UV/Image Editor&#8217;:</p>
<div id="attachment_261" class="wp-caption alignnone" style="width: 210px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_uvwindowtype.jpg" alt="" title="blender_uvwindowtype" width="200" height="160" class="size-full wp-image-261" /><p class="wp-caption-text">UV Window Type</p></div>
<p>You should see the window appear grey with a blue square in the center. All we need to do for now is open the road texture, so select &#8216;Image > Open&#8230;&#8217;:</p>
<div id="attachment_262" class="wp-caption alignnone" style="width: 169px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_imageopen.jpg" alt="" title="blender_imageopen" width="159" height="95" class="size-full wp-image-262" /><p class="wp-caption-text">Image Open</p></div>
<p>The open dialog should now appear. Select the road texture and click &#8216;Open Image&#8217; in the top right. That&#8217;s it! You have now textured your road. Exit edit mode (&#8216;TAB&#8217;) and take a look around. You will notice a slight glitch in the way Blender has laid out the texture; some of the road appears to be rotated the wrong way. To fix this, simply enter edit mode again (&#8216;TAB&#8217;), select the face texture you wish to rotate, hit &#8220;Ctrl + F&#8221; and select &#8220;UV Rotate&#8221;. Note: The legacy menu in the image below is from Blender 2.40.</p>
<div id="attachment_263" class="wp-caption alignnone" style="width: 310px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_rotateface.jpg" alt="" title="blender_rotateface" width="300" height="270" class="size-full wp-image-263" /><p class="wp-caption-text">Rotate Face</p></div>
<p>Usually for the road to flow seamlessly you have to rotate it three times, but it varies. Repeat the process for the rest of the wonky textures. For speed you can select multiple faces rotate them all at once.</p>
<p>At the moment the track looks a bit plain and white. Basically the same process applies for any other texture you apply from now on. It&#8217;s now time to grow some grass. Instead of endlessly trying to select every face, there&#8217;s a useful shortcut you can use. Again, loop select the road in edit mode, then in the Editing window, in the &#8216;Mesh Tools 1&#8242; box click on &#8216; Select Swap&#8217; and you should see the selection invert. Now you are ready to apply your grass texture &#8211; same process, make sure you are in normal face mode then: &#8216;Image > Open&#8230;&#8217;, select and voila. Hopefully your track is beginning to look like a track:</p>
<div id="attachment_264" class="wp-caption alignnone" style="width: 410px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_tracktextured.jpg" alt="" title="blender_tracktextured" width="400" height="278" class="size-full wp-image-264" /><p class="wp-caption-text">Track Textured</p></div>
<h2>Final Touches</h2>
<p><strong>Adding a sky dome.</strong></p>
<p>A sky dome for a track is obviously essential, and it&#8217;s not too hard to create either. You just need to worry about getting hold of the right textures. There are various resources on the internet for these, just Google &#8220;skydome textures&#8221;.</p>
<p>First of all you need to switch to top view (&#8216;Numpad 7&#8242;). Then, move your cursor roughly to where you want the dome to appear (at the center of the track), and press &#8216;SPACE > Add > Mesh > Icosphere&#8217;. An icosphere is probably the best to use in this situation, you&#8217;ll know what I mean if you try using a UV Sphere.</p>
<div id="attachment_265" class="wp-caption alignnone" style="width: 260px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_addeddome.jpg" alt="" title="blender_addeddome" width="250" height="249" class="size-full wp-image-265" /><p class="wp-caption-text">Added Dome</p></div>
<p>Now what we need to to is cut the sphere in half, so switch to front view (&#8216;Numpad 1&#8242;), enter edit mode (&#8216;TAB&#8217;) and preferably switch to orthographic mode (&#8216;Numpad 5&#8242;). Next, press &#8216;Z&#8217; twice, this will enter you into wireframe mode, which is useful for selecting behind vertices, then bring up the selection tool by pressing &#8216;B&#8217; once. What you need to do now is drag a box around the bottom vertices and release to select them like so:</p>
<div id="attachment_266" class="wp-caption alignnone" style="width: 260px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_domeselection.jpg" alt="" title="blender_domeselection" width="250" height="249" class="size-full wp-image-266" /><p class="wp-caption-text">Dome Selection</p></div>
<p>Obviously you now need to erase them for the dome shape to appear &#8211; press &#8216;DELETE&#8217; then select &#8216;Erase &#8211; Vertices&#8217;. The sphere is now in dome form. Finally position and scale it appropriately, it needs to be very large in comparison to the track.</p>
<p>Now that the dome is in position and ready for texturing, add a new UV Texture in the Mesh box. The first thing that you will notice is that the &#8216;normals&#8217; are facing the wrong way (outwards). The way the normals face depends on which side the texture appears &#8211; if you zoom into the track the sky dome appears transparent from inside. To fix this, select every face (&#8216;A&#8217;). What you need to do now is press &#8216;W&#8217; to bring up the &#8216;special&#8217; menu . This contains the tool we need to use, so press &#8216;Specials &#8211; Flip Normals&#8217; &#8211; the problem has now been fixed, enter face/object mode and zoom into the track to see what has happened. The sky is white!</p>
<p>Adding a texture to the sky dome is similar to what we talked about in the last section, but with a slight twist. Again, make sure you are in edit mode, split the screen and open the UV/Image Editor &#8211; this time though, make sure you are in front view (&#8216;Numpad 1&#8242;). Select all the faces (&#8216;A&#8217;) and then open up the sky texture you wish to use (&#8216;Image > Open&#8230;&#8217;).</p>
<p>The twist is, that we need to use a different UV calculation. It looks a bit strange with the default setting. What we need is a continuous &#8216;wrap&#8217;. Make sure all of the faces are still selected and press &#8216;U&#8217;, then press &#8216;UV Calculation &#8211; Cylinder from View&#8217;. Yes, it does look even worse now, but what you need to do is scale down the texture &#8216;net&#8217; so that it fits around the dome.</p>
<p>Drag the UV window further out so you have more room and then zoom out via either the scroll wheel or &#8216;Ctrl+MMB&#8217; until you have a full view of the net. Then select the entire thing (&#8216;A&#8217;) and scale it down vertically so press &#8216;S&#8217; and then &#8216;Y&#8217; and drag. It scales it down to the center, so just move it down to the texture by pressing &#8216;G&#8217; and then &#8216;Y&#8217; and moving your mouse. Zoom back in and try to scale it until it perfectly fits the box:</p>
<div id="attachment_267" class="wp-caption alignnone" style="width: 510px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_netfitting.jpg" alt="" title="blender_netfitting" width="500" height="117" class="size-full wp-image-267" /><p class="wp-caption-text">Net Fitting</p></div>
<p>As you can see, the net is slightly wider than the texture, you need to do this due to the nature of the shape of the sphere. If you don&#8217;t then an ugly overlapping will form:</p>
<div id="attachment_268" class="wp-caption alignnone" style="width: 210px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_skyclash.jpg" alt="" title="blender_skyclash" width="200" height="160" class="size-full wp-image-268" /><p class="wp-caption-text">Sky Clash</p></div>
<p>Hopefully you should now have your sky completed, take a look around &#8211; it really gives the track a boost in realism.</p>
<p><strong>Lighting</strong></p>
<p>Lighting isn&#8217;t too difficult in this situation, we are going to use a dynamic method that projects the sunlight directly onto the texture.</p>
<p>First off we need to actually add a source of light, namely the sun. Make sure the default &#8216;lamp&#8217; setup is deleted then position the cursor around to where you want to place your sun. Press &#8216;SPACE&#8217; to bring up the shortcut menu then go to &#8216;Add > Lamp > Sun&#8217;. You should see this element appear:</p>
<div id="attachment_269" class="wp-caption alignnone" style="width: 130px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_sun.jpg" alt="" title="blender_sun" width="120" height="120" class="size-full wp-image-269" /><p class="wp-caption-text">Sun</p></div>
<p>A couple of changes need to be applied to the sun&#8217;s properties in order for better results, and because I have chosen a &#8216;day&#8217; track I need the energy of the light to be increased. I have used &#8217;1.200&#8242; and enabled the &#8216;No Specular&#8217; button (this stops the ground reflecting the sun):</p>
<div id="attachment_270" class="wp-caption alignnone" style="width: 250px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_sunsettings.jpg" alt="" title="blender_sunsettings" width="240" height="169" class="size-full wp-image-270" /><p class="wp-caption-text">Sun Settings</p></div>
<p>Now we need to enable the track textures to allow lighting. To do this you simply switch to edit mode, select every face (or the ones you wish to support lighting), go to the editing buttons window and under &#8216;Texture face&#8217; press the &#8216;Light&#8217; button then &#8216;Copy&#8217; next to Active Face Mode. &#8216;Copy&#8217; duplicates the setting across all selected faces.</p>
<p>You should notice that shading has been applied to your track. To change the source direction rotate the sun (along the Z axis) and the shading direction changes.</p>
<p><strong>Final result</strong></p>
<p>So, after all of that you&#8217;re probably eager to know what my track now looks like. First of all you should know that my poly count is around 950 faces which is extremely low and should run smoothly on most low-spec machines.</p>
<p>The shots below are all taken with MIP Mapping disabled. You can access the option by pulling down the &#8216;User Preferences&#8217; bar, selecting &#8216;System &#038; OpenGL&#8217; then disabling the &#8216;MIP Mapping&#8217; button. I won&#8217;t go into detail, but you&#8217;ll know what I mean when I say it improves realism for still shots. Take a look:</p>
<div id="attachment_271" class="wp-caption alignnone" style="width: 510px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_trackfinal.jpg" alt="" title="blender_trackfinal" width="500" height="608" class="size-full wp-image-271" /><p class="wp-caption-text">Final Track</p></div>
<h2>A Simple Test Engine</h2>
<p><strong>Adding The Required Objects</strong></p>
<p>To start, we need to add the two elements that are needed for this to work; the camera and an &#8216;empty&#8217; object. Switch to the opposite side view (&#8216;Ctrl+Numpad 3&#8242;), then orthographic mode (&#8216;Numpad 5&#8242;) and place the 3D cursor to the side of the track. You then need to add an &#8216;empty&#8217; object, so, press &#8216;SPACE > Add > Empty&#8217; then &#8216;Alt+R&#8217; to clear/reset the rotation. You can always zoom in if the object is too small to see. This &#8216;empty&#8217; will be used as the controller for movement and physics.</p>
<p>For the camera &#8211; press &#8216;SPACE > Add > Camera&#8217; and again clear the rotation (&#8216;Alt+R&#8217;). Then rotate it along the &#8216;X&#8217; axis, preferably so it&#8217;s tilted slightly downwards to the right. Finally, move it upwards about 1/3 of the way along the &#8216;Z&#8217; axis. Your objects should now be in the following arrangement:</p>
<div id="attachment_272" class="wp-caption alignnone" style="width: 160px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_camandempty.jpg" alt="" title="blender_camandempty" width="150" height="142" class="size-full wp-image-272" /><p class="wp-caption-text">Camera with Empty</p></div>
<p>What we need to do now is &#8216;attach&#8217; or &#8216;parent&#8217; both of these objects to each other. Make sure you have the camera selected first (this is important) and then select the &#8216;empty&#8217; and press &#8216;Ctrl+P&#8217; (&#8216;OK? &#8211; Make parent&#8217;). Both the objects should now attached in the correct manner.</p>
<p><strong>Enabling Physics</strong></p>
<p>Of course these objects won&#8217;t do anything unless we apply some physics. Select the &#8216;empty&#8217; and in the buttons window switch to &#8216;Logic&#8217; (F4). This is where we will be applying all the dynamic stuff for our engine.</p>
<p>For now, select the &#8216;Actor&#8217; button in the top right and then &#8216;Dynamic&#8217;. You should see a range of settings appear. Change them to the following values:</p>
<div id="attachment_273" class="wp-caption alignnone" style="width: 317px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_physicssettings.jpg" alt="" title="blender_physicssettings" width="307" height="62" class="size-full wp-image-273" /><p class="wp-caption-text">Physics Settings</p></div>
<p>These values are, from experience, the best to use for what we are trying to achieve. The &#8216;Mass&#8217; affects the acceleration speed of an object, the &#8216;Size&#8217; is the size of the collision bounds of the object, the &#8216;Damp&#8217; or &#8216;Dampening&#8217; acts against movement (like air resistance), and the &#8216;RotDamp&#8217; or &#8216;Rotational Dampening&#8217; affects the rotational speed.</p>
<p>You&#8217;re probably pretty eager to find out what these settings have done. Unfortunately it won&#8217;t do too much at the minute, but it&#8217;s best to check everything is working as it should. Select the empty object and move it fairly high above the track (the camera will follow), then set that camera as the default (select it then press &#8216;Ctrl + Numpad 0). Now press &#8216;P&#8217;. You should see your camera fall and stick to the the ground. If it does that then that means everything is working, if not then I would either check your physics settings or check the parenting.</p>
<p><strong>Material And Camera Settings</strong></p>
<p>I think you&#8217;ll agree &#8211; it&#8217;s not overly exiting when it just &#8216;sticks&#8217; to the ground like that; I prefer to have no friction just for the fun of it, so you can slide down the sloped areas easily. To do this, we need to change the track&#8217;s material settings.</p>
<p>Select the track and switch to the materials or &#8216;Shading&#8217; buttons (&#8216;F5&#8242;). Within this, enable the &#8216;DYN&#8217; button to reveal a few extra settings for physics. For the result we are trying to achieve, we want it to be slightly bouncy and very slippy, so, set the friction to &#8217;0&#8242; and the &#8216;Restitut&#8217; to &#8217;0.3&#8242;:</p>
<div id="attachment_274" class="wp-caption alignnone" style="width: 288px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_dynsettings.jpg" alt="" title="blender_dynsettings" width="278" height="196" class="size-full wp-image-274" /><p class="wp-caption-text">DYN Settings</p></div>
<p>Now play the game (&#8216;P&#8217;). You should notice your camera fall, bounce a little, then slide down the track. We&#8217;re getting there&#8230;</p>
<p>Depending on the scale of your track or skydome, you will probably notice a restriction to how far the 3D is displayed. This is because of camera &#8216;clipping&#8217;. For the engine to run faster the game engine clips off a certain distance from the camera, which doesn&#8217;t look too good. To fix this, simply switch to the &#8216;Editing&#8217; buttons (&#8216;F9&#8242;) and change the &#8216;End&#8217; value to something like &#8217;1000&#8242; to be safe, but again this depends upon the scale of your track. This will push the clipping distance further away so that the view is extended.</p>
<div id="attachment_275" class="wp-caption alignnone" style="width: 288px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_camerasettings.jpg" alt="" title="blender_camerasettings" width="278" height="196" class="size-full wp-image-275" /><p class="wp-caption-text">Camera Settings</p></div>
<p><strong>Adding Control</strong></p>
<p>Now for the most exciting part of this tutorial &#8211; adding interactive functionality. The process is actually easier than you think, especially with Blender&#8217;s Game Engine. In this situation we will be using a system called &#8216;Logic Bricks&#8217;; These allow you to apply simple actions and functionality quickly and easily without the need of any programming.</p>
<p>To get started, switch back to the Logic buttons window (&#8216;F4&#8242;). If you take a look to the right of the physics properties, you will see three columns of buttons &#8211; this is what we will be using. These are, in order: &#8216;Sensors&#8217;, &#8216;Controllers&#8217; and &#8216;Actuators&#8217;.</p>
<p>We are going to be applying the functionality to our &#8216;empty&#8217; object as mentioned earlier, so, select it and then where it says &#8216;Add&#8217;, click this button under all of the three columns. It should now look like this:</p>
<div id="attachment_276" class="wp-caption alignnone" style="width: 510px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_logicbricks.jpg" alt="" title="blender_logicbricks" width="500" height="115" class="size-full wp-image-276" /><p class="wp-caption-text">Logic Bricks</p></div>
<p>First of all we will add a forward thrust to our object which will trigger when we press a button on the keyboard, I will be using the &#8216;up&#8217; arrow. In the sensors column, bring down the menu list where it says &#8216;Always&#8217; and select &#8216;Keyboard&#8217;. To specify the button which you wish to use, press the grey bar to the left of where it says &#8216;Key&#8217; and press the desired key. You should end up with this:</p>
<div id="attachment_277" class="wp-caption alignnone" style="width: 236px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_keyboardbox.jpg" alt="" title="blender_keyboardbox" width="226" height="148" class="size-full wp-image-277" /><p class="wp-caption-text">Keyboard Box</p></div>
<p>In this case we don&#8217;t need to worry about the next column, so just leave that as it is for now. Moving onto the third and final column, fortunately it&#8217;s at the settings that we need to use, this is where we specify the forces or movement which is applied to our object. We will be using &#8216;Force&#8217;, and the different value boxes are in the order of X, Y and Z. We have the camera facing along the Y axis, so we need to change the middle box. Set the value to around 0.2, this should be about the right setting to use, not too fast and not too slow.</p>
<p>In order to get these to work we need to join them up, so if you think about the columns logically, it should process as &#8216;Keyboard&#8217; &#8216;AND&#8217; &#8216;Motion&#8217; &#8211; so when you press the button you specified, it applies the motion. What you need to do is drag your mouse from the gold ball points to the gold holes and a line should automatically snap to each brick. Like so:</p>
<div id="attachment_278" class="wp-caption alignnone" style="width: 510px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_logicbricksup.jpg" alt="" title="blender_logicbricksup" width="500" height="115" class="size-full wp-image-278" /><p class="wp-caption-text">Logic Bricks Up</p></div>
<p>If you need to remove an attachment, hover over the line you wish to remove and press &#8216;X&#8217;. You can now test to see if it all works. If you press and hold the button you specified in the bricks you should see your camera thrust forward. Obviously you can always adjust the speed in which it does this in the motion box.</p>
<p>To finish off with keyboard control, add three more logic bricks to each column (for the down, left and right keys) and join them all up. With the down arrow, it&#8217;s pretty much the same as the up but with a negative thrust value e.g. &#8216;-0.2&#8242;.</p>
<p>For left and right movement we need to rotate the camera, again, the same procedures as with the up arrow, but this time instead of entering the values in the &#8216;Force&#8217; row we need to enter values in the &#8216;Torque&#8217; row. Torque is force rotation, it&#8217;s a bit like a spinning top, you apply the spinning force in order for it to turn and gradually the turning momentum decreases. So, again the same principles but this time you need to remember that you are turning along the &#8216;Z&#8217; axis which means you need to enter your values in the last column. A positive for left turning and a value negative value for right turning, both &#8217;0.003&#8242;.</p>
<p>Now, if you test it, you will be able to move forward, backwards and turn left and right. The logic bricks should look something like this:</p>
<div id="attachment_279" class="wp-caption alignnone" style="width: 510px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_logicbricksfinal.jpg" alt="" title="blender_logicbricksfinal" width="500" height="347" class="size-full wp-image-279" /><p class="wp-caption-text">Logic Bricks Final</p></div>
<p>There are also three other bricks I like to add; a fly button, a camera button and a scene reset button. Before you do that, you might like to collapse the current bricks so you have more room, all you need to do is press the small orange down arrow button on the top right of each of them. Once you&#8217;ve done that, again, add three more logic bricks to each column and join them up. The first still only need to be set as keyboard sensors, and the second still remains as &#8216;AND&#8217;. The bricks we will be changing are the &#8216;actuators&#8217;.</p>
<p>If we choose the order of &#8216;flying&#8217;, &#8216;camera&#8217; and &#8216;scene resetting&#8217; you can define the keys to be pressed to trigger these events. I will be using &#8216;Ctrl&#8217;, &#8217;1&#8242; and &#8216;R&#8217;. Now take a look at the actuators, the first we will be modifying is the flying. All you need to do is think about force and &#8216;Z&#8217; thrusting, so leave it as &#8216;Motion&#8217; and apply a value of &#8217;0.3&#8242; to the top right field. If you test it out, you will see that if you press the key you specified, you can fly around your track.</p>
<p>The next we move onto is the camera. For example, if you can&#8217;t be bothered to switch to that camera every time you want to test it out, when you play it, press the button you assigned and it will automatically change to that camera. Press the drop-down list where it says &#8216;Motion&#8217; and select &#8216;Scene&#8217;, another drop-down list will display. Press it, and select &#8216;Set Camera&#8217;. What you need to do now is assign a name to your camera e.g. &#8216;cam1&#8242;. To do that, select the camera, switch to the &#8216;Editing&#8217; settings and then enter a name into the field where it says &#8216;OB:&#8217;, remember it is also case sensitive. Switch back to your &#8216;empty&#8217; and enter that name into again, where it says &#8216;OB:&#8217;. If you test it now, you will see that the button you specified will automatically switch to that camera.</p>
<p>Last but not least, for the scene resetting, all you need to do is bring down the list again where it says &#8216;Motion&#8217; and select scene. It is already set to &#8216;reset&#8217; so it should work ok. Again, test it out, you can use this for example if you fall off the track. Here&#8217;s a final screen of what your logic bricks should look like:</p>
<div id="attachment_280" class="wp-caption alignnone" style="width: 510px"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/blender_logicbricksextras.jpg" alt="" title="blender_logicbricksextras" width="500" height="311" class="size-full wp-image-280" /><p class="wp-caption-text">Logic Bricks Extras</p></div>
<h2>Conclusion</h2>
<p>Phew! Despite the length, I hope you have enjoyed this tutorial in a way and gained something from it. If you managed to follow it this far, I&#8217;d love to hear your feedback &#8211; did it help? How difficult did you find it? How could it be improved? Better still I would be very interested to see your end result (maybe some screenshots?), and possibly, with your permission, I may even publish it on the website. Feel free to use the comments box below.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.danielsefton.com/2011/06/create-your-own-racetrack-with-blender-2-49/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Inheritance-Based Sprite Management for XNA 4.0</title>
		<link>http://www.danielsefton.com/2011/06/inheritance-based-sprite-management-for-xna-4-0/</link>
		<comments>http://www.danielsefton.com/2011/06/inheritance-based-sprite-management-for-xna-4-0/#comments</comments>
		<pubDate>Mon, 06 Jun 2011 08:58:19 +0000</pubDate>
		<dc:creator>Daniel</dc:creator>
				<category><![CDATA[XNA]]></category>

		<guid isPermaLink="false">http://www.danielsefton.com/?p=212</guid>
		<description><![CDATA[<p>My team recently won Best Game Award &#8211; 1st Prize at a &#8220;make a game in 32 hours&#8221; competition, and I thought I&#8217;d share the mini engine I wrote during this period to handle sprites.</p> <p>Features</p> Easy to use and extensible inheritance-based object system Animated sprite support Camera-based sprite batch support Automatic update/draw calls with [...]]]></description>
			<content:encoded><![CDATA[<p>My team recently won Best Game Award &#8211; 1st Prize at a &#8220;make a game in 32 hours&#8221; competition, and I thought I&#8217;d share the mini engine I wrote during this period to handle sprites.</p>
<p><strong>Features</strong></p>
<ul>
<li>Easy to use and extensible inheritance-based object system</li>
<li>Animated sprite support</li>
<li>Camera-based sprite batch support</li>
<li>Automatic update/draw calls with manual overrides</li>
<li>Late drawing</li>
<li>Tag system for linking together sprites</li>
<li>Linear and Rotation velocity</li>
<li>Rectangle intersection test</li>
</ul>
<p><strong>Screenshot</strong><br />
<div id="attachment_225" class="wp-caption alignnone" style="width: 310px"><a href="http://www.danielsefton.com/wp-content/uploads/2011/06/xnaspritemanagement.jpg" rel="shadowbox[sbpost-212];player=img;"><img src="http://www.danielsefton.com/wp-content/uploads/2011/06/xnaspritemanagement-300x192.jpg" alt="" title="xnaspritemanagement" width="300" height="192" class="size-medium wp-image-225" /></a><p class="wp-caption-text">Screenshot of the included sample.</p></div></p>
<p><strong>License</strong><br />
The license is MIT.</p>
<p><strong>Download</strong><br />
<a href="https://github.com/danielsefton/XNA-Sprite-Management">https://github.com/danielsefton/XNA-Sprite-Management</a></p>
<p><strong>Usage</strong></p>
<p>YourGame.cs:</p>

<div class="wp_syntax"><div class="code"><pre class="csharp" style="font-family:monospace;"><span style="color: #0600FF; font-weight: bold;">public</span> <span style="color: #6666cc; font-weight: bold;">class</span> YourGame <span style="color: #008000;">:</span> Microsoft<span style="color: #008000;">.</span><span style="color: #0000FF;">Xna</span><span style="color: #008000;">.</span><span style="color: #0000FF;">Framework</span><span style="color: #008000;">.</span><span style="color: #0000FF;">Game</span>
<span style="color: #008000;">&#123;</span>
	GraphicsDeviceManager graphics<span style="color: #008000;">;</span>
	SpriteBatch spriteBatch<span style="color: #008000;">;</span>
&nbsp;
	SpriteManager spriteManager<span style="color: #008000;">;</span>
	Texture2D spriteTexture, animatedSpriteTexture, playerTexture<span style="color: #008000;">;</span>
&nbsp;
	<span style="color: #0600FF; font-weight: bold;">public</span> GraphicsDeviceManager Graphics
	<span style="color: #008000;">&#123;</span>
		get <span style="color: #008000;">&#123;</span> <span style="color: #0600FF; font-weight: bold;">return</span> graphics<span style="color: #008000;">;</span> <span style="color: #008000;">&#125;</span>
	<span style="color: #008000;">&#125;</span>
&nbsp;
	<span style="color: #0600FF; font-weight: bold;">public</span> YourGame<span style="color: #008000;">&#40;</span><span style="color: #008000;">&#41;</span>
	<span style="color: #008000;">&#123;</span>
		graphics <span style="color: #008000;">=</span> <span style="color: #008000;">new</span> GraphicsDeviceManager<span style="color: #008000;">&#40;</span><span style="color: #0600FF; font-weight: bold;">this</span><span style="color: #008000;">&#41;</span><span style="color: #008000;">;</span>
		Content<span style="color: #008000;">.</span><span style="color: #0000FF;">RootDirectory</span> <span style="color: #008000;">=</span> <span style="color: #666666;">&quot;Content&quot;</span><span style="color: #008000;">;</span>
&nbsp;
		<span style="color: #008080; font-style: italic;">// Add the SpriteManager component.</span>
		spriteManager <span style="color: #008000;">=</span> <span style="color: #008000;">new</span> SpriteManager<span style="color: #008000;">&#40;</span><span style="color: #0600FF; font-weight: bold;">this</span><span style="color: #008000;">&#41;</span><span style="color: #008000;">;</span>
		Components<span style="color: #008000;">.</span><span style="color: #0000FF;">Add</span><span style="color: #008000;">&#40;</span>spriteManager<span style="color: #008000;">&#41;</span><span style="color: #008000;">;</span>
	<span style="color: #008000;">&#125;</span>
&nbsp;
	<span style="color: #0600FF; font-weight: bold;">protected</span> <span style="color: #0600FF; font-weight: bold;">override</span> <span style="color: #6666cc; font-weight: bold;">void</span> LoadContent<span style="color: #008000;">&#40;</span><span style="color: #008000;">&#41;</span>
	<span style="color: #008000;">&#123;</span>
		<span style="color: #008080; font-style: italic;">// Create a new SpriteBatch, which can be used to draw textures.</span>
		spriteBatch <span style="color: #008000;">=</span> <span style="color: #008000;">new</span> SpriteBatch<span style="color: #008000;">&#40;</span>GraphicsDevice<span style="color: #008000;">&#41;</span><span style="color: #008000;">;</span>
&nbsp;
		<span style="color: #008080; font-style: italic;">// Load the textures.</span>
		spriteTexture <span style="color: #008000;">=</span> Content<span style="color: #008000;">.</span><span style="color: #0000FF;">Load</span><span style="color: #008000;">&lt;</span>Texture2D<span style="color: #008000;">&gt;</span><span style="color: #008000;">&#40;</span><span style="color: #666666;">&quot;TestSprite&quot;</span><span style="color: #008000;">&#41;</span><span style="color: #008000;">;</span>
		animatedSpriteTexture <span style="color: #008000;">=</span> Content<span style="color: #008000;">.</span><span style="color: #0000FF;">Load</span><span style="color: #008000;">&lt;</span>Texture2D<span style="color: #008000;">&gt;</span><span style="color: #008000;">&#40;</span><span style="color: #666666;">&quot;TestAnimatedSprite&quot;</span><span style="color: #008000;">&#41;</span><span style="color: #008000;">;</span>
		playerTexture <span style="color: #008000;">=</span> Content<span style="color: #008000;">.</span><span style="color: #0000FF;">Load</span><span style="color: #008000;">&lt;</span>Texture2D<span style="color: #008000;">&gt;</span><span style="color: #008000;">&#40;</span><span style="color: #666666;">&quot;TestPlayerSprite&quot;</span><span style="color: #008000;">&#41;</span><span style="color: #008000;">;</span>
&nbsp;
		<span style="color: #008080; font-style: italic;">// Create a standard sprite, rotated in code.</span>
		Sprite sprite <span style="color: #008000;">=</span> spriteManager<span style="color: #008000;">.</span><span style="color: #0000FF;">CreateSprite</span><span style="color: #008000;">&#40;</span><span style="color: #666666;">&quot;TestSprite&quot;</span>, spriteTexture<span style="color: #008000;">&#41;</span><span style="color: #008000;">;</span>
		sprite<span style="color: #008000;">.</span><span style="color: #0000FF;">Origin</span> <span style="color: #008000;">=</span> <span style="color: #008000;">new</span> Vector2<span style="color: #008000;">&#40;</span>spriteTexture<span style="color: #008000;">.</span><span style="color: #0000FF;">Width</span> <span style="color: #008000;">/</span> <span style="color: #FF0000;">2</span>, spriteTexture<span style="color: #008000;">.</span><span style="color: #0000FF;">Height</span> <span style="color: #008000;">/</span> <span style="color: #FF0000;">2</span><span style="color: #008000;">&#41;</span><span style="color: #008000;">;</span>
		sprite<span style="color: #008000;">.</span><span style="color: #0000FF;">Position</span> <span style="color: #008000;">=</span> <span style="color: #008000;">new</span> Vector2<span style="color: #008000;">&#40;</span>sprite<span style="color: #008000;">.</span><span style="color: #0000FF;">Origin</span><span style="color: #008000;">.</span><span style="color: #0000FF;">X</span> <span style="color: #008000;">+</span> <span style="color: #FF0000;">100</span>, sprite<span style="color: #008000;">.</span><span style="color: #0000FF;">Origin</span><span style="color: #008000;">.</span><span style="color: #0000FF;">Y</span> <span style="color: #008000;">+</span> <span style="color: #FF0000;">100</span><span style="color: #008000;">&#41;</span><span style="color: #008000;">;</span>
		sprite<span style="color: #008000;">.</span><span style="color: #0000FF;">RotationVelocity</span> <span style="color: #008000;">=</span> 0<span style="color: #008000;">.</span>01f<span style="color: #008000;">;</span>
&nbsp;
		<span style="color: #008080; font-style: italic;">// Create an animated sprite with a 6 frame sprite sheet.</span>
		Sprite animatedSprite <span style="color: #008000;">=</span> spriteManager<span style="color: #008000;">.</span><span style="color: #0000FF;">CreateSprite</span><span style="color: #008000;">&#40;</span>
			<span style="color: #008000;">new</span> AnimatedSprite<span style="color: #008000;">&#40;</span><span style="color: #666666;">&quot;TestAnimatedSprite&quot;</span>, animatedSpriteTexture, <span style="color: #FF0000;">6</span>, <span style="color: #FF0000;">6</span><span style="color: #008000;">&#41;</span><span style="color: #008000;">&#41;</span><span style="color: #008000;">;</span>
		animatedSprite<span style="color: #008000;">.</span><span style="color: #0000FF;">Position</span> <span style="color: #008000;">=</span> <span style="color: #008000;">new</span> Vector2<span style="color: #008000;">&#40;</span><span style="color: #FF0000;">300</span>, <span style="color: #FF0000;">100</span><span style="color: #008000;">&#41;</span><span style="color: #008000;">;</span>
&nbsp;
		<span style="color: #008080; font-style: italic;">// Create a controllable sprite. Notice the inheritance; a nice use of</span>
		<span style="color: #008080; font-style: italic;">// polymorphism &amp; encapsulation here.</span>
		Sprite playerSprite <span style="color: #008000;">=</span> spriteManager<span style="color: #008000;">.</span><span style="color: #0000FF;">CreateSprite</span><span style="color: #008000;">&#40;</span>
			<span style="color: #008000;">new</span> PlayerSprite<span style="color: #008000;">&#40;</span><span style="color: #666666;">&quot;TestPlayerSprite&quot;</span>, playerTexture, <span style="color: #FF0000;">6</span>, <span style="color: #FF0000;">6</span><span style="color: #008000;">&#41;</span><span style="color: #008000;">&#41;</span><span style="color: #008000;">;</span>
		playerSprite<span style="color: #008000;">.</span><span style="color: #0000FF;">Position</span> <span style="color: #008000;">=</span> <span style="color: #008000;">new</span> Vector2<span style="color: #008000;">&#40;</span><span style="color: #FF0000;">500</span>, <span style="color: #FF0000;">100</span><span style="color: #008000;">&#41;</span><span style="color: #008000;">;</span>
		<span style="color: #008080; font-style: italic;">// Tags are a method for linking together one or more sprites.</span>
		<span style="color: #008080; font-style: italic;">// Usage: spriteManager.GetSpriteWithTag(&quot;player&quot;);</span>
		playerSprite<span style="color: #008000;">.</span><span style="color: #0000FF;">Tag</span> <span style="color: #008000;">=</span> <span style="color: #666666;">&quot;player&quot;</span><span style="color: #008000;">;</span>
	<span style="color: #008000;">&#125;</span>
<span style="color: #008000;">&#125;</span></pre></div></div>

<p>PlayerSprite.cs &#8211; Example of custom sprite:</p>

<div class="wp_syntax"><div class="code"><pre class="csharp" style="font-family:monospace;"><span style="color: #6666cc; font-weight: bold;">class</span> PlayerSprite <span style="color: #008000;">:</span> AnimatedSprite
<span style="color: #008000;">&#123;</span>
	<span style="color: #0600FF; font-weight: bold;">private</span> <span style="color: #6666cc; font-weight: bold;">int</span> speed <span style="color: #008000;">=</span> <span style="color: #FF0000;">3</span><span style="color: #008000;">;</span> <span style="color: #008080; font-style: italic;">// Player speed</span>
&nbsp;
	<span style="color: #0600FF; font-weight: bold;">public</span> PlayerSprite<span style="color: #008000;">&#40;</span><span style="color: #6666cc; font-weight: bold;">String</span> name, Texture2D texture, <span style="color: #6666cc; font-weight: bold;">int</span> frameCount, <span style="color: #6666cc; font-weight: bold;">int</span> framesPerSec<span style="color: #008000;">&#41;</span>
		<span style="color: #008000;">:</span> <span style="color: #0600FF; font-weight: bold;">base</span><span style="color: #008000;">&#40;</span>name, texture, frameCount, framesPerSec<span style="color: #008000;">&#41;</span>
	<span style="color: #008000;">&#123;</span>
	<span style="color: #008000;">&#125;</span>
&nbsp;
	<span style="color: #0600FF; font-weight: bold;">public</span> <span style="color: #0600FF; font-weight: bold;">sealed</span> <span style="color: #0600FF; font-weight: bold;">override</span> <span style="color: #6666cc; font-weight: bold;">void</span> Update<span style="color: #008000;">&#40;</span>GameTime gameTime<span style="color: #008000;">&#41;</span>
	<span style="color: #008000;">&#123;</span>
		<span style="color: #0600FF; font-weight: bold;">base</span><span style="color: #008000;">.</span><span style="color: #0000FF;">Update</span><span style="color: #008000;">&#40;</span>gameTime<span style="color: #008000;">&#41;</span><span style="color: #008000;">;</span>
&nbsp;
		<span style="color: #008080; font-style: italic;">// Set the bounds to the window width/height.</span>
		Vector2 bounds <span style="color: #008000;">=</span> <span style="color: #008000;">new</span> Vector2<span style="color: #008000;">&#40;</span>
			<span style="color: #008000;">&#40;</span><span style="color: #008000;">&#40;</span>Game1<span style="color: #008000;">&#41;</span>SpriteManager<span style="color: #008000;">.</span><span style="color: #0000FF;">Game</span><span style="color: #008000;">&#41;</span><span style="color: #008000;">.</span><span style="color: #0000FF;">Graphics</span><span style="color: #008000;">.</span><span style="color: #0000FF;">PreferredBackBufferWidth</span>,
			<span style="color: #008000;">&#40;</span><span style="color: #008000;">&#40;</span>Game1<span style="color: #008000;">&#41;</span>SpriteManager<span style="color: #008000;">.</span><span style="color: #0000FF;">Game</span><span style="color: #008000;">&#41;</span><span style="color: #008000;">.</span><span style="color: #0000FF;">Graphics</span><span style="color: #008000;">.</span><span style="color: #0000FF;">PreferredBackBufferHeight</span><span style="color: #008000;">&#41;</span><span style="color: #008000;">;</span>
&nbsp;
		<span style="color: #008080; font-style: italic;">// Move the player with WASD.</span>
		KeyboardState key1 <span style="color: #008000;">=</span> Keyboard<span style="color: #008000;">.</span><span style="color: #0000FF;">GetState</span><span style="color: #008000;">&#40;</span><span style="color: #008000;">&#41;</span><span style="color: #008000;">;</span>
		<span style="color: #0600FF; font-weight: bold;">if</span> <span style="color: #008000;">&#40;</span>key1<span style="color: #008000;">.</span><span style="color: #0000FF;">IsKeyDown</span><span style="color: #008000;">&#40;</span>Keys<span style="color: #008000;">.</span><span style="color: #0000FF;">D</span><span style="color: #008000;">&#41;</span><span style="color: #008000;">&#41;</span>
		<span style="color: #008000;">&#123;</span>
			<span style="color: #008080; font-style: italic;">// Note: We must use Rect.Width here rather than Texture.Width, </span>
			<span style="color: #008080; font-style: italic;">// otherwise it will use the whole width of the sprite sheet.</span>
			<span style="color: #0600FF; font-weight: bold;">if</span> <span style="color: #008000;">&#40;</span>Position<span style="color: #008000;">.</span><span style="color: #0000FF;">X</span> <span style="color: #008000;">&lt;=</span> bounds<span style="color: #008000;">.</span><span style="color: #0000FF;">X</span> <span style="color: #008000;">-</span> Rect<span style="color: #008000;">.</span><span style="color: #0000FF;">Width</span><span style="color: #008000;">&#41;</span>
				Position<span style="color: #008000;">.</span><span style="color: #0000FF;">X</span> <span style="color: #008000;">+=</span> speed<span style="color: #008000;">;</span>
		<span style="color: #008000;">&#125;</span>
		<span style="color: #0600FF; font-weight: bold;">else</span> <span style="color: #0600FF; font-weight: bold;">if</span> <span style="color: #008000;">&#40;</span>key1<span style="color: #008000;">.</span><span style="color: #0000FF;">IsKeyDown</span><span style="color: #008000;">&#40;</span>Keys<span style="color: #008000;">.</span><span style="color: #0000FF;">A</span><span style="color: #008000;">&#41;</span><span style="color: #008000;">&#41;</span>
		<span style="color: #008000;">&#123;</span>
			<span style="color: #0600FF; font-weight: bold;">if</span> <span style="color: #008000;">&#40;</span>Position<span style="color: #008000;">.</span><span style="color: #0000FF;">X</span> <span style="color: #008000;">&gt;=</span> <span style="color: #FF0000;">0</span><span style="color: #008000;">&#41;</span>
				Position<span style="color: #008000;">.</span><span style="color: #0000FF;">X</span> <span style="color: #008000;">-=</span> speed<span style="color: #008000;">;</span>
		<span style="color: #008000;">&#125;</span>
		<span style="color: #0600FF; font-weight: bold;">else</span> <span style="color: #0600FF; font-weight: bold;">if</span> <span style="color: #008000;">&#40;</span>key1<span style="color: #008000;">.</span><span style="color: #0000FF;">IsKeyDown</span><span style="color: #008000;">&#40;</span>Keys<span style="color: #008000;">.</span><span style="color: #0000FF;">W</span><span style="color: #008000;">&#41;</span><span style="color: #008000;">&#41;</span>
		<span style="color: #008000;">&#123;</span>
			<span style="color: #0600FF; font-weight: bold;">if</span> <span style="color: #008000;">&#40;</span>Position<span style="color: #008000;">.</span><span style="color: #0000FF;">Y</span> <span style="color: #008000;">&gt;=</span> <span style="color: #FF0000;">0</span><span style="color: #008000;">&#41;</span>
				Position<span style="color: #008000;">.</span><span style="color: #0000FF;">Y</span> <span style="color: #008000;">-=</span> speed<span style="color: #008000;">;</span>
		<span style="color: #008000;">&#125;</span>
		<span style="color: #0600FF; font-weight: bold;">else</span> <span style="color: #0600FF; font-weight: bold;">if</span> <span style="color: #008000;">&#40;</span>key1<span style="color: #008000;">.</span><span style="color: #0000FF;">IsKeyDown</span><span style="color: #008000;">&#40;</span>Keys<span style="color: #008000;">.</span><span style="color: #0000FF;">S</span><span style="color: #008000;">&#41;</span><span style="color: #008000;">&#41;</span>
		<span style="color: #008000;">&#123;</span>
			<span style="color: #0600FF; font-weight: bold;">if</span> <span style="color: #008000;">&#40;</span>Position<span style="color: #008000;">.</span><span style="color: #0000FF;">Y</span> <span style="color: #008000;">&lt;=</span> bounds<span style="color: #008000;">.</span><span style="color: #0000FF;">Y</span> <span style="color: #008000;">-</span> Rect<span style="color: #008000;">.</span><span style="color: #0000FF;">Height</span><span style="color: #008000;">&#41;</span>
				Position<span style="color: #008000;">.</span><span style="color: #0000FF;">Y</span> <span style="color: #008000;">+=</span> speed<span style="color: #008000;">;</span>
		<span style="color: #008000;">&#125;</span>
	<span style="color: #008000;">&#125;</span>
<span style="color: #008000;">&#125;</span></pre></div></div>

]]></content:encoded>
			<wfw:commentRss>http://www.danielsefton.com/2011/06/inheritance-based-sprite-management-for-xna-4-0/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Imagination Potential</title>
		<link>http://www.danielsefton.com/2011/04/imagination-potential/</link>
		<comments>http://www.danielsefton.com/2011/04/imagination-potential/#comments</comments>
		<pubDate>Thu, 07 Apr 2011 00:33:37 +0000</pubDate>
		<dc:creator>Daniel</dc:creator>
				<category><![CDATA[Philosophy]]></category>
		<category><![CDATA[imaginary]]></category>
		<category><![CDATA[imagination]]></category>
		<category><![CDATA[potential]]></category>

		<guid isPermaLink="false">http://www.danielsefton.com/?p=28</guid>
		<description><![CDATA[<p>Look at an object on a table. Imagine it positioned on another part of the table.</p> <p>Now physically move the object to that part of the table.</p> <p>Your imagination just became a reality.</p>]]></description>
			<content:encoded><![CDATA[<p>Look at an object on a table. Imagine it positioned on another part of the table.</p>
<p>Now physically move the object to that part of the table.</p>
<p>Your imagination just became a reality.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.danielsefton.com/2011/04/imagination-potential/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

