所見所得捕捉光影——實時濾鏡創新二三點

0 評論 4778 瀏覽 2 收藏 6 分鐘

說起“濾鏡”這個已經不再陌生的詞匯。伴隨著高性能移動終端的普及,其作為一種可以自動快速修飾圖片的技術在短短幾年內已然成為眾多移動終端拍攝類應用的標配。但是在目前拍攝類應用里,大部分濾鏡仍然停留于先拍攝后處理的靜態處理流程,也有部分應用進一步實現了實時濾鏡技術,但是兩者的濾鏡處理過程對用戶來說是不可干預的,在交互上也相對單一,效果也比較單調。
為了解決目前濾鏡不可定制、功能單一缺乏交互等技術和體驗上的不足,騰訊CDC的開發團隊和設計團隊一起配合,在實現高清實時濾鏡的渲染技術基礎上,提出了一種利用用戶手勢與終端交互改變濾鏡效果,實時預覽界面中或拍攝完成后更改濾鏡效果的解決方案,比起傳統的無濾鏡拍照應用和圖片美化應用,拍攝成品質量有了巨大的提升,通過這種技術滿足了用戶個性化的需求和交流,也大大降低了圖片美化的成本。

手勢交互DIY你的濾鏡
目前無論實時濾鏡還是靜態濾鏡,濾鏡效果都是不可定制、功能比較單一,針對這個問題我們提出了一種新的嘗試,用戶通過手勢與終端進行交互,終端響應用戶的交互行為,在濾鏡變換過程中根據這些用戶手勢操作來動態調整濾鏡效果。如下圖

圖1. 運用縮放手勢調整魚眼扭曲強度大小

  通過這種交互手段,我們可以通過終端所具有的手勢操作來動態改變濾鏡的效果,包括濾鏡顏色濃度特效強度等等。讓使用者用最直觀的方式來DIY自己喜歡的濾鏡效果,濾鏡處理將變成一個更加有趣更加個性化的體驗過程。

圖2. 平移手勢控制濾鏡過濾的顏色值

所見即所得實時渲染

大部分拍照應用都是采用先拍照后選擇的濾鏡處理流程,對拍照后圖片每個像素點數據進行運算處理,整個過程依賴終端CPU的串行計算,處理效率低,依靠這種方案難以實現實時動態預覽濾鏡。
為此我們采用了OpenGL ES技術將圖象處理工作交予GPU進行。圖形系統采用特有的管道(Pipeline)機制來運算處理圖像數據,對像素點的處理為并行進行,大大提升了效率,OpenGL ES 2.0 允許提供編程來控制管道中一些重要的工序,其中包括shader著色器。著色器包含了允許在頂點上進行一般操作的頂點著色器,以及允許在片段上進行一般操作的片段著色器。我們利用著色器這一環節來編寫shader程序運用圖片處理算法來實時處理圖像數據,并將結果輸出,達到實時渲染所見所得的濾鏡效果。

圖3. OpenGL ES 2.0管道(Pipeline)機制

  百聞不如一見,我們錄制了一段演示視頻來展示以上提及的濾鏡創新點帶來的體驗:

移動終端便捷快速的特性帶來的是拍照成本的極大降低,同時終端圖像處理性能的不斷升級提升也讓更加絢麗的圖片處理變為可能。我們CDC也在不斷通過體驗和技術上的實踐和嘗試,將濾鏡圖片處理變得更加友好和快捷。以上所做的濾鏡研究和實踐方案將很快出現在如Q拍等騰訊移動端產品上,敬請期待和體驗。

One more thing,目前CDC實時濾鏡已入選騰訊創意月榜5月號復選名單,歡迎大家訪問 http://djt.qq.com/thread-29001-1-1.html 參與投票支持我們的研究成果(實時濾鏡是A號作品),并有機會獲得年費藍鉆哦:)

  • (本文出自Tencent CDC Blog,轉載時請注明出處)
更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 目前還沒評論,等你發揮!