Enviar búsqueda
Cargar
Core Image Tips & Tricks in iOS 9
•
16 recomendaciones
•
37,101 vistas
Shuichi Tsutsumi
Seguir
iOS 9 における Core Image の新機能について。Apple も多用しているブラーを利用した画面遷移アニメーションの実装方法等を紹介しています。
Leer menos
Leer más
Móvil
Denunciar
Compartir
Denunciar
Compartir
1 de 128
Descargar ahora
Descargar para leer sin conexión
Recomendados
iOSエンジニア in ハードウェア・プロジェクト
iOSエンジニア in ハードウェア・プロジェクト
Shuichi Tsutsumi
watchOS 2 新機能の細かい話
watchOS 2 新機能の細かい話
Shuichi Tsutsumi
WatchKitを実際にさわってみてわかったこと
WatchKitを実際にさわってみてわかったこと
Shuichi Tsutsumi
Audio Unit Extensions 〜オーディオエフェクトのアプリ間共有〜
Audio Unit Extensions 〜オーディオエフェクトのアプリ間共有〜
Shuichi Tsutsumi
Apple Watch 間通信
Apple Watch 間通信
Shuichi Tsutsumi
Core Graphics on watchOS 2
Core Graphics on watchOS 2
Shuichi Tsutsumi
UI/UX に影響の大きい watchOS 2 の新機能 3つ
UI/UX に影響の大きい watchOS 2 の新機能 3つ
Shuichi Tsutsumi
iOS 9 の新機能 Core Image 編
iOS 9 の新機能 Core Image 編
Shuichi Tsutsumi
Recomendados
iOSエンジニア in ハードウェア・プロジェクト
iOSエンジニア in ハードウェア・プロジェクト
Shuichi Tsutsumi
watchOS 2 新機能の細かい話
watchOS 2 新機能の細かい話
Shuichi Tsutsumi
WatchKitを実際にさわってみてわかったこと
WatchKitを実際にさわってみてわかったこと
Shuichi Tsutsumi
Audio Unit Extensions 〜オーディオエフェクトのアプリ間共有〜
Audio Unit Extensions 〜オーディオエフェクトのアプリ間共有〜
Shuichi Tsutsumi
Apple Watch 間通信
Apple Watch 間通信
Shuichi Tsutsumi
Core Graphics on watchOS 2
Core Graphics on watchOS 2
Shuichi Tsutsumi
UI/UX に影響の大きい watchOS 2 の新機能 3つ
UI/UX に影響の大きい watchOS 2 の新機能 3つ
Shuichi Tsutsumi
iOS 9 の新機能 Core Image 編
iOS 9 の新機能 Core Image 編
Shuichi Tsutsumi
とにかく明るいCore Spotlight
とにかく明るいCore Spotlight
今城 善矩
Firefox OSアーキテクチャクイックツアー - FxOSコードリーディングミートアップ#21向け追記版
Firefox OSアーキテクチャクイックツアー - FxOSコードリーディングミートアップ#21向け追記版
Masami Yabushita
今さら聞けない人のためのDevOps超入門
今さら聞けない人のためのDevOps超入門
VirtualTech Japan Inc.
【UE4.25 新機能】ロードの高速化機能「IOStore」について
【UE4.25 新機能】ロードの高速化機能「IOStore」について
エピック・ゲームズ・ジャパン Epic Games Japan
エターナらないゲーム開発
エターナらないゲーム開発
Kohki Miki
ここが変わる!Unity 5のスマホ開発 ~アセットバンドル、ビルド、プラグイン~
ここが変わる!Unity 5のスマホ開発 ~アセットバンドル、ビルド、プラグイン~
MakotoItoh
中国Firefox OS勉強会 3rd 組み込み屋さんから見たFirefox OS
中国Firefox OS勉強会 3rd 組み込み屋さんから見たFirefox OS
Masami Yabushita
Swift勉強会
Swift勉強会
Nagamine Hiromasa
【出張ヒストリア2018】Caligula Overdose 開発ワークフロー アラカルト
【出張ヒストリア2018】Caligula Overdose 開発ワークフロー アラカルト
historia_Inc
もしiOS8のカスタムキーボードがガジェットのSDKを搭載したら Ver.#ios8yahoo
もしiOS8のカスタムキーボードがガジェットのSDKを搭載したら Ver.#ios8yahoo
niwatako
Ansible softlayer
Ansible softlayer
Hideaki Tokida
Unity用ADV制作ツール「宴」概要
Unity用ADV制作ツール「宴」概要
Ryohei Tokimura
はじめてのiOSアプリ開発 ①
はじめてのiOSアプリ開発 ①
Nagamine Hiromasa
UE4のモバイル開発におけるコンテンツアップデートの話 - Chunk IDとの激闘編 -
UE4のモバイル開発におけるコンテンツアップデートの話 - Chunk IDとの激闘編 -
エピック・ゲームズ・ジャパン Epic Games Japan
Xcode 7 の新しいところ #cm_ios9
Xcode 7 の新しいところ #cm_ios9
Tomohiro Kumagai
Beatroboでのハードウェアプロトタイピング
Beatroboでのハードウェアプロトタイピング
Hideyuki TAKEI
ARでVRアバターを表示するシステムを構築しよう
ARでVRアバターを表示するシステムを構築しよう
torisoup
Xcode 6の新機能
Xcode 6の新機能
Shingo Sato
既存アプリのiOS8対応 #ios8yahoo
既存アプリのiOS8対応 #ios8yahoo
Yahoo!デベロッパーネットワーク
Lt 20150711
Lt 20150711
Tomoyuki Obi
OpenCV 3.0 on iOS
OpenCV 3.0 on iOS
Shuichi Tsutsumi
第1回 コデアルiOSアプリ勉強会
第1回 コデアルiOSアプリ勉強会
codeal
Más contenido relacionado
La actualidad más candente
とにかく明るいCore Spotlight
とにかく明るいCore Spotlight
今城 善矩
Firefox OSアーキテクチャクイックツアー - FxOSコードリーディングミートアップ#21向け追記版
Firefox OSアーキテクチャクイックツアー - FxOSコードリーディングミートアップ#21向け追記版
Masami Yabushita
今さら聞けない人のためのDevOps超入門
今さら聞けない人のためのDevOps超入門
VirtualTech Japan Inc.
【UE4.25 新機能】ロードの高速化機能「IOStore」について
【UE4.25 新機能】ロードの高速化機能「IOStore」について
エピック・ゲームズ・ジャパン Epic Games Japan
エターナらないゲーム開発
エターナらないゲーム開発
Kohki Miki
ここが変わる!Unity 5のスマホ開発 ~アセットバンドル、ビルド、プラグイン~
ここが変わる!Unity 5のスマホ開発 ~アセットバンドル、ビルド、プラグイン~
MakotoItoh
中国Firefox OS勉強会 3rd 組み込み屋さんから見たFirefox OS
中国Firefox OS勉強会 3rd 組み込み屋さんから見たFirefox OS
Masami Yabushita
Swift勉強会
Swift勉強会
Nagamine Hiromasa
【出張ヒストリア2018】Caligula Overdose 開発ワークフロー アラカルト
【出張ヒストリア2018】Caligula Overdose 開発ワークフロー アラカルト
historia_Inc
もしiOS8のカスタムキーボードがガジェットのSDKを搭載したら Ver.#ios8yahoo
もしiOS8のカスタムキーボードがガジェットのSDKを搭載したら Ver.#ios8yahoo
niwatako
Ansible softlayer
Ansible softlayer
Hideaki Tokida
Unity用ADV制作ツール「宴」概要
Unity用ADV制作ツール「宴」概要
Ryohei Tokimura
はじめてのiOSアプリ開発 ①
はじめてのiOSアプリ開発 ①
Nagamine Hiromasa
UE4のモバイル開発におけるコンテンツアップデートの話 - Chunk IDとの激闘編 -
UE4のモバイル開発におけるコンテンツアップデートの話 - Chunk IDとの激闘編 -
エピック・ゲームズ・ジャパン Epic Games Japan
Xcode 7 の新しいところ #cm_ios9
Xcode 7 の新しいところ #cm_ios9
Tomohiro Kumagai
Beatroboでのハードウェアプロトタイピング
Beatroboでのハードウェアプロトタイピング
Hideyuki TAKEI
ARでVRアバターを表示するシステムを構築しよう
ARでVRアバターを表示するシステムを構築しよう
torisoup
Xcode 6の新機能
Xcode 6の新機能
Shingo Sato
既存アプリのiOS8対応 #ios8yahoo
既存アプリのiOS8対応 #ios8yahoo
Yahoo!デベロッパーネットワーク
Lt 20150711
Lt 20150711
Tomoyuki Obi
La actualidad más candente
(20)
とにかく明るいCore Spotlight
とにかく明るいCore Spotlight
Firefox OSアーキテクチャクイックツアー - FxOSコードリーディングミートアップ#21向け追記版
Firefox OSアーキテクチャクイックツアー - FxOSコードリーディングミートアップ#21向け追記版
今さら聞けない人のためのDevOps超入門
今さら聞けない人のためのDevOps超入門
【UE4.25 新機能】ロードの高速化機能「IOStore」について
【UE4.25 新機能】ロードの高速化機能「IOStore」について
エターナらないゲーム開発
エターナらないゲーム開発
ここが変わる!Unity 5のスマホ開発 ~アセットバンドル、ビルド、プラグイン~
ここが変わる!Unity 5のスマホ開発 ~アセットバンドル、ビルド、プラグイン~
中国Firefox OS勉強会 3rd 組み込み屋さんから見たFirefox OS
中国Firefox OS勉強会 3rd 組み込み屋さんから見たFirefox OS
Swift勉強会
Swift勉強会
【出張ヒストリア2018】Caligula Overdose 開発ワークフロー アラカルト
【出張ヒストリア2018】Caligula Overdose 開発ワークフロー アラカルト
もしiOS8のカスタムキーボードがガジェットのSDKを搭載したら Ver.#ios8yahoo
もしiOS8のカスタムキーボードがガジェットのSDKを搭載したら Ver.#ios8yahoo
Ansible softlayer
Ansible softlayer
Unity用ADV制作ツール「宴」概要
Unity用ADV制作ツール「宴」概要
はじめてのiOSアプリ開発 ①
はじめてのiOSアプリ開発 ①
UE4のモバイル開発におけるコンテンツアップデートの話 - Chunk IDとの激闘編 -
UE4のモバイル開発におけるコンテンツアップデートの話 - Chunk IDとの激闘編 -
Xcode 7 の新しいところ #cm_ios9
Xcode 7 の新しいところ #cm_ios9
Beatroboでのハードウェアプロトタイピング
Beatroboでのハードウェアプロトタイピング
ARでVRアバターを表示するシステムを構築しよう
ARでVRアバターを表示するシステムを構築しよう
Xcode 6の新機能
Xcode 6の新機能
既存アプリのiOS8対応 #ios8yahoo
既存アプリのiOS8対応 #ios8yahoo
Lt 20150711
Lt 20150711
Similar a Core Image Tips & Tricks in iOS 9
OpenCV 3.0 on iOS
OpenCV 3.0 on iOS
Shuichi Tsutsumi
第1回 コデアルiOSアプリ勉強会
第1回 コデアルiOSアプリ勉強会
codeal
Moby Project (May 25, 2017, Tokyo)
Moby Project (May 25, 2017, Tokyo)
Akihiro Suda
AndroidStudioとGradleを利用したScala言語によるAndroidアプリの開発
AndroidStudioとGradleを利用したScala言語によるAndroidアプリの開発
Mogi Isamu
iPhoneとAndroidのアプリ開発最新潮流
iPhoneとAndroidのアプリ開発最新潮流
Rakuten Group, Inc.
RFC Viewer開発を通して学ぶ!! iOS開発のパターン化
RFC Viewer開発を通して学ぶ!! iOS開発のパターン化
幸雄 村上
Pokelabo android web
Pokelabo android web
Shumpei Shiraishi
RubyKaigi2009 - RubyをつかったiPhoneアプリケーション開発
RubyKaigi2009 - RubyをつかったiPhoneアプリケーション開発
takuma mori
I phone5 ios6
I phone5 ios6
Vitalify - SPINOFF
Build an iOS app with ConcourseCI
Build an iOS app with ConcourseCI
健仁 天沼
関数型言語ElixirのIoTシステム開発への展開
関数型言語ElixirのIoTシステム開発への展開
Hideki Takase
.NET 6の期待の新機能とアップデート
.NET 6の期待の新機能とアップデート
TomomitsuKusaba
DockerでJupyter使おうぜ
DockerでJupyter使おうぜ
Satoshi Yazawa
20110819 関西 kinect勉強会 初級編
20110819 関西 kinect勉強会 初級編
誠 山崎
Css nite(2010.09.23)
Css nite(2010.09.23)
Yoshiki Ushida
[141004] cedec 2014 참관기 & 강연 리뷰 #1
[141004] cedec 2014 참관기 & 강연 리뷰 #1
MinGeun Park
2015 11 05_ios9_新仕様まとめ_社内勉強会
2015 11 05_ios9_新仕様まとめ_社内勉強会
Natsuki Yamanaka
Python & PyConJP 2014 Report
Python & PyConJP 2014 Report
gree_tech
福井スマートフォンハッカソン Titanium Mobileの紹介
福井スマートフォンハッカソン Titanium Mobileの紹介
Mori Shingo
地味だけど劇的に便利になるGitHubリポジトリ設定あれこれ
地味だけど劇的に便利になるGitHubリポジトリ設定あれこれ
Kazumi IWANAGA
Similar a Core Image Tips & Tricks in iOS 9
(20)
OpenCV 3.0 on iOS
OpenCV 3.0 on iOS
第1回 コデアルiOSアプリ勉強会
第1回 コデアルiOSアプリ勉強会
Moby Project (May 25, 2017, Tokyo)
Moby Project (May 25, 2017, Tokyo)
AndroidStudioとGradleを利用したScala言語によるAndroidアプリの開発
AndroidStudioとGradleを利用したScala言語によるAndroidアプリの開発
iPhoneとAndroidのアプリ開発最新潮流
iPhoneとAndroidのアプリ開発最新潮流
RFC Viewer開発を通して学ぶ!! iOS開発のパターン化
RFC Viewer開発を通して学ぶ!! iOS開発のパターン化
Pokelabo android web
Pokelabo android web
RubyKaigi2009 - RubyをつかったiPhoneアプリケーション開発
RubyKaigi2009 - RubyをつかったiPhoneアプリケーション開発
I phone5 ios6
I phone5 ios6
Build an iOS app with ConcourseCI
Build an iOS app with ConcourseCI
関数型言語ElixirのIoTシステム開発への展開
関数型言語ElixirのIoTシステム開発への展開
.NET 6の期待の新機能とアップデート
.NET 6の期待の新機能とアップデート
DockerでJupyter使おうぜ
DockerでJupyter使おうぜ
20110819 関西 kinect勉強会 初級編
20110819 関西 kinect勉強会 初級編
Css nite(2010.09.23)
Css nite(2010.09.23)
[141004] cedec 2014 참관기 & 강연 리뷰 #1
[141004] cedec 2014 참관기 & 강연 리뷰 #1
2015 11 05_ios9_新仕様まとめ_社内勉強会
2015 11 05_ios9_新仕様まとめ_社内勉強会
Python & PyConJP 2014 Report
Python & PyConJP 2014 Report
福井スマートフォンハッカソン Titanium Mobileの紹介
福井スマートフォンハッカソン Titanium Mobileの紹介
地味だけど劇的に便利になるGitHubリポジトリ設定あれこれ
地味だけど劇的に便利になるGitHubリポジトリ設定あれこれ
Más de Shuichi Tsutsumi
Core MLのアップデートを3倍楽しむ方法 #wwdctokyo
Core MLのアップデートを3倍楽しむ方法 #wwdctokyo
Shuichi Tsutsumi
エンジニアという仕事を楽しみ続けるためのキャリア戦略
エンジニアという仕事を楽しみ続けるためのキャリア戦略
Shuichi Tsutsumi
Depth in Depth #iOSDC
Depth in Depth #iOSDC
Shuichi Tsutsumi
UIImageView vs Metal [日本語版] #tryswiftconf
UIImageView vs Metal [日本語版] #tryswiftconf
Shuichi Tsutsumi
UIImageView vs Metal #tryswiftconf
UIImageView vs Metal #tryswiftconf
Shuichi Tsutsumi
飛び道具ではないMetal #iOSDC
飛び道具ではないMetal #iOSDC
Shuichi Tsutsumi
Deep Learning on iOS #360iDev
Deep Learning on iOS #360iDev
Shuichi Tsutsumi
Client-Side Deep Learning
Client-Side Deep Learning
Shuichi Tsutsumi
Building iOS apps using "Bluetooth Low Energy"
Building iOS apps using "Bluetooth Low Energy"
Shuichi Tsutsumi
Practical Core Bluetooth in IoT & Wearable projects @ AltConf 2016
Practical Core Bluetooth in IoT & Wearable projects @ AltConf 2016
Shuichi Tsutsumi
Practical Core Bluetooth in IoT & Wearable projects @ UIKonf 2016
Practical Core Bluetooth in IoT & Wearable projects @ UIKonf 2016
Shuichi Tsutsumi
オープンソースエコシステム #demodaytokyo
オープンソースエコシステム #demodaytokyo
Shuichi Tsutsumi
殺しても死なないアプリ 〜Core Bluetooth の「状態の保存と復元」機能〜
殺しても死なないアプリ 〜Core Bluetooth の「状態の保存と復元」機能〜
Shuichi Tsutsumi
おもしろく働くための「わらしべ長者方式」
おもしろく働くための「わらしべ長者方式」
Shuichi Tsutsumi
カヤックを退職すべきではない3つの理由
カヤックを退職すべきではない3つの理由
Shuichi Tsutsumi
BluetoothLEデバイスと技適 〜EstimoteのBeaconsを使うと逮捕されるのか〜
BluetoothLEデバイスと技適 〜EstimoteのBeaconsを使うと逮捕されるのか〜
Shuichi Tsutsumi
Bluetooth LEデバイスと技適 〜EstimoteのBeaconsを使うと逮捕されるのか〜
Bluetooth LEデバイスと技適 〜EstimoteのBeaconsを使うと逮捕されるのか〜
Shuichi Tsutsumi
Tantan sumo
Tantan sumo
Shuichi Tsutsumi
「スキルなし・実績なし」 32歳窓際エンジニアがシリコンバレーで働くようになるまで
「スキルなし・実績なし」 32歳窓際エンジニアがシリコンバレーで働くようになるまで
Shuichi Tsutsumi
Company Scouter
Company Scouter
Shuichi Tsutsumi
Más de Shuichi Tsutsumi
(20)
Core MLのアップデートを3倍楽しむ方法 #wwdctokyo
Core MLのアップデートを3倍楽しむ方法 #wwdctokyo
エンジニアという仕事を楽しみ続けるためのキャリア戦略
エンジニアという仕事を楽しみ続けるためのキャリア戦略
Depth in Depth #iOSDC
Depth in Depth #iOSDC
UIImageView vs Metal [日本語版] #tryswiftconf
UIImageView vs Metal [日本語版] #tryswiftconf
UIImageView vs Metal #tryswiftconf
UIImageView vs Metal #tryswiftconf
飛び道具ではないMetal #iOSDC
飛び道具ではないMetal #iOSDC
Deep Learning on iOS #360iDev
Deep Learning on iOS #360iDev
Client-Side Deep Learning
Client-Side Deep Learning
Building iOS apps using "Bluetooth Low Energy"
Building iOS apps using "Bluetooth Low Energy"
Practical Core Bluetooth in IoT & Wearable projects @ AltConf 2016
Practical Core Bluetooth in IoT & Wearable projects @ AltConf 2016
Practical Core Bluetooth in IoT & Wearable projects @ UIKonf 2016
Practical Core Bluetooth in IoT & Wearable projects @ UIKonf 2016
オープンソースエコシステム #demodaytokyo
オープンソースエコシステム #demodaytokyo
殺しても死なないアプリ 〜Core Bluetooth の「状態の保存と復元」機能〜
殺しても死なないアプリ 〜Core Bluetooth の「状態の保存と復元」機能〜
おもしろく働くための「わらしべ長者方式」
おもしろく働くための「わらしべ長者方式」
カヤックを退職すべきではない3つの理由
カヤックを退職すべきではない3つの理由
BluetoothLEデバイスと技適 〜EstimoteのBeaconsを使うと逮捕されるのか〜
BluetoothLEデバイスと技適 〜EstimoteのBeaconsを使うと逮捕されるのか〜
Bluetooth LEデバイスと技適 〜EstimoteのBeaconsを使うと逮捕されるのか〜
Bluetooth LEデバイスと技適 〜EstimoteのBeaconsを使うと逮捕されるのか〜
Tantan sumo
Tantan sumo
「スキルなし・実績なし」 32歳窓際エンジニアがシリコンバレーで働くようになるまで
「スキルなし・実績なし」 32歳窓際エンジニアがシリコンバレーで働くようになるまで
Company Scouter
Company Scouter
Core Image Tips & Tricks in iOS 9
1.
Core Image Tips
& Tricks in iOS 9 Shuichi Tsutsumi @shu223 iOS 9 Bootcamp(2015.10.7)
2.
自己紹介 • iOS専業フリーランスエンジニア • ブログ『Over&Out
その後』 • GitHub: shu223 『iOS-9-Sampler』 • 著書 - 「iOSアプリ開発 達人のレシピ100」 - 「iOS×BLE Core Bluetooth プログラミング」 • クラスメソッド田宮さんとは13年前の就活時にグループ面接で出会った - 4年前、iOSの勉強会で偶然再開 - 昨年クラスメソッドに入社したとのことでランチ行った
3.
概要 iOS 9 の
Core Image の新機能について話します
4.
フィルタが増えました! Original
5.
フィルタが増えました! CICrystallizeOriginal
6.
フィルタが増えました! CIPointillizeOriginal
7.
フィルタが増えました! Original CICircularWrap
8.
フィルタが増えました! CIKaleidoscopeOriginal
9.
使わなそう・・・
10.
本発表の方針
11.
本発表の方針 • 新フィルタの紹介
12.
本発表の方針 • 新フィルタの紹介
13.
本発表の方針 • 新フィルタの紹介 • 飛び道具的なものは省き、なるべく実用的な話をします
14.
本発表の方針 • 新フィルタの紹介 • 飛び道具的なものは省き、なるべく実用的な話をします 1.
Apple も UI で多用する「ブラー」の話
15.
本発表の方針 • 新フィルタの紹介 • 飛び道具的なものは省き、なるべく実用的な話をします 1.
Apple も UI で多用する「ブラー」の話 2. Core Image を画面遷移のカスタムアニメーションに使う話
16.
本発表の方針 • 新フィルタの紹介 • 飛び道具的なものは省き、なるべく実用的な話をします 1.
Apple も UI で多用する「ブラー」の話 2. Core Image を画面遷移のカスタムアニメーションに使う話 3. ヌルッとしたアニメーションを実現するための Metal の話
17.
1. ブラー
18.
ブラーとは?
19.
ブラーとは?
20.
ブラーとは?
21.
ブラーとは? 画像をぼかす処理のこと
22.
iOS におけるブラーを用いた表現
23.
iOS におけるブラーを用いた表現 コントロールパネル - オーバーレイするパネルの背 景にブラー -
いわゆる「磨りガラス効果」
24.
iOS におけるブラーを用いた表現 3D Touch
- Quick Actions - 周囲のアイコンがタッチの強 さに応じてボケていき、 ショートカットメニューが表 示される
25.
iOS におけるブラーを用いた表現 3D Touch
- Live Photo 再生 - 静止画と動画のつなぎにブラーを 利用
26.
iOS におけるブラーを用いた表現 Spotlight - 下方向に画面をドラッグする と検索窓が出てくる -
遷移の進行に応じてホーム画 面がボケていく
27.
• Appleも積極的に「ブラー」をUIに利用
28.
• Appleも積極的に「ブラー」をUIに利用 • (デザイナーさんから提示される)デザイン案にブラーが 用いられることも多い
29.
• Appleも積極的に「ブラー」をUIに利用 • (デザイナーさんから提示される)デザイン案にブラーが 用いられることも多い →
iOS アプリの UI においてブラーを用いた表現は重要!
30.
• Photoshop で利用可能なブラー(の一部) -
Box Blur - Gaussian Blur - Radial Blur (Zoom) - Lens Blur - Motion Blur - Shape Blur - Tilt-Shift ブラーの種類
31.
Original
32.
Original Box
33.
Original Box Gaussian
34.
Original Box Gaussian
Zoom
35.
• ぼけ方が違い、用途が違う
36.
• ぼけ方が違い、用途が違う - カーネルの形状や分布が違うもの
37.
• ぼけ方が違い、用途が違う - カーネルの形状や分布が違うもの -
カーネルを動的に決定するもの
38.
• ぼけ方が違い、用途が違う - カーネルの形状や分布が違うもの -
カーネルを動的に決定するもの - 複合的な処理をするもの
39.
• ぼけ方が違い、用途が違う - カーネルの形状や分布が違うもの -
カーネルを動的に決定するもの - 複合的な処理をするもの → ブラーにもいろいろある
40.
ブラー処理の負荷
41.
カーネルと畳み込み処理
42.
カーネルと畳み込み処理 • ブラー処理:周囲の画素との平 均値を取るカーネル(オペレー タ/Weights とも呼ばれる)を 畳み込む
43.
カーネルと畳み込み処理 • ブラー処理:周囲の画素との平 均値を取るカーネル(オペレー タ/Weights とも呼ばれる)を 畳み込む •
カーネルサイズと画像サイズに 応じて処理量が指数関数的に増 大する
44.
カーネルと畳み込み処理 • ブラー処理:周囲の画素との平 均値を取るカーネル(オペレー タ/Weights とも呼ばれる)を 畳み込む •
カーネルサイズと画像サイズに 応じて処理量が指数関数的に増 大する カーネルサイズ3x3、画像サイズ2448x3264の場合:演算回数7191万回 カーネルサイズが7x7だと、3億9152万回!
45.
→ ブラーおよび畳み込み処理はシンプルだが 処理の負荷は大きい
46.
動的にブラー処理を行う必要があるケース
47.
動的にブラー処理を行う必要があるケース 例:Spotlight 画面への遷移
48.
動的にブラー処理を行う必要があるケース 例:Spotlight 画面への遷移 • 動的にキャプチャ取得
49.
動的にブラー処理を行う必要があるケース 例:Spotlight 画面への遷移 • 動的にキャプチャ取得 •
遷移進行状況に応じてボケ度合い を変えたブラー処理
50.
動的にブラー処理を行う必要があるケース 例:Spotlight 画面への遷移 • 動的にキャプチャ取得 •
遷移進行状況に応じてボケ度合い を変えたブラー処理 + 処理結果を描画(画面に表示)
51.
動的にブラー処理を行う必要があるケース 例:Spotlight 画面への遷移 • 動的にキャプチャ取得 •
遷移進行状況に応じてボケ度合い を変えたブラー処理 + 処理結果を描画(画面に表示) • 60FPSなら0.016秒ごとに畳み込み 演算処理+描画を行う必要がある
52.
• ユーザーのジェスチャの処理をブロックしてはいけない
53.
• ユーザーのジェスチャの処理をブロックしてはいけない • ブラー処理を行いその出力結果を即時描画しないといけな いので、バックグラウンドで非同期処理というわけにもい かない
54.
• ユーザーのジェスチャの処理をブロックしてはいけない • ブラー処理を行いその出力結果を即時描画しないといけな いので、バックグラウンドで非同期処理というわけにもい かない •
ある程度のFPSで処理しないと「ヌルッ」とした感じにな らない
55.
• ユーザーのジェスチャの処理をブロックしてはいけない • ブラー処理を行いその出力結果を即時描画しないといけな いので、バックグラウンドで非同期処理というわけにもい かない •
ある程度のFPSで処理しないと「ヌルッ」とした感じにな らない → GPU Acceleration が必須!
56.
いったん整理
57.
いったん整理 • iOS アプリの
UI においてブラーを用いた表現は重要
58.
いったん整理 • iOS アプリの
UI においてブラーを用いた表現は重要 • ブラーにもいろいろある
59.
いったん整理 • iOS アプリの
UI においてブラーを用いた表現は重要 • ブラーにもいろいろある • ブラー処理の肝である畳み込み演算処理は負荷が大きい
60.
いったん整理 • iOS アプリの
UI においてブラーを用いた表現は重要 • ブラーにもいろいろある • ブラー処理の肝である畳み込み演算処理は負荷が大きい • 遷移アニメーション等、動的な処理が必要な場合、GPU Acceleration が必須
61.
iOSにおけるブラー実装方法 の近代史
62.
iOS 7 以前
63.
iOS 7 以前 Core
Graphics CPUでの処理になるので当然重い 実装が面倒/自分で要最適化
64.
iOS 7 以前 Core
Graphics CPUでの処理になるので当然重い 実装が面倒/自分で要最適化 OpenGLシェーダ CIKernelがまだないのでOpenGLの知識が必要
65.
iOS 7 以前 Core
Graphics CPUでの処理になるので当然重い 実装が面倒/自分で要最適化 OpenGLシェーダ CIKernelがまだないのでOpenGLの知識が必要 vImage 実装が面倒/情報も少ない
66.
iOS 7 以前 Core
Graphics CPUでの処理になるので当然重い 実装が面倒/自分で要最適化 OpenGLシェーダ CIKernelがまだないのでOpenGLの知識が必要 vImage 実装が面倒/情報も少ない Core Image CIGaussianBlurしかない
67.
iOS 7 以前 Core
Graphics CPUでの処理になるので当然重い 実装が面倒/自分で要最適化 OpenGLシェーダ CIKernelがまだないのでOpenGLの知識が必要 vImage 実装が面倒/情報も少ない Core Image CIGaussianBlurしかない UIToolBarを流用 邪道
68.
iOS 7 以前 Core
Graphics CPUでの処理になるので当然重い 実装が面倒/自分で要最適化 OpenGLシェーダ CIKernelがまだないのでOpenGLの知識が必要 vImage 実装が面倒/情報も少ない Core Image CIGaussianBlurしかない UIToolBarを流用 邪道 GPUImage サードパーティ製/コードでかい
69.
iOS 8
70.
iOS 8 • CIKernel
71.
iOS 8 • CIKernel -
GPUで処理される高速フィルタを自作し、 CIFilterとして扱えるようになった
72.
iOS 8 • CIKernel -
GPUで処理される高速フィルタを自作し、 CIFilterとして扱えるようになった - Shading Language の知識が必要
73.
iOS 8 • CIKernel -
GPUで処理される高速フィルタを自作し、 CIFilterとして扱えるようになった - Shading Language の知識が必要 • UIEffect
74.
iOS 8 • CIKernel -
GPUで処理される高速フィルタを自作し、 CIFilterとして扱えるようになった - Shading Language の知識が必要 • UIEffect - 「磨りガラス効果」が簡単にできるように
75.
iOS 8 • CIKernel -
GPUで処理される高速フィルタを自作し、 CIFilterとして扱えるようになった - Shading Language の知識が必要 • UIEffect - 「磨りガラス効果」が簡単にできるように - ただ明るい/暗いしか開発者は選択の余地が ない(ぼけ具合すらコントロールできない)
76.
iOS 9
77.
iOS 9 • CIFilter
78.
iOS 9 • CIFilter -
CIBoxBlur - CIDiscBlur - CIMotionBlur - CIZoomBlur (Motion / Zoom は実際には 8.3 から)
79.
ポイント
80.
ポイント • CIFilterはGPUで処理される
81.
ポイント • CIFilterはGPUで処理される • 実装は超簡単
82.
ポイント • CIFilterはGPUで処理される • 実装は超簡単
83.
→ iOS 9
では、 • 多様なブラー(Box, Gaussian, Motion…)を • 高速(by GPU)かつ • 手軽(ビルトイン)に 利用できるようになった
84.
こういう表現がしやすくなった
85.
2. 画面遷移アニメーション
86.
CIFilterのトランジションカテゴリ
87.
CIFilterのトランジションカテゴリ • CICategoryTransition
88.
CIFilterのトランジションカテゴリ • CICategoryTransition - iOS
では 6 から利用可能に
89.
CIFilterのトランジションカテゴリ • CICategoryTransition - iOS
では 6 から利用可能に • トランジション=遷移
90.
CIFilterのトランジションカテゴリ • CICategoryTransition - iOS
では 6 から利用可能に • トランジション=遷移 • スライドショーの画像間や、動画のシーン切り替え用途で 用意されたもの
91.
参考OSS:CoreImageTransition
92.
参考OSS:CoreImageTransition
93.
参考OSS:CoreImageTransition • https://github.com/shu223/ CoreImageTransition • CICategoryTransition
のフィルタ9種 類を試せるサンプル • 解説記事: http://d.hatena.ne.jp/ shu223/20130311/1362962817
94.
iOS 9 で追加されたトランジション CIPageCurlTransition
CIPageCurlWithShadowTransition CIRippleTransition
95.
iOS 9 で追加されたトランジション CIPageCurlTransition
CIPageCurlWithShadowTransition CIRippleTransition
96.
iOS 9 で追加されたトランジション CIPageCurlTransition
CIPageCurlWithShadowTransition CIRippleTransition
97.
iOS 9 で追加されたトランジション CIPageCurlTransition
CIPageCurlWithShadowTransition CIRippleTransition
98.
UIKit カスタム画面遷移 × Core Image
トランジション
99.
カスタム画面遷移 • iOS 7
より、UINavigationController やモーダル表示によ る画面遷移アニメーションを簡単に自作できるようになっ た
100.
参考OSS:AnimatedTransitionGallery • https://github.com/shu223/ AnimatedTransitionGallery • 53種類のカスタム画面遷移を 試せるサンプルコード •
解説記事: http://d.hatena.ne.jp/ shu223/20140416/1397608 824
101.
カスタム画面遷移 × Core
Imageトランジション
102.
カスタム画面遷移 × Core
Imageトランジション スナップショット取得
103.
カスタム画面遷移 × Core
Imageトランジション スナップショット取得 スナップショットに対して Core Image のトランジションエフェクトをかける
104.
AnimatedTransitionGallery/ CoreImageTransitions https://github.com/shu223/AnimatedTransitionGallery/tree/master/CoreImageTransitions
105.
AnimatedTransitionGallery/ CoreImageTransitions https://github.com/shu223/AnimatedTransitionGallery/tree/master/CoreImageTransitions
106.
AnimatedTransitionGallery/ CoreImageTransitions https://github.com/shu223/AnimatedTransitionGallery/tree/master/CoreImageTransitions
107.
AnimatedTransitionGallery/ CoreImageTransitions https://github.com/shu223/AnimatedTransitionGallery/tree/master/CoreImageTransitions
108.
→ UINavigationController の
push / pop 時やモーダル遷移 時の遷移アニメーションに、Core Image のトランジショ ンエフェクトを使ってみた ・・・ものの、
109.
110.
クセが強すぎて普通のアプリ で使うにはちょっと・・・
111.
CICategoryTransition以外の フィルタでもOK
112.
CICategoryTransition以外の フィルタでもOK • Transitionカテゴリのフィルタの特徴は、 「時間」の概念(kCIInputTimeKey)が あること
113.
CICategoryTransition以外の フィルタでもOK • Transitionカテゴリのフィルタの特徴は、 「時間」の概念(kCIInputTimeKey)が あること - 経過時間に応じてエフェクトのかかり具 合が進行していく
114.
CICategoryTransition以外の フィルタでもOK • Transitionカテゴリのフィルタの特徴は、 「時間」の概念(kCIInputTimeKey)が あること - 経過時間に応じてエフェクトのかかり具 合が進行していく →kCIInputTimeKey
がなくても、経過時 間を何らかのパラメータに割り振ればOK
115.
UIKit カスタム画面遷移 × Core Image
ブラー
116.
例1:CIBoxBlur 方針 • 遷移の経過時間に応じて kCIInputRadius
を設定
117.
https://github.com/shu223/AnimatedTransitionGallery/tree/master/CoreImageTransitions
118.
例2:CIMotionBlur 方針 • 遷移の方向を kCIInputAngle
に適用 • 移動量に応じて kCIInputRadius を設定(早く移動するほ どボケる)
119.
https://github.com/shu223/AnimatedTransitionGallery/tree/master/CoreImageTransitions
120.
• 遷移方向に • 移動量に応じた強さで ボケる →
遷移のスピード感を表現
121.
3. Core Image
× Metal
122.
Metal • OpenGL に代わるローレベルのグラフィックAPI •
OpenGL は多くのハードをサポートするために、特定の ハードの性能を限界まで引き出せていなかった • Metal は Apple のハードに特化しているため、最大で OpenGL の10倍速い(by Apple)
123.
Core Image ×
Metal CIFilter のビルトインフィルタ(のいくつか)は Metal Performance Shader を利用
124.
Core Image ×
Metal MTLTexture から CIFilter への直接入力、CIFilter から MTLTexture への直接出力も可能に
125.
MetalKit
126.
MetalKit
127.
• GLKit の
GLKView ライクに、MetalKit の MTKView に CIFilter の処理結果を直接描画可能に → Metal でフィルタをかけて Metal で描画!
128.
まとめ • iOS 9
では CIFilter にブラー系のビルトインフィルタがいくつか追 加された - GPU で高速処理されるブラーフィルタが手軽に使えるように なった! - Apple も大好きなブラーを使った UI が実現しやすくなった! • そんな Core Image のブラー系フィルタを画面遷移のカスタムアニ メーションに使ってみるといいかも • iOS 9 で追加された MetalKit および Core Image の Metal 連携でさ らにヌルッとしたアニメーションを実現できるかも
Descargar ahora