SlideShare a Scribd company logo
1 of 38
Download to read offline
BLUR FILTER 
HANPO
HANPO 
SBACE - Director of Visual & Interface Design 
Freelancer - iOS UI/UX Designer ,iOS Developer ,Illustrator 
Portfolio 
http://hanpo.tw/ 
LinkedIn 
tw.linkedin.com/in/hanpo/ 
Instagram 
http://instagram.com/ihanpo
Why?
i.Frame Exhibition
Instagram Cam Path
Instagram
Path
Cam
What?
How?
Image Data
Pixel 
Image (2D array of pixels) 
RGB 115,41,41 RGB 98,49,49 RGB 212,168,32 
RGB 115,41,41 RGB 98,49,49 RGB 255,243,182 
RGB 115,41,41 RGB 98,49,49 RGB 255,251,236
Naïve Box Blur 
Box blur - 3*3 Matrix of 1/9 * determinant matrix 
1 1 1 
1 1 1 
1 1 1
Naïve Box Blur 
RGB 115,41,41 RGB 98,49,49 RGB 212,168,32 
RGB 115,41,41 RGB 98,49,49 RGB 255,243,182 
RGB 115,41,41 RGB 98,49,49 RGB 255,251,236 
RGB 151,104,80
Naïve Box Blur 
Image convolution - the convolution of a 2D image is O(m2*n2) 
For it to be fast you must implement it as an accumulator, not a convolution loop. 
for each row 
for each col 
set count to 0 
for every neighboring pixel within the radius m in the x direction 
for every neighboring pixel within the radius m in the y direction 
add the color to the total 
count++ 
final_color = total/count 
setpixel(current x, current y, final_color)
Calculate all Pixels 
Sample image 4 x 3 pixels, radius is 1
Box Blur R:0 R:1 R:3 
R:6 R:10 R:20
Edge Handling
Better Box Blur 
Image convolution - the convolution of a 2D image is O(n^2 * 2m) 
For it to be fast you must implement it as an accumulator, not a convolution loop. 
for each row 
for every neighboring pixel within the radius m in the x direction 
add the color to the total 
count++ 
final_color = total/count 
setpixel(current x, current y, final_color) 
! 
repeat above for the columns
Calculate all Pixels 
Sample image 6 x 6 pixels, radius is 2 
in the x direction 
in the y direction 
if x <= r 
for var _i=i-x; _i<=i+r; _i++ 
if x > r && x < (w-r) 
for var _i=i-r; _i<=i+r; _i++ 
if x >= (w-r) 
for var _i=i-r; _i<=i+(w-x); _i++ 
if _y <= r 
for var _i=0; _i<=_y+r; _i++ 
let currentIndex = _i*w+_x 
if r < _y && _y < (h-r) 
for var _i=_y-r; _i<=_y+r; _i++ 
let currentIndex = _i*w+_x 
if _y >= (h-r) 
for var _i=_y-r; _i<=(h-1); _i++ 
let currentIndex = _i*w+_x
R:0 R:1 R:3 
R:6 R:10 R:20 
Better Box Blur
Compare 
Box Blur & Better Box Blur 
Size: 512 x 512 Device: iPad mini 2 
Box Blur Better Box Blur 
Radius:1 112.4061s 7.1371s 
Radius:2 300.8143s 7.1586s 
Radius:3 586.2660s 7.2406s 
Radius:6 1958.8380s 7.3746s 
Radius:10 5017.5250s 7.6009s 
Radius:20 8.1089s
Convolution 
for each image row in output image: 
for each pixel in image row: 
! 
set accumulator to zero 
! 
for each kernel row in kernel: 
for each element in kernel row: 
! 
if element position corresponding* to pixel position then 
multiply element value corresponding* to pixel value 
add result to accumulator 
endif 
! 
set output image pixel to accumulator
Accelerate Framework 
Consists of two frameworks: vImage and vecLib 
Available in OS X v10.4 
Use vector co-processor (CPU-based) 
Designed to run various mathematical operations with data 
Well optimized and uses SIMD
vImage 
Accelerate Framework 
func vImageBoxConvolve_ARGB8888(_ src: UnsafePointer<vImage_Buffer>, 
_ dest: UnsafePointer<vImage_Buffer>, 
_ tempBuffer: UnsafeMutablePointer<Void>, 
_ srcOffsetToROI_X: vImagePixelCount, 
_ srcOffsetToROI_Y: vImagePixelCount, 
_ kernel_height: UInt32, 
_ kernel_width: UInt32, 
_ backgroundColor: UnsafeMutablePointer<UInt8>, 
_ flags: vImage_Flags) -> vImage_Error
vImage Blur R:0 R:1 R:3 
R:6 R:10 R:20
Compare 
Box Blur Better Box Blur vImage 
Radius:1 112.4061s 7.1371s first: 0.0292s 
second: 0.0065s 
Radius:2 300.8143s 7.1586s first:0.0260 
second:0.0063 
Radius:3 586.2660s 7.2406s first: 0.0410s 
second: 0.0066s 
Radius:6 1958.8380s 7.3746s first: 0.0272s 
second: 0.0071s 
Radius:10 5017.5250s 7.6009s first: 0.0294s 
second: 0.0063s 
Radius:20 8.1089s first: 0.0281s 
second: 0.0073s 
Box Blur & Better Box Blur & vImage 
Size: 512 x 512 Device: iPad mini 2
Gaussian Blur 
r=3 ,σ = 0.84089642 
0.00000067 0.00002292 0.00019117 0.00038771 0.00019117 0.00002292 0.00000067 
0.00002292 0.00078633 0.00655965 0.01330373 0.00655965 0.00078633 0.00002292 
0.00019117 0.00655965 0.05472157 0.11098164 0.05472157 0.00655965 0.00019117 
0.00038771 0.01330373 0.11098164 0.22508352 0.11098164 0.01330373 0.00038771 
0.00019117 0.00655965 0.05472157 0.11098164 0.05472157 0.00655965 0.00019117 
0.00002292 0.00078633 0.00655965 0.01330373 0.00655965 0.00078633 0.00002292 
0.00000067 0.00002292 0.00019117 0.00038771 0.00019117 0.00002292 0.00000067
Gaussian Distribution 
in one dimension in two dimensions
Gaussian function 
in one dimension 
in two dimensions
Core Image - Gaussian Blur 
var context: CIContext! 
let inputImage = CIImage(image: img) 
let gaussianBlurFilter = CIFilter(name:"CIGaussianBlur", withInputParameters: 
[kCIInputImageKey:inputImage,kCIInputRadiusKey:blurLevel]) 
let outputCIImage = gaussianBlurFilter.outputImage.imageByCroppingToRect(inputImage.extent()) 
context = CIContext(options:nil) 
let cgimg = context.createCGImage(outputCIImage, fromRect: outputCIImage.extent()) 
let outputImage = UIImage(CGImage: cgimg)
Core Image - Gaussian Blur 
Size: 512 x 512 Device: iPad mini 2 
Gaussian Blur Speed 
Level:1 0.1143s 
Level:10 0.1192s 
Level:100 0.1288s 
Level:500 0.2334s 
Level:680 0.1078s 
Level:1000 0.1082s
Compare 
Box Blur & Gaussian Blur 
Box Blur Gaussian Blur
Compare 
Box Blur & Gaussian Blur 
Box Blur Gaussian Blur
Reference 
http://en.wikipedia.org/wiki/Box_blur 
http://en.wikipedia.org/wiki/Gaussian_blur 
ACM SIGGRAPH@UIUC Fast Image Convolutions by: Wojciech Jarosz 
http://blog.amritamaz.me/post/42203030076/understanding-box-blur 
http://tech-algorithm.com/articles/boxfiltering/

More Related Content

What's hot

A non-stiff boundary integral method for internal waves
A non-stiff boundary integral method for internal wavesA non-stiff boundary integral method for internal waves
A non-stiff boundary integral method for internal waves
Alex (Oleksiy) Varfolomiyev
 
11.optimal nonlocal means algorithm for denoising ultrasound image
11.optimal nonlocal means algorithm for denoising ultrasound image11.optimal nonlocal means algorithm for denoising ultrasound image
11.optimal nonlocal means algorithm for denoising ultrasound image
Alexander Decker
 

What's hot (20)

Circular Convolution
Circular ConvolutionCircular Convolution
Circular Convolution
 
1422798749.2779lecture 5
1422798749.2779lecture 51422798749.2779lecture 5
1422798749.2779lecture 5
 
Deep learning
Deep learningDeep learning
Deep learning
 
Designing Parametric cubic Curves
Designing Parametric cubic CurvesDesigning Parametric cubic Curves
Designing Parametric cubic Curves
 
Sharbani bhattacharya sacta 2014
Sharbani bhattacharya sacta 2014Sharbani bhattacharya sacta 2014
Sharbani bhattacharya sacta 2014
 
SIGGRAPHASIA2012_Talk
SIGGRAPHASIA2012_TalkSIGGRAPHASIA2012_Talk
SIGGRAPHASIA2012_Talk
 
Trident International Graphics Workshop 2014 4/5
Trident International Graphics Workshop 2014 4/5Trident International Graphics Workshop 2014 4/5
Trident International Graphics Workshop 2014 4/5
 
Lab lecture 2 bresenham
Lab lecture 2 bresenhamLab lecture 2 bresenham
Lab lecture 2 bresenham
 
A non-stiff boundary integral method for internal waves
A non-stiff boundary integral method for internal wavesA non-stiff boundary integral method for internal waves
A non-stiff boundary integral method for internal waves
 
Applied mathematics for CBE assignment
Applied mathematics for CBE assignmentApplied mathematics for CBE assignment
Applied mathematics for CBE assignment
 
11.optimal nonlocal means algorithm for denoising ultrasound image
11.optimal nonlocal means algorithm for denoising ultrasound image11.optimal nonlocal means algorithm for denoising ultrasound image
11.optimal nonlocal means algorithm for denoising ultrasound image
 
Optimal nonlocal means algorithm for denoising ultrasound image
Optimal nonlocal means algorithm for denoising ultrasound imageOptimal nonlocal means algorithm for denoising ultrasound image
Optimal nonlocal means algorithm for denoising ultrasound image
 
Bresenham's line algorithm
Bresenham's line algorithmBresenham's line algorithm
Bresenham's line algorithm
 
Mid point
Mid pointMid point
Mid point
 
Tutor 41 Big Numbers
Tutor 41 Big NumbersTutor 41 Big Numbers
Tutor 41 Big Numbers
 
Digit recognizer by convolutional neural network
Digit recognizer by convolutional neural networkDigit recognizer by convolutional neural network
Digit recognizer by convolutional neural network
 
Pixelrelationships
PixelrelationshipsPixelrelationships
Pixelrelationships
 
Lecture 4: Stochastic Hydrology (Site Characterization)
Lecture 4: Stochastic Hydrology (Site Characterization)Lecture 4: Stochastic Hydrology (Site Characterization)
Lecture 4: Stochastic Hydrology (Site Characterization)
 
ISCAS2013_v5
ISCAS2013_v5ISCAS2013_v5
ISCAS2013_v5
 
Integrales
Integrales Integrales
Integrales
 

Viewers also liked

Image processing3 imageenhancement(histogramprocessing)
Image processing3 imageenhancement(histogramprocessing)Image processing3 imageenhancement(histogramprocessing)
Image processing3 imageenhancement(histogramprocessing)
John Williams
 
Image enhancement techniques
Image enhancement techniquesImage enhancement techniques
Image enhancement techniques
Saideep
 
Digital image processing img smoothning
Digital image processing img smoothningDigital image processing img smoothning
Digital image processing img smoothning
Vinay Gupta
 

Viewers also liked (16)

Image processing3 imageenhancement(histogramprocessing)
Image processing3 imageenhancement(histogramprocessing)Image processing3 imageenhancement(histogramprocessing)
Image processing3 imageenhancement(histogramprocessing)
 
Introduction to parallel computing using CUDA
Introduction to parallel computing using CUDAIntroduction to parallel computing using CUDA
Introduction to parallel computing using CUDA
 
Image Smoothing using Frequency Domain Filters
Image Smoothing using Frequency Domain FiltersImage Smoothing using Frequency Domain Filters
Image Smoothing using Frequency Domain Filters
 
GPU: Understanding CUDA
GPU: Understanding CUDAGPU: Understanding CUDA
GPU: Understanding CUDA
 
Introduction to CUDA
Introduction to CUDAIntroduction to CUDA
Introduction to CUDA
 
Edge Detection algorithm and code
Edge Detection algorithm and codeEdge Detection algorithm and code
Edge Detection algorithm and code
 
Edge detection
Edge detectionEdge detection
Edge detection
 
Image enhancement techniques
Image enhancement techniquesImage enhancement techniques
Image enhancement techniques
 
Cuda
CudaCuda
Cuda
 
CUDA
CUDACUDA
CUDA
 
Histogram equalization
Histogram equalizationHistogram equalization
Histogram equalization
 
Spatial filtering
Spatial filteringSpatial filtering
Spatial filtering
 
Digital image processing img smoothning
Digital image processing img smoothningDigital image processing img smoothning
Digital image processing img smoothning
 
How to Become a Thought Leader in Your Niche
How to Become a Thought Leader in Your NicheHow to Become a Thought Leader in Your Niche
How to Become a Thought Leader in Your Niche
 
How to Make Awesome SlideShares: Tips & Tricks
How to Make Awesome SlideShares: Tips & TricksHow to Make Awesome SlideShares: Tips & Tricks
How to Make Awesome SlideShares: Tips & Tricks
 
Getting Started With SlideShare
Getting Started With SlideShareGetting Started With SlideShare
Getting Started With SlideShare
 

Similar to Blur Filter - Hanpo

A Bizarre Way to do Real-Time Lighting
A Bizarre Way to do Real-Time LightingA Bizarre Way to do Real-Time Lighting
A Bizarre Way to do Real-Time Lighting
Steven Tovey
 
Visual cryptography1
Visual cryptography1Visual cryptography1
Visual cryptography1
patisa
 
Image Processing using Matlab . Useful for beginners to learn Image Processing
Image Processing using Matlab . Useful for beginners to learn Image ProcessingImage Processing using Matlab . Useful for beginners to learn Image Processing
Image Processing using Matlab . Useful for beginners to learn Image Processing
Ashok Kumar
 
JonathanWestlake_ComputerVision_Project1
JonathanWestlake_ComputerVision_Project1JonathanWestlake_ComputerVision_Project1
JonathanWestlake_ComputerVision_Project1
Jonathan Westlake
 
Image encryption using aes key expansion
Image encryption using aes key expansionImage encryption using aes key expansion
Image encryption using aes key expansion
Sreeda Perikamana
 
CUDA by Example : Constant Memory and Events : Notes
CUDA by Example : Constant Memory and Events : NotesCUDA by Example : Constant Memory and Events : Notes
CUDA by Example : Constant Memory and Events : Notes
Subhajit Sahu
 
When Discrete Optimization Meets Multimedia Security (and Beyond)
When Discrete Optimization Meets Multimedia Security (and Beyond)When Discrete Optimization Meets Multimedia Security (and Beyond)
When Discrete Optimization Meets Multimedia Security (and Beyond)
Shujun Li
 
project_final_seminar
project_final_seminarproject_final_seminar
project_final_seminar
MUKUL BICHKAR
 

Similar to Blur Filter - Hanpo (20)

Triangle Visibility buffer
Triangle Visibility bufferTriangle Visibility buffer
Triangle Visibility buffer
 
A Bizarre Way to do Real-Time Lighting
A Bizarre Way to do Real-Time LightingA Bizarre Way to do Real-Time Lighting
A Bizarre Way to do Real-Time Lighting
 
Improved Alpha-Tested Magnification for Vector Textures and Special Effects
Improved Alpha-Tested Magnification for Vector Textures and Special EffectsImproved Alpha-Tested Magnification for Vector Textures and Special Effects
Improved Alpha-Tested Magnification for Vector Textures and Special Effects
 
Kinect v1+Processing workshot fabcafe_taipei
Kinect v1+Processing workshot fabcafe_taipeiKinect v1+Processing workshot fabcafe_taipei
Kinect v1+Processing workshot fabcafe_taipei
 
jpg image processing nagham salim_as.ppt
jpg image processing nagham salim_as.pptjpg image processing nagham salim_as.ppt
jpg image processing nagham salim_as.ppt
 
Visual cryptography1
Visual cryptography1Visual cryptography1
Visual cryptography1
 
Visual cryptography1
Visual cryptography1Visual cryptography1
Visual cryptography1
 
Lossless Huffman coding image compression implementation in spatial domain by...
Lossless Huffman coding image compression implementation in spatial domain by...Lossless Huffman coding image compression implementation in spatial domain by...
Lossless Huffman coding image compression implementation in spatial domain by...
 
Image Processing using Matlab . Useful for beginners to learn Image Processing
Image Processing using Matlab . Useful for beginners to learn Image ProcessingImage Processing using Matlab . Useful for beginners to learn Image Processing
Image Processing using Matlab . Useful for beginners to learn Image Processing
 
Image compression 14_04_2020 (1)
Image compression 14_04_2020 (1)Image compression 14_04_2020 (1)
Image compression 14_04_2020 (1)
 
JonathanWestlake_ComputerVision_Project1
JonathanWestlake_ComputerVision_Project1JonathanWestlake_ComputerVision_Project1
JonathanWestlake_ComputerVision_Project1
 
Image encryption using aes key expansion
Image encryption using aes key expansionImage encryption using aes key expansion
Image encryption using aes key expansion
 
CUDA by Example : Constant Memory and Events : Notes
CUDA by Example : Constant Memory and Events : NotesCUDA by Example : Constant Memory and Events : Notes
CUDA by Example : Constant Memory and Events : Notes
 
A New Algorithm for Digital Colour Image Encryption and Decryption
A New Algorithm for Digital Colour Image Encryption and DecryptionA New Algorithm for Digital Colour Image Encryption and Decryption
A New Algorithm for Digital Colour Image Encryption and Decryption
 
When Discrete Optimization Meets Multimedia Security (and Beyond)
When Discrete Optimization Meets Multimedia Security (and Beyond)When Discrete Optimization Meets Multimedia Security (and Beyond)
When Discrete Optimization Meets Multimedia Security (and Beyond)
 
project_final_seminar
project_final_seminarproject_final_seminar
project_final_seminar
 
Image processing using matlab
Image processing using matlab Image processing using matlab
Image processing using matlab
 
A Video Watermarking Scheme to Hinder Camcorder Piracy
A Video Watermarking Scheme to Hinder Camcorder PiracyA Video Watermarking Scheme to Hinder Camcorder Piracy
A Video Watermarking Scheme to Hinder Camcorder Piracy
 
The Comparative Study on Visual Cryptography and Random Grid Cryptography
The Comparative Study on Visual Cryptography and Random Grid CryptographyThe Comparative Study on Visual Cryptography and Random Grid Cryptography
The Comparative Study on Visual Cryptography and Random Grid Cryptography
 
Build Your Own 3D Scanner: 3D Scanning with Swept-Planes
Build Your Own 3D Scanner: 3D Scanning with Swept-PlanesBuild Your Own 3D Scanner: 3D Scanning with Swept-Planes
Build Your Own 3D Scanner: 3D Scanning with Swept-Planes
 

Recently uploaded

Call Girls in South Ex (delhi) call me [🔝9953056974🔝] escort service 24X7
Call Girls in South Ex (delhi) call me [🔝9953056974🔝] escort service 24X7Call Girls in South Ex (delhi) call me [🔝9953056974🔝] escort service 24X7
Call Girls in South Ex (delhi) call me [🔝9953056974🔝] escort service 24X7
9953056974 Low Rate Call Girls In Saket, Delhi NCR
 
notes on Evolution Of Analytic Scalability.ppt
notes on Evolution Of Analytic Scalability.pptnotes on Evolution Of Analytic Scalability.ppt
notes on Evolution Of Analytic Scalability.ppt
MsecMca
 
Kuwait City MTP kit ((+919101817206)) Buy Abortion Pills Kuwait
Kuwait City MTP kit ((+919101817206)) Buy Abortion Pills KuwaitKuwait City MTP kit ((+919101817206)) Buy Abortion Pills Kuwait
Kuwait City MTP kit ((+919101817206)) Buy Abortion Pills Kuwait
jaanualu31
 
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
ssuser89054b
 
DeepFakes presentation : brief idea of DeepFakes
DeepFakes presentation : brief idea of DeepFakesDeepFakes presentation : brief idea of DeepFakes
DeepFakes presentation : brief idea of DeepFakes
MayuraD1
 
Cara Menggugurkan Sperma Yang Masuk Rahim Biyar Tidak Hamil
Cara Menggugurkan Sperma Yang Masuk Rahim Biyar Tidak HamilCara Menggugurkan Sperma Yang Masuk Rahim Biyar Tidak Hamil
Cara Menggugurkan Sperma Yang Masuk Rahim Biyar Tidak Hamil
Cara Menggugurkan Kandungan 087776558899
 

Recently uploaded (20)

COST-EFFETIVE and Energy Efficient BUILDINGS ptx
COST-EFFETIVE  and Energy Efficient BUILDINGS ptxCOST-EFFETIVE  and Energy Efficient BUILDINGS ptx
COST-EFFETIVE and Energy Efficient BUILDINGS ptx
 
2016EF22_0 solar project report rooftop projects
2016EF22_0 solar project report rooftop projects2016EF22_0 solar project report rooftop projects
2016EF22_0 solar project report rooftop projects
 
Call Girls in South Ex (delhi) call me [🔝9953056974🔝] escort service 24X7
Call Girls in South Ex (delhi) call me [🔝9953056974🔝] escort service 24X7Call Girls in South Ex (delhi) call me [🔝9953056974🔝] escort service 24X7
Call Girls in South Ex (delhi) call me [🔝9953056974🔝] escort service 24X7
 
Unleashing the Power of the SORA AI lastest leap
Unleashing the Power of the SORA AI lastest leapUnleashing the Power of the SORA AI lastest leap
Unleashing the Power of the SORA AI lastest leap
 
A Study of Urban Area Plan for Pabna Municipality
A Study of Urban Area Plan for Pabna MunicipalityA Study of Urban Area Plan for Pabna Municipality
A Study of Urban Area Plan for Pabna Municipality
 
notes on Evolution Of Analytic Scalability.ppt
notes on Evolution Of Analytic Scalability.pptnotes on Evolution Of Analytic Scalability.ppt
notes on Evolution Of Analytic Scalability.ppt
 
School management system project Report.pdf
School management system project Report.pdfSchool management system project Report.pdf
School management system project Report.pdf
 
Learn the concepts of Thermodynamics on Magic Marks
Learn the concepts of Thermodynamics on Magic MarksLearn the concepts of Thermodynamics on Magic Marks
Learn the concepts of Thermodynamics on Magic Marks
 
Work-Permit-Receiver-in-Saudi-Aramco.pptx
Work-Permit-Receiver-in-Saudi-Aramco.pptxWork-Permit-Receiver-in-Saudi-Aramco.pptx
Work-Permit-Receiver-in-Saudi-Aramco.pptx
 
data_management_and _data_science_cheat_sheet.pdf
data_management_and _data_science_cheat_sheet.pdfdata_management_and _data_science_cheat_sheet.pdf
data_management_and _data_science_cheat_sheet.pdf
 
HOA1&2 - Module 3 - PREHISTORCI ARCHITECTURE OF KERALA.pptx
HOA1&2 - Module 3 - PREHISTORCI ARCHITECTURE OF KERALA.pptxHOA1&2 - Module 3 - PREHISTORCI ARCHITECTURE OF KERALA.pptx
HOA1&2 - Module 3 - PREHISTORCI ARCHITECTURE OF KERALA.pptx
 
Kuwait City MTP kit ((+919101817206)) Buy Abortion Pills Kuwait
Kuwait City MTP kit ((+919101817206)) Buy Abortion Pills KuwaitKuwait City MTP kit ((+919101817206)) Buy Abortion Pills Kuwait
Kuwait City MTP kit ((+919101817206)) Buy Abortion Pills Kuwait
 
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
 
Bhubaneswar🌹Call Girls Bhubaneswar ❤Komal 9777949614 💟 Full Trusted CALL GIRL...
Bhubaneswar🌹Call Girls Bhubaneswar ❤Komal 9777949614 💟 Full Trusted CALL GIRL...Bhubaneswar🌹Call Girls Bhubaneswar ❤Komal 9777949614 💟 Full Trusted CALL GIRL...
Bhubaneswar🌹Call Girls Bhubaneswar ❤Komal 9777949614 💟 Full Trusted CALL GIRL...
 
AIRCANVAS[1].pdf mini project for btech students
AIRCANVAS[1].pdf mini project for btech studentsAIRCANVAS[1].pdf mini project for btech students
AIRCANVAS[1].pdf mini project for btech students
 
Engineering Drawing focus on projection of planes
Engineering Drawing focus on projection of planesEngineering Drawing focus on projection of planes
Engineering Drawing focus on projection of planes
 
Computer Networks Basics of Network Devices
Computer Networks  Basics of Network DevicesComputer Networks  Basics of Network Devices
Computer Networks Basics of Network Devices
 
Thermal Engineering-R & A / C - unit - V
Thermal Engineering-R & A / C - unit - VThermal Engineering-R & A / C - unit - V
Thermal Engineering-R & A / C - unit - V
 
DeepFakes presentation : brief idea of DeepFakes
DeepFakes presentation : brief idea of DeepFakesDeepFakes presentation : brief idea of DeepFakes
DeepFakes presentation : brief idea of DeepFakes
 
Cara Menggugurkan Sperma Yang Masuk Rahim Biyar Tidak Hamil
Cara Menggugurkan Sperma Yang Masuk Rahim Biyar Tidak HamilCara Menggugurkan Sperma Yang Masuk Rahim Biyar Tidak Hamil
Cara Menggugurkan Sperma Yang Masuk Rahim Biyar Tidak Hamil
 

Blur Filter - Hanpo

  • 2. HANPO SBACE - Director of Visual & Interface Design Freelancer - iOS UI/UX Designer ,iOS Developer ,Illustrator Portfolio http://hanpo.tw/ LinkedIn tw.linkedin.com/in/hanpo/ Instagram http://instagram.com/ihanpo
  • 4.
  • 9. Cam
  • 10. What?
  • 11.
  • 12. How?
  • 14. Pixel Image (2D array of pixels) RGB 115,41,41 RGB 98,49,49 RGB 212,168,32 RGB 115,41,41 RGB 98,49,49 RGB 255,243,182 RGB 115,41,41 RGB 98,49,49 RGB 255,251,236
  • 15. Naïve Box Blur Box blur - 3*3 Matrix of 1/9 * determinant matrix 1 1 1 1 1 1 1 1 1
  • 16. Naïve Box Blur RGB 115,41,41 RGB 98,49,49 RGB 212,168,32 RGB 115,41,41 RGB 98,49,49 RGB 255,243,182 RGB 115,41,41 RGB 98,49,49 RGB 255,251,236 RGB 151,104,80
  • 17. Naïve Box Blur Image convolution - the convolution of a 2D image is O(m2*n2) For it to be fast you must implement it as an accumulator, not a convolution loop. for each row for each col set count to 0 for every neighboring pixel within the radius m in the x direction for every neighboring pixel within the radius m in the y direction add the color to the total count++ final_color = total/count setpixel(current x, current y, final_color)
  • 18. Calculate all Pixels Sample image 4 x 3 pixels, radius is 1
  • 19. Box Blur R:0 R:1 R:3 R:6 R:10 R:20
  • 21. Better Box Blur Image convolution - the convolution of a 2D image is O(n^2 * 2m) For it to be fast you must implement it as an accumulator, not a convolution loop. for each row for every neighboring pixel within the radius m in the x direction add the color to the total count++ final_color = total/count setpixel(current x, current y, final_color) ! repeat above for the columns
  • 22. Calculate all Pixels Sample image 6 x 6 pixels, radius is 2 in the x direction in the y direction if x <= r for var _i=i-x; _i<=i+r; _i++ if x > r && x < (w-r) for var _i=i-r; _i<=i+r; _i++ if x >= (w-r) for var _i=i-r; _i<=i+(w-x); _i++ if _y <= r for var _i=0; _i<=_y+r; _i++ let currentIndex = _i*w+_x if r < _y && _y < (h-r) for var _i=_y-r; _i<=_y+r; _i++ let currentIndex = _i*w+_x if _y >= (h-r) for var _i=_y-r; _i<=(h-1); _i++ let currentIndex = _i*w+_x
  • 23. R:0 R:1 R:3 R:6 R:10 R:20 Better Box Blur
  • 24. Compare Box Blur & Better Box Blur Size: 512 x 512 Device: iPad mini 2 Box Blur Better Box Blur Radius:1 112.4061s 7.1371s Radius:2 300.8143s 7.1586s Radius:3 586.2660s 7.2406s Radius:6 1958.8380s 7.3746s Radius:10 5017.5250s 7.6009s Radius:20 8.1089s
  • 25. Convolution for each image row in output image: for each pixel in image row: ! set accumulator to zero ! for each kernel row in kernel: for each element in kernel row: ! if element position corresponding* to pixel position then multiply element value corresponding* to pixel value add result to accumulator endif ! set output image pixel to accumulator
  • 26. Accelerate Framework Consists of two frameworks: vImage and vecLib Available in OS X v10.4 Use vector co-processor (CPU-based) Designed to run various mathematical operations with data Well optimized and uses SIMD
  • 27. vImage Accelerate Framework func vImageBoxConvolve_ARGB8888(_ src: UnsafePointer<vImage_Buffer>, _ dest: UnsafePointer<vImage_Buffer>, _ tempBuffer: UnsafeMutablePointer<Void>, _ srcOffsetToROI_X: vImagePixelCount, _ srcOffsetToROI_Y: vImagePixelCount, _ kernel_height: UInt32, _ kernel_width: UInt32, _ backgroundColor: UnsafeMutablePointer<UInt8>, _ flags: vImage_Flags) -> vImage_Error
  • 28. vImage Blur R:0 R:1 R:3 R:6 R:10 R:20
  • 29. Compare Box Blur Better Box Blur vImage Radius:1 112.4061s 7.1371s first: 0.0292s second: 0.0065s Radius:2 300.8143s 7.1586s first:0.0260 second:0.0063 Radius:3 586.2660s 7.2406s first: 0.0410s second: 0.0066s Radius:6 1958.8380s 7.3746s first: 0.0272s second: 0.0071s Radius:10 5017.5250s 7.6009s first: 0.0294s second: 0.0063s Radius:20 8.1089s first: 0.0281s second: 0.0073s Box Blur & Better Box Blur & vImage Size: 512 x 512 Device: iPad mini 2
  • 30. Gaussian Blur r=3 ,σ = 0.84089642 0.00000067 0.00002292 0.00019117 0.00038771 0.00019117 0.00002292 0.00000067 0.00002292 0.00078633 0.00655965 0.01330373 0.00655965 0.00078633 0.00002292 0.00019117 0.00655965 0.05472157 0.11098164 0.05472157 0.00655965 0.00019117 0.00038771 0.01330373 0.11098164 0.22508352 0.11098164 0.01330373 0.00038771 0.00019117 0.00655965 0.05472157 0.11098164 0.05472157 0.00655965 0.00019117 0.00002292 0.00078633 0.00655965 0.01330373 0.00655965 0.00078633 0.00002292 0.00000067 0.00002292 0.00019117 0.00038771 0.00019117 0.00002292 0.00000067
  • 31. Gaussian Distribution in one dimension in two dimensions
  • 32. Gaussian function in one dimension in two dimensions
  • 33.
  • 34. Core Image - Gaussian Blur var context: CIContext! let inputImage = CIImage(image: img) let gaussianBlurFilter = CIFilter(name:"CIGaussianBlur", withInputParameters: [kCIInputImageKey:inputImage,kCIInputRadiusKey:blurLevel]) let outputCIImage = gaussianBlurFilter.outputImage.imageByCroppingToRect(inputImage.extent()) context = CIContext(options:nil) let cgimg = context.createCGImage(outputCIImage, fromRect: outputCIImage.extent()) let outputImage = UIImage(CGImage: cgimg)
  • 35. Core Image - Gaussian Blur Size: 512 x 512 Device: iPad mini 2 Gaussian Blur Speed Level:1 0.1143s Level:10 0.1192s Level:100 0.1288s Level:500 0.2334s Level:680 0.1078s Level:1000 0.1082s
  • 36. Compare Box Blur & Gaussian Blur Box Blur Gaussian Blur
  • 37. Compare Box Blur & Gaussian Blur Box Blur Gaussian Blur
  • 38. Reference http://en.wikipedia.org/wiki/Box_blur http://en.wikipedia.org/wiki/Gaussian_blur ACM SIGGRAPH@UIUC Fast Image Convolutions by: Wojciech Jarosz http://blog.amritamaz.me/post/42203030076/understanding-box-blur http://tech-algorithm.com/articles/boxfiltering/