tah nn

主にアプリ開発の技術メモを残していきます。

LogoMe-シルエット写真加工アプリ-リリースしました!

写真を簡単にオシャレなシルエットにするアプリ LogoMe をリリースしました。



こちらのアプリを使用すると下記イメージのような画像が簡単に作れます。

編集前

編集後


シルエットエフェクトだけでなく、ペイントや文字入れ機能を入れました。イメージの編集後にある「LogoMe」という文字はシルエットと同化させています。


今回は本アプリで行なっているシルエット加工の方法をご紹介します。


シルエット加工はGPUImageライブラリを使用して、下記例のようにGPUImageLuminanceThresholdFilter, GPUImageGaussianBlurFilter, GPUImageUnsharpMaskFilterの3つ組み合わせて画像処理を行ないました。

GPUImageLuminanceThresholdFilter *thresholdFilter = [[GPUImageLuminanceThresholdFilter alloc] init];
[(GPUImageLuminanceThresholdFilter *)thresholdFilter setThreshold:_thresholdLevel];
    
GPUImageGaussianBlurFilter* blurfilter = [[GPUImageGaussianBlurFilter alloc] init];
[(GPUImageGaussianBlurFilter *)blurfilter setBlurRadiusInPixels:_blurLevel];
    
GPUImageUnsharpMaskFilter* unsharpMaskfilter = [[GPUImageUnsharpMaskFilter alloc] init];
[(GPUImageUnsharpMaskFilter *)unsharpMaskfilter setIntensity:_unsharpMaskLevel];
    
filterGroup = [[GPUImageFilterGroup alloc] init];
[(GPUImageFilterGroup *)filterGroup addFilter:thresholdFilter];
        
[thresholdFilter addTarget:blurfilter];
[blurfilter addTarget:unsharpMaskfilter];
        
[(GPUImageFilterGroup *)filterGroup setInitialFilters:@[thresholdFilter]];
[(GPUImageFilterGroup *)filterGroup setTerminalFilter:unsharpMaskfilter];
        
[sourcePicture addTarget:filterGroup];
[filterGroup addTarget:self.gpuImageView];

[sourcePicture processImage];
// ... イメージを取得

ペイント機能も苦労したので、それは次回記事にしたいと思います。

以上です。
気になった方は是非ダウンロードしてください!