2016年3月26日土曜日

【動画】動画の製作(準備編)

駅伝チームとして結婚式の余興を頼まれる機会があったため、
チームがこれまで訪れた想い出の地を巡って結婚式場まで
たすきをつなぐ動画を作ろうということになりました(^^)/

その動画を作るにあたって学んだ製作方法についてここでは紹介していきたいと思います☆彡


動画製作ソフト


動画を作るにあたって使用するソフトはフリーソフトのみを使用します。
❏AviUtl(Windows用)
❏iMovie(Mac用)

それぞれにできること、操作性の違いがありますが大雑把に言うと以下のような感じです。
❏AviUtl → 動画を自由に製作できる
❏iMovie → テーマを選択してある程度決まった型に素材を当てはめられる

操作性は全く違いますが、この2つを使えばそれなりの動画が作れるかと思います。
特にAviUtlは使いこなしていけばどんな動画でも作れそうな気がするほど自由度が高いですが、
手間と慣れが必要かと思われます。。
(せっかく性能の良いMacを買いましたが、Macでは似たようなフリーソフトがまだ見つけられなかったため、Windowsも併用します(´・ω・))

AviUtl


AviUtlは以下からダウンロードできます。

AviUtlのお部屋


まずは簡単な使い方として以下の動画をご確認ください。



AviUtlの詳細な使い方はここのサイトを読めこんでいけば、かなり理解できると思います。

AviUtlの易しい使い方


iMovie


iMovieはAppleStoreからダウンロード可能です。

❏AppleStore - iMovie
https://itunes.apple.com/jp/app/imovie/id377298193?mt=8



iMovieではテーマを選んで動画と写真を切り替えながらタイトルを追加して調整することで、
質の高い動画が比較的簡単に作れます。



動画製作をはじめるにあたっては最初にこちらから使用してみるとよいかと思います(^^)/


完成動画(結婚式余興ムービー)


いろいろと苦労しながら製作して実際に結婚式で流れた動画が以下になります(^^♪




細かい箇所についての説明は、機会があれば別な記事で紹介していきますね('ω')ノ

【MAC】Macで初めに覚えておくべき操作方法について

今年の正月にiMacを購入しました(^^)/



Apple iMac
(Retina 5K Display 27/3.2GHz Quad Core i5/8GB/1TB Fusion/AMD Radeon R9 M390)

Androidアプリを作るためにも性能が良いNewマシンが欲しかったので、
思い切って購入(´・ω・)

動画製作やWebアプリ、ホームページの製作なんかにも手を広げていきたいとおもいます(^^)/


まぁ買ったみたところでここまでMacに触れてきたことがないため、
まずは使い方から勉強するため一通りの設定をいじりながら
Macで最初に覚えておくべきことをここでまとめておきたいと思います。



Windowsとの違い



Macを操作するとWindowsとの違いに戸惑う大きな点は以下のあたりになります。
❏キーボードの違い
❏マウスの違い
❏フォルダ(エクスプローラ)の違い

などが挙げられますが、触れていくと細かな点で違いがあることに気づきます。
どちらかというとLinux寄りな雰囲気ですが、慣れるまでには
少し時間がかかりそうな気がします|д゚)




ショートカットキー




Windowsとのキーの違いもあるため、一般的なショートカットについてまとめます。

ショートカット 説明
command + X 切り取り
command + C コピー
command + V ペースト
command + Z 取り消す
command + A すべて選択
command + F 検索
command + G 次を検索
command + H 最前面のウインドウを非表示
すべてのウィンドウを隠すには、「command + option + H」
command + M 最前面のウインドウを最小化して Dock にしまう
すべて最小化するには、「command + option + M」
command + N 新規ウインドウを開く
command + O ファイルを開く
command + P 印刷
command + S 保存
command + W 最前面のウインドウを閉じる。
すべてのウインドウを閉じるには、「command + option + W」
command + Q アプリの終了
command + option + esc アプリを選択して強制終了
「command + shift + option + esc」キーを 3 秒間押したままで、最前面の アプリのみを強制終了
control + スペース 検索フィールドの表示/非表示を切り替え
スペース 選択されている項目をプレビュー
command + tab アプリの切り替え
command + shift + “~” ウインドウの切り替え
command + shift + 3 スクリーンショット
Command + “,” 最前面のアプリの環境設定を開く



マジックマウス



マウスにはマウスホイールがなく、最初の設定では右クリックもないため戸惑いました( ;∀;)
でも慣れると使いやすそうなイメージです、操作方法は以下のような感じ('ω')




元Windowsユーザーは右クリックも最初から使用できるようにしておきましょう(^^;







Finder



Windowsでいうところのフォルダ(エクスプローラ)の代わりとなるものとしてFinderあります。

❏エクスプローラでは右上にあった閉じるや最大化/最小化なんかはFinderでは左上になります。

❏サイドバーなんかはエクスプローラと同じような使い方ができそうな感じです。

❏ファイルの削除がDeleteキーや右クリックでできず、ゴミ箱にファイルをドラッグ&ドロップする必要があるため、ゴミ箱をサイドバーに表示させましょう。設定方法は以下の手順で行います。
 ①Finderを起動してメニューから「移動」→「フォルダへ移動」を押下
 ②フォルダの場所に「~/.Trash」と入力して「移動」ボタンを押下して「~/.Trash」に移動
 ③サイドバーに「.Trash」をドラッグ&ドロップ

❏ステータスバーとパスバーの表示することで、現在どの階層にいるか表しているかやフォルダの項目数、ストレージの空き状況が確認できます。
(Finderの表示メニューから「パスバーを表示」「ステータスバーを表示」を選択)

2015年11月7日土曜日

【HTML】【CSS】コピペで使えるサンプル集-引用部分編

ブログなどでコピペだけで使えるHTMLタグのサンプル集を紹介していきたいと思います。

ここでは他サイトから文章を引用した時に使う引用部分(brockquote)のデザインについて
コピペだけで利用できるタグを紹介してきたいと思います。

CSSがわかる方は更にカスタマイズしていただければと思います。

タグ内でCSSを使用していますので、コピペで利用可能なものだけを紹介しますので、
画像は使用しません。


■利用方法
・テキストエリアのHTMLタグをコピペしてブログ等に貼り付けてください


関連記事

【HTML】【CSS】コピペで使えるサンプル集-見出し編(応用)
【HTML】【CSS】コピペで使えるサンプル集-見出し編(シンプル)
【HTML】【CSS】コピペで使えるサンプル集-ボタン編
【HTML】【CSS】コピペで使えるサンプル集-背景編



────────────────────────────────────────────────────────────────────
----------------------------------------------------------------------------------------------------------------------------------------

引用部分サンプル集

----------------------------------------------------------------------------------------------------------------------------------------
────────────────────────────────────────────────────────────────────


「引用部分①」
画像を使うBLOCKQUOTEと画像を使わないBLOCKQUOTEを
いろいろデザインする




引用部分②
ここに引用する文章を記載してください。



Let's create some interesting and modern styles for block quotes. We'll be using different techniques for creating a unique look for six examples.
tympanus