まいさんは衰退しました。
…してませんが、
というわけで、ヴァルドネール舞は株式会社ネコメシを退社します。
今までなんとなくWebのお仕事に携わりながら、
アパレル、販売、マスコミ業、コンパニオン、夜の仕事など、手探りで様々な事をしておりました。
雑業をやめて、やっぱりWeb一本で生きて行こうとおもった矢先に、日本でナンバーワンクラスの方たちとご一緒させていただいて、自分の技量を知りました。
Webの分野で第一線を歩む方達の仕事の進め方、マインドの持ち方、レベル感、そういったものを肌身で体感し、この業界で生きていくためにとても貴重なものをこの短時間でいただきました。
今回の経験でよい物差しをもったとして次につなげられれば良いと思います。
短い間でしたが、みなさん素敵な方ばかりですので今後も仲良くしてくれることを祈ります。
どうでもいいのですが、初音ミクさんの2013雪ミクコンペにて入賞いただきました。
もし、ファミリーマートでこの絵をみた時など思い出してください、
わたしの存在を。
ありがとうございました。( ˘ω˘ )ｽﾔｧ…
シネマグラフのつくりかた
いつの日だったか、シネマグラフ用撮影のために機材をひったくってお借りして、街に出たことがあります。
いまさらですが、撮った材料で遊んでみようとおもいます。
写真モデル＜ まりこ氏（非オタ）
というわけで、以下シネマグラフのチュートリアル
シネマグラフとは
動画を読み込めるようになったPhotoshopCS5から作るアニメーションgif。
静止画の一部分が動画のように動かすことで、アニメーションgif内で時間が止まっているような世界観を作り出します。
写真家のKevin Burg氏とJamie Beck氏が「シネマグラフ」と名付けた事で有名。
現在、専用アプリなどたくさん存在するようなので、知らない方が少ないかもしれませんが、Phtoshopで本格的に制作している方は日本では少ないのではないでしょうか。
今更感もしますが、。
必要なもの
- Photoshop CS5〜 Extendedも可（ない方は体験版から..）
- 動画
- センス
今回使用したのはPhotoshop CS5です。
途中で気づきましたが、CS6で確認したところウィンドウ内アニメーションの表記が「タイムライン」 など、名称が異なりましたので、そういったところが多々あるかもしれません..ご了承を。
流れ
１）素材づくり
２）動画づくり
３）静止画づくり
４）Gif画像用に加工
５）書き出し
シネマグラフのしくみは、静止画を上に置き、マスクをかけ、下で動画を動かし、それを最後にgif画像で出力します。
１）素材づくり
・撮影した動画をPhotoshopで開く
・上のメニュー、Window > Annimation でアニメーションウィンドウを表示
・アニメーションウィンドウ内右上の設定をクリック > ドキュメント設定
・フレーム数を15fpsに
２）動画づくり
シネマグラフにしたい部分の映像をトリミングします。
・トリミングしたい位置にフレーム数下の青いチップをスタートとゴールの位置にセット
・部分が決定したら、タイムライン右上の設定から「ワークエリアに合わせてデュレーションをトリミング」
選択された部分のみが抽出されます。
３）静止画づくり
・メニューから 選択範囲 → すべてを選択（⌘A）
・編集から結合部分をコピー (⌘C) → ペースト(⌘P)
レイヤータブの中にレイヤーが１枚増えました。
・キーボードのQ（または、パレットツール下したのマスクボタン）をぽちっとな
・ブラシツールを選択し動かしたい部分を塗る
・塗り終わったらマスクできているかを確認
先ほどのキーボードのQ（または、パレットツール下したのマスクボタン）部分をクリックしてみて下さい。
点線で静止部分が囲まれてたりするはずです。
・レイヤー２（静止画）を選択しながらalt（option）をおしつつレイヤー内マスクボタン選択
これでマスクがかかりしました。
レイヤー１を表示非表示とすればわかりやすいです。
（というか、ようは穴があいていれば良いとおもいます、たぶん）
ここでおかしいとおもったら
レイヤー２のマスク部分を選択し、消しゴムツールで部分の修正、
マスク部分を選択し、ごしごしすると消した部分が復活していきます。
軽くホラーですね。
もう少しでおわりますよ。
４）Gif画像用に加工
動画をレイヤー化します。
・タイムライン設定から「フレームをレイヤーに結合」を選択
ズラーとレイヤーが並びますね。
・オリジナルファイルのレイヤー１（静止画）とレイヤー２（動画）を削除
消さないと「gifにできないよ！」的なものが次のステップで出るはず
・タイムライン下部にある横長のアイコンをクリック、フレームアニメーションに変換
・設定から「レイヤーからフレームを作成」を選択
タイムラインにズラーと並びます
・１番目のフレームだけが0.73秒など数値が入っていますが、それを0秒(ディレイなし)に
・更に下の繰り返し数の設定を「無限」
これでずっとループします、あとは書き出すだけです。
５）書き出し
・「Web用に保存」を選択
・プリセットから
Gif ＞ 特定 ＞ パターン ＞ カラー256
必要な方は画像サイズを設定、プレビューで確認もしてみてください。
これで完成★（するハズ
ちなみにgif画像のため、ソーシャルサービスによって動かないことがあります。
残念ながらFacebookは動きません・・、いろいろ確認してみてください。
このごろ、短ビデオに特化した動画共有サービスアプリVine（ヴァイン）、Gnzo（グンゾウ）などよく見ていたせいかもしれませんが、シネマグラフにももう少し可能性を・・と思いました、最近忘れられがちでしょうか。
広告で使用する可能性があったら素敵だとおもうんですが..ともかく、コスプレイヤーさんとか美人なおねえさんでやりたいので、素材提供者を随時募集してます。
最後の方に行くにつれてだだくさですみません。
伝え方というか、書き方を..もっと勉強します。
目ばっかり芸がないですが、一番簡単でした..。ほかがむずかしかったのです。
なんでウォーリーなんだ、とかはほかっといてください。
舞でした(*ΦωΦ*)
うわっ・・・私の年収、...テンプレをつくりました。
こんにちわ、ネコメシのデザイナーまいです。
入社して数ヶ月の新参ものですが、どうぞよろしくお願いします。
日々、上昇志向の高いみなさんに囲まれていると、とても勉強になります。
webのプロフェッショナルを目指すべきは、転職にネコメシ！というわけで
「うわっ・・・私の年収、低すぎ…？」のテンプレートがありそうでなかったので作りました。
これで誰でも「うわっ・・・私の年収、低すぎ…？」になれます。
上のCATはわたしのマイ猫、ジョル氏です。
弊社ディレクターの山本で実行するとこんな感じです。
とても涼やかです。イケメンは何をしてもかっこ良くみえますね
うらやましいです。
一発目からすみません。
次はなにかのチュートリアルでもやってみたいとおもいます。（やったことがないので）
pngファイル、顔の部分は透過してあります
