<HTML>

  <title>loonygames' Thinking Outside the Box</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 22</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="http://www.idsoftware.com">id 
                Software </a>: Developers of <b>Quake 2</b>.</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/v_thumb.jpg" width="64" height="64" align="MIDDLE"></p><p><font face="Arial, Helvetica, sans-serif" size="-1">Hey <B>Half-Life</b> fans! Looking for some good reads? Check out Valve designer Harry Teasley's <a href="../../1.16/guest/index.html">guest editorial</a>, our <a href="../../1.16/topshelf/index.html">review</a> of Half-Life, or our interview with <a href="../../1.34/feat">Marc Laidlaw!</a></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">Thinking 
          Outside the Box</font></a><font size="-1">:</font></b></font><font face="Arial, Helvetica, sans-serif" size="+3" color="#0022A8"><br>
          Walking the Walk</font></p>
        <p align="RIGHT"><font color="#804000"><b><font face="Arial, Helvetica, sans-serif">By 
          Paul &quot;<a target="_self" href="mailto:paul@loonygames.com">Villam</a>&quot; 
          Steed</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>
          </p>
        <br>
        <p><font face="Arial, Helvetica, sans-serif"></font></p>
        <p><font face="Arial, Helvetica, sans-serif">Looking at frames 4/5 and 
          11/12 you notice the feet are at the nadir (opposite of apex word?) 
          and are basically through the floor. These are where we set our next 
          key frames.</font></p>
        <p align="center"><font face="Arial, Helvetica, sans-serif"><img src="shauna06.jpg" width="350" height="300"></font></p>
        <p><font face="Arial, Helvetica, sans-serif">Let's go to frame 4 and turn 
          the right foot so it’s planted firmly on the ground and raise the body 
          so the foot actually <i>rests</i> on the ground plane. We raise the 
          left foot up slightly so there’s a break at the knee, but don’t rotate 
          it yet. Going to frame 5, same kinda action. Next comes frames 11 and 
          12 where we do the same sort of thing with the other leg(s).</font></p>
        <p align="center"><font face="Arial, Helvetica, sans-serif"><img src="shauna07.jpg" width="400" height="300"></font></p>
        <p><font face="Arial, Helvetica, sans-serif">So our voluptuous and<i> 
          smart</i> Shauna is pretty close to walkin’ the walk. Her stride’s probably 

          a tad too long for in-game animations but hey this ain’t a game now 
          is it? So basically you’ve got the lion’s share of the work out of the 
          way. Now we simply go frame by frame rotating the foot so the bottom 
          is planted with the proper relationship to the ground and raise the 
          whole body up so the foot rests on the floor line.</font></p>
        <p align="center"><font face="Arial, Helvetica, sans-serif"><a href="walk1.avi"><img src="walk1.jpg" width="241" height="253" alt="click to view walk1.avi" border="0"></a><br>
          <i><font size="-1">Click to view walk1.avi (111k)</font></i> </font></p>
        <p><font face="Arial, Helvetica, sans-serif">So I go through and tweak 
          the steps and decide her stride bugs me since she’s bobbing up and down 
          pretty drastically. Not that’s necessarily a bad trait for our model…bobbing…er 
          never mind. So basically this realization plays into why we jumped around 
          initially to set up the gross motions. You see the trick is to let the 
          computer do most of the work with you just coaxing it along. That’s 
          the beauty of CG animation. So we need to strip out all the keyframes 
          except for the main ones: 0, 1, 4, 5, 8, 11, 12, and 15. Then we shrink 
          her stride length by sliding the front foot back and back foot forward 
          at frames 1 and 8 copying frame 1 to 15 again. Notice the motion blur 
          I applied to her arms only.</font></p>
        <p align="center"><font face="Arial, Helvetica, sans-serif"><a href="walk2.avi"><img src="walk2.jpg" width="222" height="233" alt="click to download walk2.avi" border="0"></a><br>
          <i><font size="-1">Click to view walk2.avi (109k)</font></i> </font></p>
        <p><font face="Arial, Helvetica, sans-serif">Ah, much better. The shorter 
          gait gives the flow of her animation a more natural look. I also gave 
          her arms a bit of a break at the elbow at frame 3 and frame 10 (2 frames 
          each after the arm is fully extended). As an added bonus I put a very 
          slight bending back at the waist as she steps through her tallest position. 
          This emphasizes the act of coming down to plant her front foot and gives 
          her a little more character.</font><br>
        </p>
        <p align="RIGHT"><i><font size="-1" face="Arial, Helvetica, sans-serif">(<a href="index4.php">Continued 
          on next page</a>)</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"> </font></i><i><font face="Arial, Helvetica, sans-serif" size="-2"><b>Credits:</b> 
        Thinking Outside the Box logo illustrated and is &copy; 1999 Dan Zalkus. 
        Thinking Outside the Box is &copy; 1999 Paul Steed. All other content 
        is &copy; 1999 <a target="_self" href="http://www.loonyboi.com">loonyboi 
        productions</a>. Unauthorized reproduction is strictly prohibited, so 
        don't even try it. We've got really big guns, and we're ripped, baby.</font></i></p>
    </td>
  </tr>
</table>
</HTML>
