Home > Core Image Filters

Core Image Filters

Core Image์˜ GPU ๊ฐ€์† ์ด๋ฏธ์ง€ ์ฒ˜๋ฆฌ ํŒŒ์ดํ”„๋ผ์ธ์„ ํ•™์Šตํ•ฉ๋‹ˆ๋‹ค. 200๊ฐœ ์ด์ƒ์˜ ๋‚ด์žฅ ํ•„ํ„ฐ, ํ•„ํ„ฐ ์ฒด์ด๋‹, ์‹ค์‹œ๊ฐ„ ์นด๋ฉ”๋ผ ํ•„ํ„ฐ ์ ์šฉ๊นŒ์ง€ ๋‹ค๋ฃน๋‹ˆ๋‹ค.

๊ฐœ์š”

Core Image๋Š” Apple์˜ GPU ๊ฐ€์† ์ด๋ฏธ์ง€ ์ฒ˜๋ฆฌ ํ”„๋ ˆ์ž„์›Œํฌ์ž…๋‹ˆ๋‹ค. ๋ธ”๋Ÿฌ, ์ƒ‰์ƒ ์กฐ์ •, ์™œ๊ณก, ํ•ฉ์„ฑ ๋“ฑ 200๊ฐœ ์ด์ƒ์˜ ๋‚ด์žฅ ํ•„ํ„ฐ(CIFilter)๋ฅผ ์ œ๊ณตํ•˜๋ฉฐ, ์ด๋“ค์„ ์ฒด์ธ์œผ๋กœ ์—ฐ๊ฒฐํ•˜์—ฌ ๋ณต์žกํ•œ ์ด๋ฏธ์ง€ ์ฒ˜๋ฆฌ ํŒŒ์ดํ”„๋ผ์ธ์„ ๊ตฌ์„ฑํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

Core Image๋Š” ์ง€์—ฐ ํ‰๊ฐ€(lazy evaluation) ๋ฐฉ์‹์œผ๋กœ ๋™์ž‘ํ•ฉ๋‹ˆ๋‹ค. ํ•„ํ„ฐ๋ฅผ ์—ฐ๊ฒฐํ•ด๋„ ์ฆ‰์‹œ ์ฒ˜๋ฆฌํ•˜์ง€ ์•Š๊ณ , ์ตœ์ข… ๋ Œ๋”๋ง ์‹œ GPU์—์„œ ํ•œ ๋ฒˆ์— ์‹คํ–‰ํ•˜์—ฌ ๋†’์€ ์„ฑ๋Šฅ์„ ๋‹ฌ์„ฑํ•ฉ๋‹ˆ๋‹ค.

์–ธ์ œ ์‚ฌ์šฉํ•˜๋‚˜์š”?

ํ•ต์‹ฌ API

CIFilter & CIImage

CIImage๋Š” ๋ถˆ๋ณ€(immutable) ์ด๋ฏธ์ง€ ๋ ˆ์‹œํ”ผ์ด๋ฉฐ, CIFilter๋กœ ๋ณ€ํ™˜ํ•ฉ๋‹ˆ๋‹ค. ํ•„ํ„ฐ ์ฒด์ด๋‹์€ ์ถœ๋ ฅ CIImage๋ฅผ ๋‹ค์Œ ํ•„ํ„ฐ์˜ ์ž…๋ ฅ์œผ๋กœ ์—ฐ๊ฒฐํ•˜๋ฉด ๋ฉ๋‹ˆ๋‹ค.

// ์›๋ณธ ์ด๋ฏธ์ง€ ๋กœ๋“œ
guard let inputImage = CIImage(image: uiImage) else { return }
// ๊ฐ€์šฐ์‹œ์•ˆ ๋ธ”๋Ÿฌ ์ ์šฉ
let blur = CIFilter.gaussianBlur()
blur.inputImage = inputImage
blur.radius = 10.0
// ์ƒ‰์กฐ ์กฐ์ • ์ฒด์ด๋‹
let hueAdjust = CIFilter.hueAdjust()
hueAdjust.inputImage = blur.outputImage
hueAdjust.angle = Float.pi / 4
// CIContext๋กœ ์ตœ์ข… ๋ Œ๋”๋ง
let context = CIContext()
if let output = hueAdjust.outputImage,
   let cgImage = context.createCGImage(output, from: output.extent) {
    let result = UIImage(cgImage: cgImage)
}

CIContext ๊ด€๋ฆฌ

CIContext๋Š” GPU ๋ฆฌ์†Œ์Šค๋ฅผ ๊ด€๋ฆฌํ•˜๋Š” ๋ฌด๊ฑฐ์šด ๊ฐ์ฒด์ž…๋‹ˆ๋‹ค. ์•ฑ ์ƒ๋ช…์ฃผ๊ธฐ ๋™์•ˆ ํ•˜๋‚˜๋งŒ ์ƒ์„ฑํ•˜์—ฌ ์žฌ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์ด ํ•ต์‹ฌ ์„ฑ๋Šฅ ์ „๋žต์ž…๋‹ˆ๋‹ค.

์นด๋ฉ”๋ผ ํŒŒ์ดํ”„๋ผ์ธ

AVCaptureSession์—์„œ ์‹ค์‹œ๊ฐ„ ํ”„๋ ˆ์ž„์„ ๋ฐ›์•„ Core Image ํ•„ํ„ฐ๋ฅผ ์ ์šฉํ•˜๋ฉด ๋ผ์ด๋ธŒ ์นด๋ฉ”๋ผ ํ•„ํ„ฐ๋ฅผ ๊ตฌํ˜„ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. AVCaptureVideoDataOutputSampleBufferDelegate์˜ ์ฝœ๋ฐฑ์—์„œ CMSampleBuffer -> CIImage ๋ณ€ํ™˜ ํ›„ ํ•„ํ„ฐ๋ฅผ ์ ์šฉํ•ฉ๋‹ˆ๋‹ค.

CIKernel

๋‚ด์žฅ ํ•„ํ„ฐ๋กœ ๋ถ€์กฑํ•  ๋•Œ, Metal Shading Language๋กœ ์ปค์Šคํ…€ CIKernel์„ ์ž‘์„ฑํ•˜์—ฌ ๋‚˜๋งŒ์˜ ํ•„ํ„ฐ๋ฅผ ๋งŒ๋“ค ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

๋ฐ๋ชจ ๋ชฉ๋ก

# ๋ฐ๋ชจ ์„ค๋ช…
1 Filter Gallery 15๊ฐœ Core Image ํ•„ํ„ฐ ์ธ๋„ค์ผ ๊ทธ๋ฆฌ๋“œ + ๊ฐ•๋„ ์Šฌ๋ผ์ด๋”. Sepia, Chrome, Noir, Bloom, Crystallize ๋“ฑ์„ ํ•œ๋ˆˆ์— ๋น„๊ต.
2 Camera Filters AVCaptureSession๊ณผ Core Image๋ฅผ ์—ฐ๋™ํ•œ ์‹ค์‹œ๊ฐ„ ์นด๋ฉ”๋ผ ํ•„ํ„ฐ. ์‹œ๋ฎฌ๋ ˆ์ดํ„ฐ์—์„œ๋Š” ์ ˆ์ฐจ์  ์ด๋ฏธ์ง€ ํด๋ฐฑ์„ ์‚ฌ์šฉํ•ฉ๋‹ˆ๋‹ค.
3 Filter Chain Builder ์ตœ๋Œ€ 5๊ฐœ ํ•„ํ„ฐ ์Šฌ๋กฏ์„ ์Šคํƒ์œผ๋กœ ์—ฐ๊ฒฐํ•˜์—ฌ ์ปค์Šคํ…€ ์ด๋ฏธ์ง€ ์ฒ˜๋ฆฌ ํŒŒ์ดํ”„๋ผ์ธ์„ ๊ตฌ์„ฑํ•ฉ๋‹ˆ๋‹ค.
4 Custom Effects ์—ฌ๋Ÿฌ ํ•„ํ„ฐ๋ฅผ ์กฐํ•ฉํ•œ ์ฐฝ์˜์  ์ดํŽ™ํŠธ(๊ธ€๋ฆฌ์น˜, ๋นˆํ‹ฐ์ง€, ํŒ์•„ํŠธ, ๋„ค์˜จ ๊ธ€๋กœ์šฐ). Before/After ๋น„๊ต ์Šฌ๋ผ์ด๋” ํฌํ•จ.

์‹ค์ „ ํŒ

Best Practices

์ฃผ์˜ ์‚ฌํ•ญ