如何製作攝影類 app 中的濾鏡？

12-05

是統一加一層調製好的調色調光的模板，還是說根據不同照片先進行自動曝光等再加？製作麻煩么？是否有開源的濾鏡？

因為很重要，所以更新在前面：
沒想到很多朋友都很關心最後提的美顏演算法，我也不斷收到詢問相關細節的私信。之前由於各種原因不太方便透露所以沒有回復各位。
最近當時合作的工程師決定開!源!整!套!算!法! 歡迎大家去送個 Star。

Github 鏈接：YuAo/YUCIHighPassSkinSmoothing: An implementation of High Pass Skin Smoothing using Apple#x27;s Core Image Framework

----------------
以下為原答案：
----------------

前面的幾個回答都在講技術層面的東西，我來從濾鏡設計的角度來聊聊！(???ω???)

題主「加一層調製好的調色調光的模板」的猜測是正確的。之前曾做過一個圖片處理 App 的設計，當時所在的團隊採用的實現方法也是開源的，具體實現流程與使用CIColorCube快速製作濾 一文中描述的方法思路相同，另外我們當時還能實現類似 Photoshop 中的圖層混合模式（疊加、正片疊底、柔光、強光等），但這部分我沒找到相關的文章鏈接，歡迎大家幫我補充。

我們使用的這種濾鏡製作流程可以理解為製作了一個映射，也就是說，設計師用 Photoshop 調出來的色彩效果輸出在了下面這種「格子圖」上，在 App 里通過解析「格子圖」得到了色彩的變化規則，然後把這個規則應用在了照片上。注意，這裡只能進行顏色上的調整（曲線，色彩平衡等），其他效果調整也只限於利用圖層間混合模式的更改，例如可做暗角、漏光等效果。

濾鏡的製作和攝影后期處理很像，都是調各種參數，但調濾鏡並不需要針對某一張照片做太深入的處理，所以不會很繁瑣。我甚至認為調整的參數類型越少越好，過於複雜的調整、過多的調整圖層反而會讓自己手忙腳亂，有時還會導致最終處理的圖片看起來畫質很差。

我最常用的調整工具就是「曲線」，偶爾還會用到「飽和度」、「色彩平衡」、「可選顏色」，這幾個工具配合起來可以在顏色調整上很快得到期望的效果。例如下面這個仿的「VscoCam」里某個濾鏡，用一個 rgb 曲線就可以搞定。

調好一個色調可以測試幾張其他照片，放到手機上看看效果（如果可以，讓工程師做個簡單的 demo 給設計師在手機上測試更是極好的），如果對效果拿捏不定，可以矯正下自己的眼睛，過幾分鐘再繼續調整，切忌不停的調整一個文件。另外，「色彩平衡」、「可選顏色」等這類工具處理稍微複雜的色調有些麻煩（就是會發生那種拿捏不定的情況），所以也嘗試過用兩個純色圖層，改變混合模式、透明度的方式來控制亮部和暗部（如下圖）。另外這樣做可以防止產生不自然的顏色過渡，尤其是顏色飽和度高的照片，處理後依然會顯得很自然。

「曲線」工具的創作空間其實非常廣，加上其他工具的配合，有時候很快就能做出還不錯的效果，就製作 App 濾鏡來說，完全足夠設計師來發揮了。

關於過程上，我個人還有一些小心得，供入門級選手參考（都是踩過的坑啊 &>﹏&< ）：

1.要同時使用多張有一定差異的照片預覽效果
照片最好是幾種不同的光線環境下所拍攝，比如室內燈光、日光、夜景等等，手機相冊里隨便挑幾張都可以，也不用太極端。照片中的內容整體色調上也要略有區別，例如暖色的落日下、植物、街角......一定要有幾張是帶人臉的（如果 App 想針對國際市場並且注重人像處理，可以找一些其他膚色的人像照片）。

為什麼呢要這樣做？請看下圖：

兩張照片使用了一樣的效果調整（rgb曲線、選取顏色），處理後的左圖看起來沒什麼問題，但右圖絕對不是多數人喜歡的色調。
因為我只顧左圖好看，過分調整了黃與紅的顏色傾向，但黃與紅會直接影響皮膚的色調，所以導致了這樣的結果（摔）。

濾鏡也許不能把所有普通照片都變成驚為天人的藝術品，但如果用戶覺得自己的照片被變得更丑了，對於產品來說，那將是多麼糟糕的體驗！

2.給自己一個明確的規劃
濾鏡的設計製作是非常自由的，畢竟在 Photoshop 里調整圖片的各種效果實在太容易了，在曲線上隨便拉幾個點都能讓照片變得不一樣，但恰恰因為如此，很容易出現「隨便試試看」的情況，例如：把這個值調高點看看、把那個值降低試試... 一個下午過去了也沒做好一個濾鏡；或者忙活了一整天，發現自己做的幾個濾鏡效果看起來幾乎一樣，這會極大程度地降低我們的效率...... 沒錯，這個人就是我(???ω???)
建議可以試著從濾鏡數量和風格分布這兩個角度開始。以自己的經驗為例，我用一個上午看了很多同類產品（截了很多圖用來參考），最終決定產品初期先讓濾鏡保持在20個左右，大致分為「電影膠片」、「群眾喜聞樂見」、「黑白系列」三個方向，然後在過程中又在文件名里補充了很多描述文字以防效果太接近，直到最終完成。

哦，對了，濾鏡設計者的個人品味也非常重要。

p.s.最後給自己的親生產品打個廣告（已離職就不算軟文了吧），App Store 鏈接：MeShot
p.p.s. 這 App 的美顏演算法也是我設計噠 ( ·? .? ·? )?

希望大家能在相關技術研究上貢獻自己的力量，也歡迎有共同研究結果的朋友來一起探討。

具體「某個濾鏡要怎麼調出來？」這種問題，我不會再在私信中回復，敬請理解。

有這麼幾類：
（1）基於ColorMatrix，是一個4x5矩陣，分別代表 RGBA 的變換。
這種變換是像素獨立的，也就是說這個像素的變換，不會受周邊像素值的影響，只由自身的 RGBA 決定。
比如：亮度、對比、飽和度、色調、灰色化、分離RGB通道，都可以用這個完成。

（2）基於Convolution，就是@馮東所說的卷積，一般是3x3的矩陣，也可以更大。
每個像素的變換，都會受周邊像素值的影響。

比如：邊緣檢測、浮雕化、模糊、銳化。

（3）基於Affine，也叫仿射矩陣變換。
比如：縮放、旋轉、傾斜。

（4）基於Displacement，也叫置換圖。
一般用於類似實現 Photoshop 的扭曲、液化效果。

（5）多圖像合成。
有很多種插值演算法，不再一一列舉了。

（6）自定義的處理程序，基本原理就是一個個像素遍歷，來進行分析處理。
這樣其實效率比較低，但是很多語言都提供了 Bitmap 原生 pixel 訪問介面，可以直接操作。

上述幾個，足夠做大部分濾鏡了。比如：
柔光鏡可以基於（1）（2）完成。LOMO可以基於（1）（5）完成。

正好前兩天在慕課網上看到2套關於濾鏡演算法原理介紹及實現的中文視頻課程，推薦給題主。
Android圖像處理
Android圖像處理

數字化濾鏡是利用信號處理的「卷積（convolution）」實現的。在平面照片上是用 kernel 來實現。比如下面 3x3 的 kernel：
0 1 0
1 0 1
0 1 0

就是一個對黑白照片（灰度圖）進行 blur 的 kernel。Kernel 的用法就是輸出圖片的每一個像素都是把 kernel 的中心放到輸入圖片的對應位置，然後按照 kernel 的值對 kernel 覆蓋的每一點進行加權求和。

原理就是像大石頭所說的那樣，我正在研究在iOS中的實現。

可以用CoreGraphics框架的方法去取一個個像素點的RGBA信息，然後修改像素的RGBA。這麼做缺點是很慢，但可以用多線程等方法讓用戶體驗好一些。
也可以用OpenGL ES，這個我在研究中。速度應該會很快，而且可以在拍照的時候加上濾鏡效果。stackoverflow上有個帖子，覺著靠譜：http://stackoverflow.com/questions/5156872/how-to-apply-filters-to-avcapturevideopreviewlayer/5158856#5158856
iOS 5中有新的框架：CoreImage，它包裝了OpenGL ES。缺點就是iOS5以下用不了。

ios有個開源庫，GPUImage, 實時濾鏡

參與制作過一款主打圖片分享的app，濾鏡是蠻核心的一個功能。沒做過攝像頭實時濾鏡，做過拍好照片後期處理的濾鏡。分享下製作過程和經驗。

基於一套基本的圖像處理庫，可以實現亮度，對比度，飽和度，銳度調整，和正片疊底，灰度，色階調整等等一些基礎功能。如果設計師覺得某個基礎功能必不可少，庫裡面又沒有，就只能自己實現了。色階調整就是自己實現然後添加到庫裡面的。

設計師基於上述的基礎功能，在ps中處理一些照片，記下處理的步驟和參數，程序猿對著實現一下就好了，沒什麼難度。甚至計劃後期直接讓設計師寫配置文件，app載入一下就是一個新的濾鏡。還開腦洞讓用戶自己設計濾鏡，可以在app內互相交易。如果到時候app還活著的話。

遇到的難點有兩個，一個是畢竟我們用的基礎圖像演算法和ps用的不一樣，最後同樣的步驟和參數，出來的效果有細微差別，這就需要設計師指導著一點一點調整參數，很繁瑣。後來我們組團去eico design學習濾鏡製作技巧，有提到過這個問題。他們設計師老大呵呵一笑，說我們app用的濾鏡都是我自己實現的，封裝成庫給開發組用，當時我們就斯巴達了，開始威逼我們的設計師學寫代碼。

第二個難點跟我們當時用的庫有關，性能很低，線性的一步一步執行完耗時基本超過2s，用戶能忍我們都不能忍，尤其是在給程序猿發iphone 3gs做測試機的公司(對，就那家給猿用2g內存台式機的公司)。測試機上點一下，大概4秒才能看到效果。後來另外一個哥們用一個使用gpu運算的矩陣庫重寫了一部分耗時的基本處理演算法，才算稍微解決。估計現在應該不會遇到這種問題了。

剛接觸這一塊，請問各位大俠，這種look up table圖是怎麼做出來的呢？用什麼軟體呢？

將24bit真彩色變成了64x64x64色這樣真的好嗎? 難到要立方體插值?

去研究研究岡薩雷斯~

這個問題的各種答案信息量很大，感謝各位~

寫個雙邊濾波加上美白效果就湊合了

不太複雜的處理，好像第三方SDK是有一些的。不過看具體需求，不一定匹配吧。
TuSDK，camera360，貌似濾鏡、美顏之類是有的。

1樓2樓都是搞研究的吧。
圖像處理的第三方庫很多，我看過些opencv，貌似不錯。