Wpfでミニチュア風動画を愉しもう Rev3

8
Microsoft teched Japan 2009 ライトニング トーク http://www.microsoft.com/japan/teched/2009/connect/lt.mspx

Transcript of Wpfでミニチュア風動画を愉しもう Rev3

Page 1: Wpfでミニチュア風動画を愉しもう Rev3

Microsoft tech・ed Japan 2009 ライトニングトーク

http://www.microsoft.com/japan/teched/2009/connect/lt.mspx

Page 2: Wpfでミニチュア風動画を愉しもう Rev3

NET Framework3.5 SP1~

PixelShaderで何が嬉しい?

◦ GPUを使った高速処理(エフェクト)

◦ 動画もリアルタイムレタッチ可能

エフェクトの種類

1. 標準Effect(2種)

2. PixelShaderLibrary

20種以上のエフェクトサンプル

改造・拡張も可能

3. 独自PixelShader(PS)

PixelShader2.0 準拠

CodePlexのサンプルアプリhttp://wpffx.codeplex.com/

流行のネタで遊んでみよう

Page 3: Wpfでミニチュア風動画を愉しもう Rev3

チルトシフトレンズ効果◦ 写真家 本城直季氏が提案した独特な作風

◦ 極端に被写界深度が浅くなるように撮影

◦ 実写がまるでミニチュアのように見える

超おすすめ!

Page 4: Wpfでミニチュア風動画を愉しもう Rev3

② 色合いをおもちゃっぽく (Bloom Effect)

③ 外枠に影 (OpacityMask)

※ 勝手に考えた創作レシピです

① 部分的にぼかす~疑似被写界深度~(Blur Effect × OpacityMask)

④ 動画を早送り再生(MediaElement.Speed Ratio)

PixelShader

WPF

Page 5: Wpfでミニチュア風動画を愉しもう Rev3

命名『チルト・シフトプレイヤー』

好きな動画や写真で遊べる

(MediaElement使用)

ピントの位置を

スライダーで指定

隠し味を微調整

動画保存できないからプレイ

ヤー

Page 6: Wpfでミニチュア風動画を愉しもう Rev3

すべての UI Element にEffect を設定可能

Effect一覧から選択

(自作も含む)

GUI でプロパティのDataBinding が設定できる!

自前パラメーターも!

Page 7: Wpfでミニチュア風動画を愉しもう Rev3

チルトシフト効果は今年流行る!◦ 気軽に楽しめます

WPFとの融合で PixelShader 実装が容易に◦ Expression Blend3 のサポートが充実

PixelShader

◦ 心的効果・効能を操作性向上に利用

WPF×PixelShaderで 効果的に UX を向上させましょう

付箋紙アプリ

古い情報ほど退色していく

株トレーダー

重要警告時は他をぼかす

Page 8: Wpfでミニチュア風動画を愉しもう Rev3

資料中のサンプル映像掲載元

のりものポッドキャスト 様http://podcast.picopico.jp/

許諾頂き、ありがとうございました!

デモアプリのダウンロード

登壇者ブログで公開しますhttp://d.hatena.ne.jp/NIM0506/

よしすけカンパニー様http://www.youtube.com/user/tajimatv?gl=JP&hl=ja