| トップページ | ふらっと.jpについて | おたより | サイトマップ |
ふらっと.jp > ALOHAよ今夜も有難う > 福田正博引退試合 > ページ制作手順

ページ制作手順

動画キャプチャーからページ作成までの手順を説明してます。(初版日:2003年09月21日)

<last updated:

1.動画キャプチャー〜avi出力&静止画切り出し…Ulead VideoStudio 5.0を使ってます。Windows ムービー メーカーでもできると思います。まず使えそうなカットをどんどんキャプチャーしていきます。次に、キャプチャーしたカットをコーナー(シークエンス)ごとにまとめて、順に並べます。各コーナーごとにプロジェクトファイルを作り、編集します。編集は、各カットをトリミング、並べ替えをし、場合によっては明度・コントラスト、彩度といったフィルターをかけ音量調整をします。それをaviファイルに出力します。あと、適当なカットを静止画に落とします。

2.Windows Media エンコーダ 9シリーズで、aviファイルを340kと〜64kの2つのwmv(Windows Media Video)にエンコードします。340kはシングルビットレート、〜64kはマルチビットレートで、独自の設定を使用しています。

3.wmvをストリーミングサーバーにアップし、メタファイルを作ります。

4.作成した動画と、ケータイカメラやデジカメで撮った静止画を並べる順序を決めます。動画キャプチャーしたものの、動画としては使わずに切り出した静止画だけを使うものもあります。

5.ページを作成します。DreamweaverMXのレイアウトビューでレイアウトしてます。赤い線で囲まれたそれぞれのコーナーは、レイアウトテーブルです。ただしテーブルに枠をつけるのはスタンダードビューでやってます。まずレイアウトビューでコーナーを作り、スタンダードビューに切り替え、外側のテーブルを加えます。外側テーブルは、幅指定を削除、余白を1、背景色を赤に。内側テーブルは、背景色を白にします。

6.動画コーナーには、切り出した静止画と、Windows Media Videoのロゴ、340kと〜64kの2つのロゴを配置して、メタファイルへのリンクを張ります。

7.動画から切り出した静止画は、PhotoShop6.0を使って、まずインターレースのフィルターをかけ、720*480を640*480(4:3)にします(後日注:正確には、まず左右8pxづつカットして704*480にし、それを640*480にするのだと思う)。サイズ縮小は、〜64kビデオのサイズである160*120を基本にしてます(120*90とか320*240でもいいと思うけど)。色調補正、アンシャープマスク(標準値は適用量100、半径0.3、しきい値5)をかけてweb用に保存。

8.リンクを張る静止画は次の手順。
1)600*450の静止画を作成してweb用に保存。
2)アンシャープマスク(←さっきのと違うリンク)処理を戻し、サムネイルサイズに縮小してから再びアンシャープマスクをかけ、Openのロゴをレイヤーで乗せてweb用に保存。
3)Open Window用ページ作成。レイヤーで600*450の静止画を貼り付け、closeロゴもレイヤーで配置。closeロゴにはwindow closeのJava Scriptを入れる。
4.サムネイル画像にOpen Windowのビヘイビアを入れる。ウィンドウ幅は640*500に。イベントは(onClick)←カッコつきを選択。

9.リードを書き、altタグを入れ、ページを完成させます。