<HTML>

  <title>loonygames' Graphic Content</title>
<body bgcolor="#FEFFEC" link="#000000" vlink="#000000">
<div align="CENTER">
  <div align="CENTER">
    <center>
<script type="text/javascript"><!--
google_ad_client = "ca-pub-2373963192914918";
/* 468x60 */
google_ad_slot = "3417104156";
google_ad_width = 468;
google_ad_height = 60;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</center>
  </div>
  <div align="CENTER">
    <table border="0" width="600">
      <tr> 
        <td width="261" height="105"><img src="../../images/next_logo_sml.jpg" width="251" height="94" usemap="#map" border="0"> 
        </td>
        <td width="92" height="105" align="LEFT" valign="MIDDLE"> 
          <p><font face="Arial, Helvetica, sans-serif" size="-1">- <a href="../index.html">Contents</a><br>
- <a href="../../../about.1">About</a><br>
            - <a href="../../../submissions/index.html">Submissions</a><br>
            - <a href="../../../feedback.1">Feedback</a><br>
            - <a href="../../archives/index.html">Archives</a></font></p>
        </td>
      </tr>
    </table>
  </div>
  <table border="0" width="600" align="CENTER">
    <tr> 
      <td width="192" height="936" align="LEFT" valign="TOP"> 
        <table border="0" width="172">
          <tr> 
            <td height="1194" align="LEFT" valign="TOP"> 
              <p><font color="#0000FF"><b><font face="Arial, Helvetica, sans-serif" color="#0000CC">volume 
                1, issue 13</font></b></font></p>
              <p><font color="#0000FF"><b><font face="Arial, Helvetica, sans-serif" color="#0000CC"> 
                </font></b></font></p>
              <p>  <p><font face="Courier New, Courier, mono"><b><font color="#339900" face="Arial, Helvetica, sans-serif">Today 
                in loonygames:</font></b></font></p>

<P><font color="#000000" face="Arial, Helvetica, sans-serif" size="-1">New!!</font><font face="Arial, Helvetica, sans-serif" size="2"> The Archives have been cleaned up, fead links fixed, and printable versions restored! Also, don't miss the new comments <a href="../../../index.html">on the front page</a>!</font></p>
              
<P><font color="#000000" face="Arial, Helvetica, sans-serif" size="-1"><a href="../../2.15/feat/index.html" target="">Livin' 
  With The Sims</a></font><font face="Arial, Helvetica, sans-serif" size="2">: 
  theAntiELVIS explores the wild and wacky world that is Will Wright's <b>The Sims</b>, 
  asking the inevitable quesiton, &quot;is <b>The Sims</b> the first step toward a virtual 
  life where everyone is Swedish?&quot;</font></p>
<P><font color="#000000" face="Arial, Helvetica, sans-serif" size="-1"><a href="../../2.15/pixel/index.html" target="">Pixel 
  Obscura</a></font><font face="Arial, Helvetica, sans-serif" size="2">: Josh 
  Vasquez on <b>Omikron: The Nomad Soul</b>.</font></p>
<P><font color="#000000" face="Arial, Helvetica, sans-serif" size="-1"><a href="../../rl/index.html" target="">Real 
  Life</a></font>: <font face="Arial, Helvetica, sans-serif"> <font size="-1">Check 
  out our newest comic strip, Real Life! Updated daily!</font></font></p>
<P><font color="#000000" face="Arial, Helvetica, sans-serif" size="-1"><a href="../../uf.1" target="">User 
  Friendly</a></font>: <font face="Arial, Helvetica, sans-serif"> <font size="-1">Updated 
  daily!</font></font></p>


</p>
              
              <p><font face="Arial, Helvetica, sans-serif" size="-1"><b><font color="#339900">Related 
                Links:</font></b></font></p>
              <p><font face="Arial, Helvetica, sans-serif" size="-1"><a href="../../1.6/index.html">DRAW 
                Partner!</a>: Chris Buecheler's article on games and 2D art.</font></p>
              
              
              <p><font face="Arial, Helvetica, sans-serif" size="-1"><b><font color="#339900">Feedback:</font></b></font></p>
              <p><font face="Arial, Helvetica, sans-serif" size="-1">You've got 
                an opinion...voice it! Drop a line to our <a href="../../../feedback.1">Feedback</a> 
                column...you could end up with a free T-Shirt!</font></p>
              <p><font face="Arial, Helvetica, sans-serif" size="-1"><b><font color="#339900">Random 
                Feature :</font></b></font></p>
               
<p align="CENTER"><img src="../../images/freak_thumb.jpg" width="102" height="120" align="MIDDLE"></p><p><font face="Arial, Helvetica, sans-serif" size="-1"><a href="../../1.7/feat">The Community Summit</a>: Our exclusive chat with the folks who run your favorite gaming pages (from our seventh issue).</font></p>

              <form method="get" action="http://www.google.com/custom" name="">
                <font face="Arial, Helvetica, sans-serif" size="-1"><b><font color="#339900">Search 
                the Archives!</font></b></font> 
               
                 <INPUT TYPE=text name=q size=12 maxlength=255 value="">
 <INPUT type=submit name=sa VALUE="Google Search">
 <INPUT type=hidden name=cof 
VALUE="LW:216;L:http:/home/loonygames/loony.timedoctor.org/content/images/logo1.jpg;LH:55;AH:center;S:http://www.loonygames.com;AWFID:13a298c7abe84fd0;">
<input type=hidden name=domains value="loonygames.com"> 
<input type=hidden name=sitesearch value="loonygames.com">               
</div>
              </form>

            </td>
          </tr>
        </table>
      </td>
      <td width="406" height="936" align="LEFT" valign="TOP"> 
        <p align="LEFT"><font face="Arial, Helvetica, sans-serif" color="#0022A8"><b><a target="" href="../../corner/index.html"><font size="-1">Graphic 
          Content</font></a><font size="-1">:</font></b></font><font face="Arial, Helvetica, sans-serif" size="+3" color="#0022A8"><br>
          Back Again</font></p>
        <p align="RIGHT"><font color="#804000"><b><font face="Arial, Helvetica, sans-serif">By 
          Christopher "<a href="mailto:chrisb@loonygames.com">shaithis</a>" Buecheler</font></b></font></p>
        <p align="right"> 
          <script language="JavaScript">

<!--
       function gotoSite(obj)
          {
          var s;
          s=obj.options[obj.selectedIndex].value
                         location.href=s;
          }
// -->

</script>
          <form>
  <div align="RIGHT">
    <select name="SiteSelector" size="1" language="JavaScript" onchange="gotoSite(this)">
<option value="http://www.loonygames.com/content/2.12/pop">Jump to an Archived Column!</option>
<option value="http://www.loonygames.com/content/2.12/pop/">Issue 2.12</option>
<option value="http://www.loonygames.com/content/2.10/pop/">Issue 2.10</option>
<option value="http://www.loonygames.com/content/2.8/pop/">Issue 2.8</option>
<option value="http://www.loonygames.com/content/2.6/pop/">Issue 2.6</option>
<option value="http://www.loonygames.com/content/2.4/pop/">Issue 2.4</option>
<option value="http://www.loonygames.com/content/2.2/pop/">Issue 2.2</option>
<option value="http://www.loonygames.com/content/2.2/pop/">-----Volume 1 -----</option>
<option value="http://www.loonygames.com/content/1.39/pop/">Issue 1.39</option>
<option value="http://www.loonygames.com/content/1.35/pop/">Issue 1.35</option>
<option value="http://www.loonygames.com/content/1.33/pop/">Issue 1.33</option>
<option value="http://www.loonygames.com/content/1.31/pop/">Issue 1.31</option>
<option value="http://www.loonygames.com/content/1.29/pop/">Issue 1.29</option>
<option value="http://www.loonygames.com/content/1.27/pop/">Issue 1.27</option>
<option value="http://www.loonygames.com/content/1.25/pop/">Issue 1.25</option>
<option value="http://www.loonygames.com/content/1.23/gc/">Issue 1.23</option>
<option value="http://www.loonygames.com/content/1.19/gc/">Issue 1.19</option>
<option value="http://www.loonygames.com/content/1.17/gc/">Issue 1.17</option>
<option value="http://www.loonygames.com/content/1.15/gc/">Issue 1.15</option>
<option value="http://www.loonygames.com/content/1.13/gc/">Issue 1.13</option>
<option value="http://www.loonygames.com/content/1.11/gc/">Issue 1.11</option>
<option value="http://www.loonygames.com/content/1.9/gc/">Issue 1.9</option>

    </select>
  </div>
</form></p>
        <p><font face="Arial, Helvetica, sans-serif">Grid's off, and the line 
          blends in. How? Simple, really. I just took the eraser, using a medium-sized 
          brush with soft edges, and erased most of the area around the line. 
          The soft edges help ensure that the parts that don't get erased blend 
          in well with their surroundings.</font></p>
        <p align="center"><font face="Arial, Helvetica, sans-serif"><a href="images/gcontent3_pic29.jpg"><img src="images/gcontent3_pic29_sml.jpg" width="368" height="185" alt="Click for fullsize image" border="0"></a></font></p>
        <p><font face="Arial, Helvetica, sans-serif">Since I'm almost done with 
          this texture, I've decided it's okay to merge. Anything more I do will 
          be tweaks, and not new additions, so I shouldn't need to preserve the 
          layers. I save again, and then merge everything together. We're now 
          ready to start final testing.</font></p>
        <p align="center"><font face="Arial, Helvetica, sans-serif"><a href="images/gcontent3_pic30.jpg"><img src="images/gcontent3_pic30_sml.jpg" width="386" height="193" alt="Click for fullsize image" border="0"></a></font></p>

        <p><font face="Arial, Helvetica, sans-serif">ALWAYS offset your textures 
          once more before you do a final save, and here's why. I totally forgot 
          that those bevels were no longer seamless. I want them to be.</font></p>
        <p align="center"><font face="Arial, Helvetica, sans-serif"><a href="images/gcontent3_pic31.jpg"><img src="images/gcontent3_pic31_sml.jpg" width="388" height="196" alt="Click for fullsize image" border="0"></a></font></p>
        <p><font face="Arial, Helvetica, sans-serif">So, using the rubber stamp 
          to clone out the lines, I make them tile. Save this again, as your final 
          PSD, and let's make this texture game-ready.</font></p>
        <p align="center"><font face="Arial, Helvetica, sans-serif"><a href="images/gcontent3_pic32.jpg"><img src="images/gcontent3_pic32_sml.jpg" width="366" height="255" alt="Click for fullsize image" border="0"></a></font></p>
        <p><font face="Arial, Helvetica, sans-serif">I'm reducing this texture 
          now to 384x192. The final in-game texture is going to be 256x128, but 
          if we drop immediately to that, it's too blurry. Yet if we then run 
          sharpen, it's too sharp. A good solution, then, is the method I'm using 
          here. Drop to 384 (a midway point between the two)...</font></p>
        <p align="center"><font face="Arial, Helvetica, sans-serif"><a href="images/gcontent3_pic33.jpg"><img src="images/gcontent3_pic33_sml.jpg" width="380" height="194" alt="Click for fullsize image" border="0"></a></font></p>
        <p><font face="Arial, Helvetica, sans-serif">Then sharpen...</font></p>
        <p align="center"><font face="Arial, Helvetica, sans-serif"><a href="images/gcontent3_pic34.jpg"><img src="images/gcontent3_pic34_sml.jpg" width="375" height="261" alt="Click for fullsize image" border="0"></a></font></p>
        <p><font face="Arial, Helvetica, sans-serif">Then drop to 256x128.</font></p>
        <p align="center"><font face="Arial, Helvetica, sans-serif"><a href="images/gcontent3_pic35.jpg"><img src="images/gcontent3_pic35_sml.jpg" width="289" height="230" alt="Click for fullsize image" border="0"></a></font></p>
        <p><font face="Arial, Helvetica, sans-serif">And here we have a reasonable 
          256x128 texture. I'm opening up a 512x256 document so I can test the 
          tiling by actually seeing it occur, rather than offsetting.</font></p>
        <p align="center"><font face="Arial, Helvetica, sans-serif"><a href="images/gcontent3_pic36.jpg"><img src="images/gcontent3_pic36_sml.jpg" width="387" height="193" alt="Click for fullsize image" border="0"></a></font></p>
        <p><font face="Arial, Helvetica, sans-serif">And there we go. A reasonable 
          idea of how a wall would look in-game if textured with this picture. 
          In this particular instance, if I were planning for the texture to be 
          tiled vertically, I'd probably spend some time with the rubber stamp 
          tool (back in 512x256 size) making the beveled sections tile. However, 
          I would more expect this to be used as a single strip of a wall (in 
          fact, it would probably be resized even more. 256 units is four times 
          the height of the Quake/Quake2 marine).</font></p>
        <p align="center"><font face="Arial, Helvetica, sans-serif"><a href="images/gcontent3_pic37.jpg"><img src="images/gcontent3_pic37_sml.jpg" width="336" height="270" alt="Click for fullsize image" border="0"></a></font></p>
        <p><font face="Arial, Helvetica, sans-serif">And here's a screenshot of 
          how it looks when applied to a brush in unrealED.</font></p>
        <p><font face="Arial, Helvetica, sans-serif">So that's the basics of how 
          I go about making a texture. There's a lot of tricks and techniques 
          I've picked up that I didn't use in this particular example, of course 
          (otherwise all of my textures would look exactly the same), but it gives 
          a good general idea of what's involved.</font></p>
        <p><font face="Arial, Helvetica, sans-serif">Hope this article was interesting 
          for you guys. It was enjoyable for me (except that part where I had 
          half of it written, but unsaved, and my computer crashed), as it showed 
          me just how much I do when I make a texture. I'd never really though 
          of it in individual parts like this, but a lot of work goes into it.</font></p>
        <p><font face="Arial, Helvetica, sans-serif">Incidentally, tho I didn't 
          do it here, it's _always_ a good idea to generate a "base texture" out 
          of anything you're working on (i.e. a texture that looks pretty much 
          the same, but with no bevels/shadows/etc). This can be used for trim 
          by the level designers, or as a base you can use to start custom textures.</font></p>
        <p><font face="Arial, Helvetica, sans-serif">That about wraps it up. Next 
          time: Taking a look at procedural texture effects. What are they, and 
          why are they important?</font></p>
        <p><font face="Arial, Helvetica, sans-serif">Until then!</font></p>
        <p><font face="Arial, Helvetica, sans-serif">-Chris</font></p>
        <p align="right"><i><font size="-1" face="Arial, Helvetica, sans-serif">- 
          Christopher Buecheler is a freelance 2D artist.</font></i></p>
        <p align="right">&nbsp;</p>
        </td>
    </tr>
  </table>
  </div>
<map name="map">
  <area shape="rect" coords="32,38,226,76" href="../../../index.html" target="_self">
  <area shape="rect" coords="12,79,125,94" href="http://www.bluesnews.com" target="_self">
 
</map>
<table border="0" width="600" align="CENTER">
  <tr> 
    <td> 
      <p><i><font face="Arial, Helvetica, sans-serif" size="-2"> <b>Credits:</b> 
        Graphic Content is &copy; 1998 Christopher Buecheler. All other content 
        is &copy; 1998 <a target="_self" href="http://www.loonyboi.com">loonyboi 
        productions</a>. Unauthorized reproduction is strictly prohibited, so 
        don't do it, or we'll paint you white against a white background.</font></i></p>
    </td>
  </tr>
</table>
</HTML>
