38
39

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

コードを一切書かずにinstagramを作ろう!コーディング不要でカメラフィルターを量産するツール

Last updated at Posted at 2014-06-25

by @mixiappwchr

Screenshot 2014.06.25 14.10.06_120.png

#GPUImageCafe

GPUImageCafe

#これは何?

以前のDeNA中の人が事例で語る、アニメーションやデザインのアプリを効率よく開発するためのTips #iOSというエントリーで、実際の現場で、カメラフィルターを作るために、調整用のアプリを作ったと書いたのですが、こちらのアプリをちょっとブラッシュアップしました。

コードなどを書かずに、カメラフィルターを量産することができます。

#機能

  • iPhone + iPad両対応
  • 基本的なフィルターのパラメータをいじることで独自のフィルターを作成
  • サンプル画像+カメラキャプチャでプレビューしながらフィルターを調整
  • 調整したパラメータはJSON形式で吐き出して、それを元にGPUImageのフィルターを生 成可能。

#画面
サンプル画像やカメラキャプチャに対してリアルタイムでフィルターを調整できます。
Screenshot 2014.06.25 14.06.23_120.png

調整しやすいようiPad対応しています。
Screenshot 2014.06.25 14.10.06_120.png

作ったフィルターはローカルに保存しておけます。
Screenshot 2014.06.25 14.09.20_120.png

#Require
Cocoapodsが必要ですのでインストールしてください。

#フィルターを作ったら
JSONでパラメータを保存でき、同梱のライブラリでパラメータを渡してあげれば、GPUImageのFilterを生成できます。

GPUimageFilterGroup *filter = [[[MYGPUImageFilterFactory alloc] init] createFilterGroupWithArray:params];

#終わりに
実装はフィルターのグループを作って複数のフィルターをつなぎ合わせています。シェーダーで作った方が高速かもしれませんが、パラメータ指定で調整できるためこの方式にしています。

作ったパラメータでいいものがあったら,ぜひpull reqでもなんでもいいので僕に送ってください!
プリセットのフィルターに追加させてもらいます。

以上、工夫次第で、コードを書かずに、機能実装を進めることができるため、サポートアプリを作るという選択肢はありかなとおもいます。

38
39
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
38
39

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?