KineticJSの導入

head

 ダウンロードしたファイルをヘッダで読み込むだけで準備完了です。
<head>
...
<script src="js/kinetic-v4.0.5.min.js"></script>

スクリプト

 JavaScriptにKineticJS命令を加えているだけなので特別なことは何も必要ありません。
 このサイトはgoogle-code-prettifyを併用していますので、以下のようにしています。
//外部スクリプトファイル
function kineticjs(){
}
<head>
...
<script src="js/kinetic-v4.0.5.min.js"></script>
<script src="sample.js">
...
</head>
<body onload="prettyPrint();kineticjs()">

ステージの準備

 KineticJSではオブジェクトを配置する場所をステージと呼んでいます。
 まずはステージを配置する位置を指定します。
<body>
...
  <div id="kineticCanvas"></div>
 スクリプト側で id とサイズの指定をします。
  //ステージ準備
  var stage = new Kinetic.Stage({
    container:"kineticCanvas",
    width:320,
    height:160
  });

参考

 これを実行すると下図のようにCanvas領域を確保してくれます。