ホーム > プレイ動画 > アイキャッチ動画公開☆ちょっとだけリニューアル♪

アイキャッチ動画公開☆ちょっとだけリニューアル♪


アイキャッチ動画公開☆ちょっとだけリニューアル♪

細かいところを色々修正しなくちゃと思いつつ数ヶ月、やっと時間がとれたのでちょっとだけリニューアルをしてみました。
目立つところではヘッダ画像の更新、ヘッダ内へのアイキャッチ動画設置があります。ほかにもはてなブックマーク等のソーシャルブックマークやTwitterへの対応、コメント機能の刷新、そして様々なデザインの修正も行っています。

これでやっと整った、という自己満足に包まれているみおです(*´∀｀*)

MHF・攻略ブログ

ヘッダ用アイキャッチ動画は、MHF公式で新シーズンのプレビューサイトによく使われているような、アイキャッチとして目を引く小さいムービーを表現してみたくてつくってみました。

ヘッダへの埋め込みは、Flashビデオ(F4V形式)を使用しました。iPhoneやiPadの関係で何かと話題のHTML5も検討したんですが、最大シェアを誇るIEの対応がややこしく、手間をかけるだけの必然性も感じられなかったため見送りました。

今回、Adobe CS5でアイキャッチ動画をつくるにあたり、いくつか発見、というか再確認できたことがあるのでまとめておきます。

  • いつの頃からか、YouTubeが動画の長さを誤認識するケースが増えたのに困惑
    → 試行錯誤の結果、ドロップフレーム(偶数)を設定することで「なぜか」回避
  • 縮小処理は、やっぱりアルゴリズムの差でAviUtlの方がいい感じ
    → 中間ファイルに書き出してAviUtlで読み込み、縮小して再度中間ファイルに書き出し、Adobe MediaEncoderで最終エンコード
  • F4Vファイルを直接objectタグとかで貼り付けるのは無理だった
    → Flashで、F4Vファイルをswfファイル内に埋め込むことで解決
  • objectタグにloop属性を設定しても、なぜか自動ループ再生が機能せず
    → swfファイルの方でActionScriptを書いて解決
  • やっぱりPremiereのタイトル機能はしょぼい
    → CS5ではAfterEffectsのような自動カーニングを期待したんだけどな(´･ω･`)

やっぱり知識だけじゃなくて、実際に作業してみて初めてわかることって多いです。お仕事の方にもこの経験をフィードバックできるので、やってみてよかった(*´∀｀*)

以下が、そんな苦労の末にできあがったアイキャッチ動画の大きい版です。なおこの動画にはこっそりと最近撮った新しい動画も含まれていたりします♪

プレイ動画はこちらです♪

※動画の画質がフルHD(1080p)の場合でも、YouTubeの仕様によりデフォルトではHD(720p)で再生されます。再生中に、シークバー右横の設定ボタンでいつでも画質を変更できます。

※右下のボタンでフルスクリーン表示に切り替えると、動画プレイヤーが画面いっぱいに拡大されます。ぜひフルHD(1080p)を大画面でご覧ください♪

関連タグ: , ,

2件のコメントがあります

▼コメント入力フォームへ

あなたもコメントを残していってください♪

入力された情報は認証以外には使われません。メールアドレスが公開されることもありません。

  (必須)
  (必須)

«
»