2010年5月19日水曜日

動画を仕上げる - Music Maker

動画を作る
▼エクスポート(= ファイル書き出し)(= 高画質投稿、HD、H.264エンコード)
--------
今は、「エクスポート」に記事を詰め込んでいます。ブログの引っ越しが落ち着いたら整理するかもしれません。

==
関連ページ:
    ▼Music Makerで動画を作る
    ▼Music Maker
    ▼制作メモ
    > Music Maker 3で追加、削除された動画作成機能
    ▼映像を加工する
    ▼Music Makerの動画作成の手引き
    ▼曲に仕上げる

映像を加工する - Music Maker

動画を作る
▼ビデオコントローラー(= 静的エフェクト)
▼オートメーション(= 時間変化可能な、動的エフェクト)
▼テンプレート(= 文字入れ、ビジュアルと、頻出エフェクト設定)
--------
o 最初は、テンプレートで大雑把に設定して、他の2つで微調整する方法がおすすめです。
o 操作に慣れてきたら、ビデオコントローラーやオートメーションを使う時間が、自然に長くなってきます。

==
関連ページ:
    ▼Music Makerで動画を作る
    ▼Music Maker
    ▼制作メモ
    > ▼動画の演出方法について考える
    ▼動画を仕上げる
    ▼Music Makerの動画作成の手引き
    ▼音を加工する

映像素材を並べる - Music Maker

動画を作る
▼アレンジャー(= アレンジメント画面)(= 配置、画面の拡大縮小)
▼テンプレート(= 文字入れ、ビジュアルと、頻出エフェクト設定)
▼ビデオコントローラー - Music Maker 1, 2専用(= 表示位置の調整、重ね合わせ、透明色、アルファ合成)
--------
o 高度な機能も入っているのですが、少し癖があります。

==
関連ページ:
    ▼Music Makerで動画を作る
    ▼Music Maker
    ▼制作メモ
    > ▼映像を加工する
    ▼Music Makerの動画作成の手引き
    ▼音素材を並べる

動画作成の手引き - Music Maker

動画を作る
動画作成で戸惑いやすいポイント
イージーモードと詳細モードを切り替える(= Music Maker 2+)
動画の演出について無料で勉強する
古くなった情報


==
関連ページ:
    ▼Music Makerで動画を作る
    ▼Music Maker
    ▼制作メモ
    > ▼映像素材を並べる
    ▼初音ミク動画を作る
    ▼Music Makerの作曲の手引き

曲に仕上げる - Music Maker

Music Makerで作曲する
マスタリングスイート(= 全体の雰囲気を整える)
▼ミキサー(= トラック間のバランス調整)
▼エクスポート(= 音楽ファイルの書き出し)


==
関連ページ:
    ▼Music Makerで作曲する
    ▼Music Maker
    ▼制作メモ
    > ▼他の作曲ツールと連携する
    Music Maker 3で追加、削除された作曲機能
    ▼音を加工する
    ▼動画を仕上げる

音を加工する - Music Maker

Music Makerで作曲する
▼オーディオエフェクト(= VSTプラグインもこちら)
    + ▼エラスティック・ピッチ = 音程、声質補正とコーラス追加のエフェクト(= ケロ声もこちら)
▼オートメーション(= 時間変化可能な、動的エフェクト)
▼タイムストレッチ・ピッチシフト(= 再生速度や音声の高さの変更)
▼テンプレート(= 頻出エフェクト設定)
音素材の一部分だけを、簡単に使う
大人しい音素材の個性を上げる
インスペクターの使い方(Music Maker 3+)


==
関連ページ:
    ▼Music Makerで作曲する
    ▼Music Maker
    ▼制作メモ
    > ▼曲に仕上げる
    ▼他の作曲ツールと連携する
    ▼音素材を作る
    ▼映像を加工する

音素材を作る - Music Maker

Music Makerで作曲する
▼シンセサイザー(= 音やフレーズを作る)
▼MIDI Editor(= 作った音を使う。ドラムマップもこちら)
テキストトゥスピーチ(= 話し声を作る。主にロボ声)


==
関連ページ:
    ▼Music Makerで作曲する
    ▼Music Maker
    ▼制作メモ
    > ▼音を加工する
    ▼曲に仕上げる
    ▼音素材を並べる
    ▼Music Makerの作曲の手引き

音素材を並べる - Music Maker

Music Makerで作曲する
▼アレンジャー(= 音素材を並べる所)
▼サウンドプール(= 音素材の部品棚)
▼ソングメーカー(= 自動作曲)

==
関連ページ:
    ▼Music Makerで作曲する
    ▼Music Maker
    ▼制作メモ
    > ▼音素材を作る
    ▼音を加工する
    ▼Music Makerの作曲の手引き
    ▼映像素材を並べる

デザインの邪魔になる要素への対応方法 - CSSカスタマイズ

要素を移動させる
CSSカスタマイズをする中で、自由に動かす事の出来ない要素が見つかる事があります。
そのような要素がレイアウトの邪魔をする時は、「表示しない」など、レイアウト以外の所で頑張ります。

例えば、zoomeマイページの場合、次の2つはCSSでは区別できません(= Internet Explorer 6の場合)。
o トップページの「動画のサムネイル(newclip 系の要素)」
o 「投稿の過去ログ(サムネイル表示)」ページ(サムネイルの右下の「すべてを見る」を押した先)

片方を動かすと、もう片方も同じ動きをします。ですので、目指すレイアウトによっては、ごまかす必要が出てきます。

to_dkのzoomeマイページの場合は、とりあえず、レイアウトに困った要素を背景の後ろに配置しました。
div.rightside_w div.newclip_head { position:absolute; z-index:-1; のように。

# この方法よりも、display: none;を使う方法や、text-indent: -9999px; を使う方法の方が有名です。
#


==
関連ページ:
    ▼要素を移動させる
    ▼CSSカスタマイズ
    ▼制作メモ
    > 背景画像固定のポイント
    CSSで表示の並びを入れ替える。positionと margin
    表示を他の要素に重ね合わせる。marginのマイナス指定
    周囲に影響を与えずに表示場所を移動させる。position

作曲の手引き - Music Maker

Music Makerで作曲する
o Music Makerを始める
作曲手順で戸惑いやすいポイント
イージーモードと詳細モードを切り替える(= Music Maker 2+)
メニューから選択出来る「使い方説明」動画

o 作曲について
主な作曲方法
楽譜と実際の音の高さの違いについて
楽譜の全音符と全休符の長さ。その意味が違う時

o VOCALOID連携
初音ミクの歌をMusic Makerに取り込む
初音ミクの声を大きくする。とりあえず編

o その他
性能が低いパソコンで、なるべく快適に動かす
古くなった情報
--------

==
関連ページ:
    ▼Music Makerで作曲する
    ▼Music Maker
    ▼制作メモ
    > ▼音素材を並べる
    ▼音素材を作る
    ▼Music Makerの動画作成の手引き
    ▼初音ミクの作曲の手引き

CSSで表示の並びを入れ替える方法。positionと margin - CSSカスタマイズ

要素を移動させる
position と margin を併用すると、表示の並びを入れ替える事が出来ます。


**** 綺麗に動かす為のポイント
o 上下に移動させたい時は、「高さが決まっている」要素を移動させるのが、ポイントです。
o 左右に移動させたい時は、「幅が決まっている」要素を移動させるのが、ポイントです。


**** 手順
(1) 移動したい要素に、position を指定します。top や leftで位置を決めます。

(2) それだけだと、他の要素が移動しません。margin を使って、後続の要素をずらします。
例:高さ 100px の要素を上に動かす時
   + 移動先を空けます。移動先にある要素に margin-top : 100px; を加算します。

   + 移動元は、穴埋めをします。2通りの方法があります。
   (a) 移動する要素の次の要素に margin-top : -100px; を加算します。(上に持ち上げる方法です)
   (b) 移動する要素に margin-bottom : -100px; を加算します。(移動する要素の、実質高さを 0にする方法です)


==
関連ページ:
    ▼要素を移動させる
    ▼CSSカスタマイズ
    ▼制作メモ
    > デザインの邪魔になる要素への対応方法
    周囲に影響を与えずに表示場所を移動させる。position
    表示を他の要素に重ね合わせる。marginのマイナス指定

周囲に影響を与えずに表示場所を移動させる方法。position - CSSカスタマイズ

要素を移動させる
移動したい要素に、position を指定します。 top や leftで位置を決めます。

例:マイページの左上にある「ページの名前」だけを移動させる場合
--------
div.contents h2.title_name {
position : relative;
top : 40px;
left : -70px;
}
--------

o レイアウト固定で無い場合、position : relative; と position : absolute; のどちらかを使います。
o しかしながら、どちらも「HTML上の並び方との組み合わせ」によっては予想外の動きをするブラウザーがありました。出来る事なら、複数のブラウザーで表示結果を確認する事をおすすめします。
# ご参考:HTMLクイックリファレンスの「posision」 ▽http://www.htmq.com/style/position.shtml
#


==
関連ページ:
    ▼要素を移動させる
    ▼CSSカスタマイズ
    ▼制作メモ
    > CSSで表示の並びを入れ替える。positionと margin
    表示を他の要素に重ね合わせる。marginのマイナス指定
    デザインの邪魔になる要素への対応方法

表示を他の要素に重ね合わせる方法。marginのマイナス指定 - CSSカスタマイズ

要素を移動させる
表示を他の要素に重ね合わせたい時は、margin のマイナス指定が便利です。
margin-top : -30px; など。

o 必要に応じて、重ね合わせ順を調整します。 z-index を使います。

# z-index を使う場合、 position も指定する必要がありますので、ご注意下さい。
# ご参考:▽HTMLクイックリファレンスの「z-index」
#


**** メモ
o marginのマイナス指定で上に移動すると、後続要素も一緒に移動します。
o その要素だけを移動させたい時は、position を使います。
   + position : relative; top : -30px; など

o 詳しくは
   + 「周囲に影響を与えずに表示場所を移動させる。position
   + 「表示の並びを入れ替える。positionと marginの併用


==
関連ページ:
    ▼要素を移動させる
    ▼CSSカスタマイズ
    ▼制作メモ
    > 周囲に影響を与えずに表示場所を移動させる。position
    CSSで表示の並びを入れ替える。positionと margin
    デザインの邪魔になる要素への対応方法

zoomeマイページの右と左を区別する方法 - CSSカスタマイズ

要素を移動させる
zoome
同じ名前(idやクラス名)の要素を他のページでも使っていても、そのページの要素だけレイアウト変更出来る場合があります。
zoomeマイページなら、右と左。「右にある名刺カード」と「左にある名刺カード」は、名前が同じでも別のスタイル指定が可能です。


**** 原理
o zoomeマイページの場合、要素の親を辿っていくと、マイページの右にあるか左にあるか、クラス名で指定している要素があります。そのクラス名を利用します。


**** 書き方
o 要素が左側にある場合、幅が広い時は、 div.leftside_w。 幅が狭い時は、div.leftside が必ずあります。
   + 「<div class="leftside_w"」のような書き方をしている所です。
o 要素が右側にある場合、幅が広い時は、 div.rightside_w。 幅が狭い時は、div.rightside が必ずあります。

# 幅が広い方は _w 付き。幅が狭い方は、 _w 無しです。( 先頭の divは無くても、多分大丈夫です。)
#

**** 具体的な指定例
o トップページ右にあるコメントリスト内容は div.rightside_w .commentlist_body
o 日記ページ左にあるコメントリスト内容は div.leftside_w .commentlist_body

o トップページ左にある名刺カードの内容は div.leftside .name_body
o 日記ページ右にある名刺カードの内容は div.rightside .name_body


**** メモ
o CSSの最新仕様を使うと、更に区別する事が出来ますが、サポートしていないブラウザーがありますので、注意が必要です。
o 例えば、Internet Explorer 6は、今でも良く使われているブラウザーです。(= 2010年5月現在)
o でも、子供セレクター(A > B)は、Internet Explorer 6ではサポートされていません。
o ですから、なるべく多くの人達にみて欲しいサイトでは、Internet Explorer 6でも動くような書き方に改めます。


==
関連ページ:
    ▼要素を移動させる
    ▼zoome
    ▼CSSカスタマイズ
    ▼制作メモ
    > 表示を他の要素に重ね合わせる。marginのマイナス指定
    > zoomeのマイクリップ一覧で、出てくる説明文をCSSカスタマイズする
    周囲に影響を与えずに表示場所を移動させる。position
    CSSで表示の並びを入れ替える。positionと margin
    デザインの邪魔になる要素への対応方法
(2010年5月25日追加。CSSの最新仕様とブラウザーのサポートについて)

要素を移動させる - CSSカスタマイズ

CSSカスタマイズ
zoomeマイページの右と左を区別する
表示を他の要素に重ね合わせる。marginのマイナス指定
周囲に影響を与えずに表示場所を移動させる。position
CSSで表示の並びを入れ替える。positionと margin
デザインの邪魔になる要素への対応方法
--------
o CSSだけで表示の並びを入れ替えたりする方法について、私が使用しているものを纏めました。
o HTMLの並びに縛られない、自由なレイアウトに挑戦したい方は、ご参考にどうぞ。


**** メモ
o この方法が使えないのは携帯電話。今の所、CSSが使えない携帯電話も多いみたいです。


==
関連ページ:
    ▼CSSカスタマイズ
    ▼ホームページを作る
    ▼制作メモ
    > 背景画像固定のポイント
    リンクやボタンにカーソルを乗せた時に、押し易くする
    zoomeのマイクリップ一覧で、出てくる説明文をCSSカスタマイズする
    ▼要素の背景を半透明にする