17 返信 最新の回答 日時: Apr 21, 2015 4:20 AM ユーザー:150kw

    ボタンのトランジション

    noktzw Level 1

      Mac OSX10.9 EncoreCS6です。

      メニューのボタンにリンクを張り、指定のチャプターへ飛ぶ際に、

      ディゾルブ等のトランジションを付けたいのです。

      ヘルプに書かれている様子は見当たらず、数少ないサイト情報から

      After EfectsやPremierからトランジションを何らかの方法で取り出し、

      アセットとしてEncoreに読み込むことで、使用できるようなことが書かれてました。

      After Efects CC2014の中にトランジションらしきものを見つけたのですが、

      どうすればEncoreのプロジェクトに読み込むことが出来るのか分かりません。

      ご存知の方、やり方ご教授よろしくお願いいたします。

        • 1. Re: ボタンのトランジション
          150kw Most Valuable Participant

          こんばんは、noktzwさん。

          Win版CS5の場合です。多少異なるところがあるかも知れませんが、読み替えてみて下さい。

          違っていたらごめんなさい。

           

          Aeの作業

          ①コンポジションを作成します。サイズは映像と同じ、デュレーションは1~2秒程度とします。後からでも「コンポジション設定」で修正できます。

          ②メニューの「ファイル」→「Bridgeで参照」を選択します。

          ⇒Bridgeが起動します。

          ③「フォルダー」タブの中で、次のようにフォルダーを展開します。

          Adobe CS5→Adobe After Effects CS5→Support Files→Presets→Transitions-Dissolves(or Movement or Wipes)

          ④「コンテンツ」タブの中に、トランジションがサムネイル表示されますので、これと思うものをクリックします。

          ⇒「プレビュー」タブの中に表示されますので、再生して確認します。

          ⑤何回か繰り返し行なって、最適なトランジションを見つけます。

          ⑥「コンテンツ」タブの中で、最適なトランジションのサムネイルをダブルクリックします。

          ⇒このトランジションがAeのコンポジションに転送されます。

          ⑦Aeでデュレーションなどの編集をします。

          ⑧保存します。

           

          Enの作業

          ①Aeのファイルを「プロジェクト」パネルにアセットとして読み込みます。

          ②「フローチャート」パネルで、メニューの項目(Chap1、Chap2等)を選択し、「プロパティ」パネルで「トランジション」を開き、「アセット」の「ピックウィップ」マークを「プロジェ クト」パネルのAeのファイル上へドラッグ&ドロップします。

          ③プレビューして確認します。以上で完了です。

           

          下図は図中任意の場所をクリックすると拡大します。

          • 2. Re: ボタンのトランジション
            ユーヴェ JapanEmployeeModerator

            150kw様


            本スレッドで150kw様にご回答いただいた件について

            noktzw様が返信なさろうとしていますが、

            弊社システム上の問題によりnoktzw様側で

            回答ができない状態になっています。

            (現在弊社側で対応中です)

             

            上記状態となっておりますので、念のため

            状況について共有させていただきます。

            noktzw様、150kw様、ご迷惑をおかけし申し訳ありません。

            問題解決(弊社システム上の対応完了)まで今しばらくお待ちください。

            • 3. Re: ボタンのトランジション
              150kw Most Valuable Participant

              ユーヴェさん、noktzwさん

               

              下図の様なエラーメッセージが表示されて送信できないということでしょうか。

              もし、そうであれば、私も4月1日にこのエラーメッセージが出て、送信できるようになる迄大変でした。

              少し時間が経過した後、送信してもダメ。リフレッシュしてもダメ。再起動してもダメ。ログインし直しても駄目。ブラウザを変えてもダメ。その日は送信を諦めました。

              翌日になって、前日の繰り返しを行なってもダメでした。

              最後は、返信を一から入力し直した結果、何と送信できました。

              もしかしたら、他のホームページからコピー&ペーストした文字がAdobeさんのチェックに引っ掛かったのではなんて思っています(本当かどうか分りませんが)。

               

              noktzwさん、もしこのようなエラーメッセージが表示されたのでしたら、一から入力し直して試してみたらいかがでしょうか。

              • 4. Re: ボタンのトランジション
                ユーヴェ JapanEmployeeModerator

                150kw様

                 

                同じ事象が発生していたということで、大変ご迷惑をおかけしました。

                 

                この事象につきまして、システム側で原因を確認中となりますが、

                ご指摘の通り、今のところ投稿時の文言がスパムフィルタに

                引っかかっている可能性が高い状態となります。

                 

                詳細が確認できましたら内容を共有させていただきます。

                • 5. Re: ボタンのトランジション
                  noktzw Level 1

                  150kwさま ユーヴェさま

                   

                  まさしく添付画像と同じエラーメッセージです!

                  こちらでは何をやっても解決せず、ほとほと困り果てていました。

                  ご指摘のように、現在改めて打ち直していますので、

                  この内容が無事送信されることを祈ってます。

                  送信が無事に出来ましたら、また改めて質問内容をお送りします。

                  • 6. Re: ボタンのトランジション
                    noktzw Level 1

                    150kwさま

                     

                    どうやらようやく第一関門はクリアしたようです。

                    フォーラム内のエラー対処法までご指示いただき、ありがとうございます。

                     

                    ずいぶん時間が経ってしまいましたが、改めて回答に対する追加質問をさせてください。

                     

                    Aeでコンポジションを作るというのは、選んだトランジションを

                    タイムライン的なところに作るということで良いのですよね?

                    で、そのコンポジションを保存するということですが、

                    単純に保存するということは、Aeのプロジェクトファイルのまま

                    保存するということで良いのでしょうか?

                    とりあえずそこまではその通りにやり、Encoreで読み込もうとしたところ、

                    「メディアをデコードするために使用したソフトウエアはこのシステムでは使用できません。

                    作業中のファイル用の正しいデコーダーをインストールすれば、問題を解決できる場合があります」

                    というワーニングが出てきて、結局読み込めませんでした。

                    Aeのプロジェクトファイルの状態で読み込むということに少し疑問を感じ、

                    メディアエンコーダーでMP4フィルにかきだしてみました。

                    すると、読み込めはしましたが、いざアセットをボタンのトランジションにリンクさせると、

                    黒とグレーのトランジション映像が間に挟まるだけで、トランジションにはなりませんでした。

                     

                    Aeからの保存を単純にするだけで良いのか、そのファイルをどうやって読み込ませるのか。

                    再度、お分かりになる範囲でご教授願います。

                    • 7. Re: ボタンのトランジション
                      150kw Most Valuable Participant

                      こんばんは

                      返信が遅れてすみません。

                      本日は間に合わず、明日13日に書き込む予定です。

                      • 8. Re: ボタンのトランジション
                        150kw Most Valuable Participant

                        ◆メニューボタントランジション

                         

                        私は、メニューボタントランジションとはメニューのボタンをクリックしてから本編の映像が始まる迄の間に挿入する切り替え効果の映像と思っています。時間にすれば数秒くらいでしょう。

                        映像は、Premiere ProやAfter Effectsで作成できます。After Effectsのトランジションプリセットの「.ffx」ファイルを利用して、映像にトランジション効果をかけることができます。

                         

                        ◆ここではAfter Effectsを使用し、次のようなメニューボタントランジションの作成を説明します。

                         

                        ・映像のデュレーションは1秒間とします。

                        ・メニューボタンをクリックすると、ボタンサイズを0.2秒で2倍に拡大し、その後は徐々にサイズダウンし、最後はサイズ0にします。

                        ・残りのメニューボタンを含めた背景画像にディゾルブトランジションを適用します。

                        ・映像は各メニューボタン用にそれぞれ作成します。

                        ◆メニューボタントランジションの作成方法

                         

                        ①Encoreでメニューを作成します(サイズはDV標準です)。

                        ②「メニュー」パネル内で右クリックし、開いたコンテキストメニューから「メニューをPhotoshopで編集」を選択します。

                        ⇒Photoshopが編集可能状態で起動します。

                         

                        ③Photoshopで、「Chapter 1」ボタンの画像を「ボタン.psd」で、残りのボタンと背景の画像を「メニュー.psd」で保存します。保存後Photoshopは終了します。

                        ④After Effectsを起動します。「コンポジション設定」はプリセットを「NTSC DV」(幅720、高さ480px)を選択し、デュレーションは「5;00」にします。最初は多少長めにしておき、後で修正します。

                        ⇒「コンポ 1」コンポジションが作成されます。

                         

                        ⑤「ボタン.psd」と「メニュー.psd」を読み込み、「タイムライン」パネルの「コンポ 1」コンポジションへ配置します。「ボタン.psd」が上側のレイヤーで、「メニュー.psd」が下側のレイヤーです。

                        ⑥ボタンのアニメーションを作成します。

                        ⑥-1アンカーポイント位置が「Chapter 1」ボタンの中央となるように、「アンカーポイント」と「位置」の各プロパティの数値を調整します。

                        ⑥-2「スケール」プロパティに図のようにキーフレームを打ち、ボタンのアニメーションを作成します。

                        ⑦次に、残りのボタンと背景の画像にディゾルブトランジションをかけます。

                        ⑦-1「メニュー.psd」レイヤーを選択し、メニューの「ファイル」→「Bridgeで参照」を選択します。

                        ⇒Bridgeが起動します。

                        ⑦-2「フォルダー」パネルを開き、フォルダーを次のように展開します。

                        C:¥Program Files¥Adobe CS5¥Adobe After Effects CS5¥Supported Files¥Presets¥Transitions-Dissolves

                        Transitions-Dissolvesフォルダーと同階層にあるTransitions-MovementとTransitions-Wipesフォルダーにも多くのディゾルブトランジ ションが格納されています。

                        ⑦-3「コンテンツ」パネルを開くと各トランジションがサムネイル表示されています。クリックすると「プレビュー」パネルでプレビューでき、ディゾルブトランジション内容を確認できます。

                        ⑦-4採用のディゾルブトランジションが決まったら、サムネイル上でダブルクリックします。

                        ⇒After Effectsに自動的に切り替わります。「メニュー.psd」レイヤーに「エフェクト」プロパティグループが追加され、その中に採用したディゾルブトランジションが入っています。

                        ⑧初期設定では、ディゾルブトランジションのかかり方が逆になっていますので、「変換終了」プロパティのキーフレームをドラッグして入れ替えて修正します。また、右側のキーフレームのデュレー ションは「0;29」にします。

                        ⑨メニューの「コンポジション」→「コンポジション設定」を選択し、開いた「コンポジション設定」ダイアログボックスでデュレーションを「1;00」に修正します。

                         

                        ⑩プレビューで問題ないことを確認し、「メニュー.aep」で保存します。

                         

                        ⑪Encoreに切り替え、「メニュー.aep」の「コンポ 1」を「プロジェクト」パネルにアセットとして読み込みます。

                         

                        ⑫「メニュー」ウインドウを開いて、「Chapter 1」ボタンを選択し、さらに「プロパティ」パネルの「トランジション」を開きます。続いて、ピックウィップマークを「プロジェクト」パネルの「コンポ 1/メニュー.psd」へドラッグ&ドロップします。

                        ⇒「Chapter 1」ボタンから「コンポ 1/メニュー.psd」へリンクが設定されます。

                        ⑬「Chapter 2」および「Chapter 3」ボタンについても同様に行います。

                        メニューボタントランジションのリンクが張られるとリンク線の途中に四角のマークが表示されます。

                         

                        ◆その他

                        Youtubeにボタントランジションの作成方法がアップロードされていますね。

                        https://www.youtube.com/watch?v=TZT4FdWVmKs

                        モゴモゴとしか聞こえず(笑)、話している内容は分かりませんが、こちらはPremiere Proで作成していますね。

                        タイトルボタンを回転させていますが、これは今回の場合でも簡単にできますよ。下の例はボタンが最大になったところから消える迄360°回転させています。

                        • 9. Re: ボタンのトランジション
                          noktzw Level 1

                          150kwさま

                           

                          長らくお待たせしてすいませんでした。

                          おまけに丁寧かつ複雑な回答で、やや困惑しております。

                           

                          基本的なことで解決していない部分ですが、

                          Aeのファイルのまま、すなわち「メニュー.aep」のままでは、

                          前回と同じワーニングが出て、読み込むことが出来ません。

                           

                          仮にそれが解決したとして、Encoreのトランジションに関連づけるには、

                          単純にトランジションだけのAeファイルではなく、

                          メニュー画面をPhotoshopファイルにしたものに、トランジションを付け加えた物を作り、

                          それをEncoreのトランジションとして読み込ませなくてはいけないのでしょうか?

                          つまり、先ほどの150kwさんのトランジション(各ボタンにエフェクトを付ける)方法だと、

                          ボタンごとにトランジションAeファイルを作り、一つずつEncoreのボタンに割り当てる

                          ということになりますが、そういうやり方しかないのでしょうか?

                           

                          とにかく、Aeの.aepファイルをEncoreに普通に読み込ませる方法をお願いします。

                          もしかしてAeがCC2014だからダメだってことはありますか?

                          • 10. Re: ボタンのトランジション
                            150kw Most Valuable Participant

                            こんばんは、noktzwさん

                             

                            >Ae CC2014の.aepファイルをEncore CS6に読み込む方法?

                             

                            調べましたら、直接は読み込みできないようですが、次のようにして行うようです。

                            Ae CC2014バージョンでCCファイル形式で保存し、Ae CCバージョンでCCファイルを読み込み、CS6ファイル形式に保存します。

                            その後、Encore CS6に読み込むという方法をとるようです。ちょっと面倒臭いような気がしますね。

                            下記リンクをご覧ください。ここのフォーラムの投稿の質問にAdobeのスタッフの方が詳しく回答しています。

                            https://forums.adobe.com/message/6587196

                             

                            >Encoreのトランジションに関連づけるには、単純にトランジションだけのAeファイルではなく、・・・・

                            「.ffx」ファイルだけでは機能せず、トランジションをかける元の画像(映像)が必要になります。

                            ここの例では、メニューの背景画像やボタン画像をPhotoshop経由で取り出して、Aeに読み込み、トランジションをかけたり、アニメーションを付けたりします。

                            次にこのAeファイルをEncoreにアセットとして読み込んだ後、ボタンにトランジションとしてリンクさせます。

                             

                            >各ボタンにエフェクトを付ける方法だと、ボタンごとにトランジションAeファイルを作り、・・・・・そういうやり方しかないのでしょうか?

                             

                            ここの例では、ボタンと背景の挙動を別々にしましたので、ボタン毎に動画が必要になります。この動画はAeのコンポジションという器に作成しますので、コンポジションはボタン毎に3個必要にな ります。コンポジションはPremiere Proではシーケンスの様なものですので、Aeの1個のファイルの中に3個とも入ります。

                            Encoreで読み込むときは、Aeのファイルを読み込み、次にコンポジションを指定します。

                             

                            ボタンと背景の挙動を同じにする場合は、動画は1個ですので、Aeのファイルはコンポジションを1個含んだものとなります。

                             

                            このようなやり方になります。

                             

                             

                            と説明しましたが、分かって頂けましたか。

                            でも、noktzwさんは、上の質問内容を良くまとめられましたね。理解度はすごいと思います。

                            それから、Aeはものすご~く奥が深いです。勉強のし甲斐があります。

                             

                            不明な点は気軽に質問してください。

                            • 11. Re: ボタンのトランジション
                              150kw Most Valuable Participant

                              追記です。

                               

                              After Effects CC2014をお持ちですよね。

                              それでしたら、After Effects CS6も同時にインストールし、Encore CS6との連携で使用する場合は、最初からAfter Effects CS6を使用すれば解決です。

                              • 12. Re: ボタンのトランジション
                                noktzw Level 1

                                150kwさま

                                 

                                毎回丁寧なご指示ありがとうございます。

                                 

                                Aeのファイル変換に関しては、追記の形で挑戦しました。

                                インストール直後はOS10.9対応してなかったのか、出来ずに焦りましたが、

                                アップデートしたところ使えるようになりました。

                                 

                                多分150kwさんのトランジションの定義に則したものにはなったと思います。

                                トランジションの選び方、掛け方によっては、それで満足いくものになるでしょうが、

                                例えばディゾルブで1秒ディレーションのものをトランジションに当てた場合、

                                ボタンを選択して1秒後に、真っ黒な映像になってから本編映像になる

                                ということになってしまうようです。

                                通常編集時に使われるトランジションは、前の映像から次の映像に徐々に変わることが

                                トランジションの効果だと思ってます。

                                Encoreのトランジションにはそこまで求められないのでしょうか?

                                Aeの作業でキーイングとかチャンネルとかから、何かエフェクトを追加して

                                黒にならずに徐々に本編映像に切り替わる方法は取れないのでしょうか?

                                因にチャンネルのマット設定を加えてみましたが、変化ナシでした…

                                 

                                何度もすいませんが、よろしくお願いいたします。

                                • 13. Re: ボタンのトランジション
                                  150kw Most Valuable Participant

                                  こんばんは

                                   

                                  そこまで出来たとは素晴しいですね。

                                  メニュー画像にはフェードアウトのディゾルブをかけ、本編画像にはフェードインのディゾルブをかけ、クロスディゾルブにしたいということですね。

                                  今頭に浮かんだ方法は、2つありますが、確認はまだしていません。

                                  また、クロスディゾルブと本編映像とがスムーズに繋がるかも心配です。

                                  noktzwさんは、下記内容で理解できると思いますので、まずは試してみてはいかがでしょうか。

                                   

                                  ◆After Effectsを使用する方法

                                  ①「レイヤー 1」に本編の画像を、「レイヤー 2」にメニューの画像を配置します。

                                  ②「レイヤー 1」にフェードインのディゾルブ(キーフレームは前後を入れ替えない)をかけます。

                                  ③「レイヤー 2」にフェードアウトのディゾルブをかけます。

                                  これでクロスディゾルブ風に見えるかなんですが、確認していませんのでまだ何とも言えません。

                                  いまいちなら、さらに不透明度を組み合わせると何とかなりそうな気がします。

                                   

                                  ◆Premiere Proを使用する方法

                                  ①タイムラインにメニューの画像と本編の画像を前後に配置します。

                                  ②クロスディゾルブをかけます(1~2秒程度)

                                  ③このクロスディゾルブをかけた部分を中間ファイルに書き出します。

                                  ④この中間ファイルをEncoreにアセットとして読み込みます。

                                  ⑤あとはリンクを張れば完成です。

                                   

                                  私も、来週月曜あたりに確認してみようと思います。

                                   

                                  うまくできますように!

                                  • 14. Re: ボタンのトランジション
                                    noktzw Level 1

                                    150kwさま

                                     

                                    お世話になってます。

                                    いろいろと方法を考えていただき、ありがとうございます。

                                    もしかしたら、Encoreにおけるトランジションの概念が、

                                    普通の編集におけるトランジションと違うということなのでしょうか。

                                    Aeのコンポジションに、本編の映像まで入れる作業になると、

                                    動きのある本編映像だと、トランジション後の本編映像に

                                    ちゃんとずれることなくつなげるのは、まず不可能でしょう。

                                    ごまかすのであれば、ボタンにリンクしたチャプター部分の本編映像を

                                    静止画で切り出して使うほうが、まだ見れるものになると思います。

                                    ただ、Encoreからチャプター部分の静止画を切りだす方法はあるのでしょうか?

                                     

                                    Encoreにおけるボタンのトランジションというのは、

                                    メニュー画面から本編映像に、エフェクトをかけてつなぐものではなく、

                                    メニュー画面と本編映像の間に、エフェクト映像をインサートするという考えなのですか?

                                    トランジションがカットインにしかならないのであれば、

                                    本編映像側へエフェクトが残るトランジションには絶対にならないですね。

                                     

                                    でもトランジションという表記ならば、前者の考えが普通だと思うので、

                                    トランジション映像自体に本編映像を使うことなく、

                                    エフェクトをかけてメニューから本編につなぐ方法を探れないでしょうか?

                                    システム的に無理なのであれば、あきらめます。

                                    • 15. Re: ボタンのトランジション
                                      150kw Most Valuable Participant

                                      こんにちは

                                       

                                      >Encoreにおけるトランジションの概念が、普通の編集におけるトランジションと違うということなのでしょうか。

                                      Pr等のトランジションは前後の映像の重複した部分に掛けますが、Enの場合はメニュー映像とと本編映像との間に独立したトランジション映像を挿入するという形になりますね。

                                       

                                      >Aeのコンポジションに、本編の映像まで入れる作業になると、動きのある本編映像だと、トランジション後の本編映像にちゃんとずれることなくつなげるのは、まず不可能でしょう。

                                       

                                      トランジション映像の最後に、本編映像がうまく繋がるように、Prで本編映像の最初の部分をトリミングします。うまく繋がるようにトリミングするのがコツです。その後書き出します。

                                      メニュー映像とトランジション映像はシームレスに繋がりますが、トランジション映像と本編映像との繋がりは、画面は黒くはなりませんが、約0.5秒停止時間があります。これが玉に瑕ですね。

                                       

                                      >ごまかすのであれば、ボタンにリンクしたチャプター部分の本編映像を静止画で切り出して使うほうが、まだ見れるものになると思います。

                                      その通りです。こちらの場合は、約0.5秒間の停止時間はほとんど違和感がありません。

                                       

                                      >Encoreからチャプター部分の静止画を切りだす方法はあるのでしょうか?

                                      これは、Prで行います。プログラムモニターパネルの下右側(CS5の場合)にカメラの形をした「フレームを書き出し」アイコンがあります。再生ヘッド(または時間インジケーター)を書き出す フレームに移動し、このボタンを押します。「.jpg」ファイル形式で書き出すと良いでしょう。

                                       

                                      >Encoreにおけるボタンのトランジションというのは、メニュー画面から本編映像に、エフェクトをかけてつなぐものではなく、メニュー画面と本編映像の間に、エフェクト映像をインサートす るという考えなのですか?

                                      前にも申し上げましたが、その通りですね。

                                       

                                      >トランジションがカットインにしかならないのであれば、本編映像側へエフェクトが残るトランジションには絶対にならないですね。

                                      前にも申し上げましたが、うまく繋ぎを合わせれば何とかなるというところでしょうか。苦しいところです。

                                       

                                      >トランジション映像自体に本編映像を使うことなく、エフェクトをかけてメニューから本編につなぐ方法を探れないでしょうか?システム的に無理なのであれば、あきらめます。

                                      どうもメニュー映像に効果を掛けて、メニューを消すと言う使用方法のようですね。

                                      メニューから本編にシームレスに繋ぐ方法は私にはわかりません。

                                      Adobeのスタッフの方が追加説明などして下されば、良いですが。

                                       

                                      以上です。

                                      • 16. Re: ボタンのトランジション
                                        noktzw Level 1

                                        150kwさま

                                         

                                        いろいろ丁寧なお答えありがとうございます。

                                        Adobeサポートの対応では、Encoreはサポート終了というスタンスなので、

                                        これ以上の答えは出ないと思っています。

                                         

                                        様々な私レベルの疑問には、これで全部150kwさんに答えていただきました。

                                        また何か他の疑問が出てきたときは、お世話になるかもしれませんが、

                                        ひとまずこのスレッドは、解決という形にしたいと思います。

                                        本当にありがとうございました。

                                        • 17. Re: ボタンのトランジション
                                          150kw Most Valuable Participant

                                          こんばんは

                                           

                                          嬉しいリアクション有難うございます。

                                          実はメニューボタントランジションは、今回初めて知り、最初の頃にリンクを張ったYoutubeの映像で勉強したのですよ。

                                           

                                          それから、「回答」マークを押して頂きありがとうございます。私に10ポイント加算されます(笑)。

                                           

                                          最後にコンポジションのデュレーションの入力はセミコロンを入れて入力しているのでしたら、セミコロンを省いて入力して見て下さい。

                                          ご存知でしたらごめんなさい。