自己动手,实现“你的名字”滤镜

我喜欢《你的名字》这个故事,前一段时间在微信上使用过它的滤镜,实现的效果很惊艳,应该类似于下面的这些结果

    

这三幅图应该都是手机版本制作的,它们一个比较显著的特点是分辨率比较相似。如何实现类似的效果了?(注意后面两图天上的云是相同的)

首先我想到的是Prisma的实现方法,这种实现方法,最后得到的是纹理的转换,效果应该说非常好,但是依赖于深度学习,目前这个方面掌握的不是很明确。而且显然上面三图不是纹理转换。

继续寻找,主要参考《实现<你的名字>同款滤镜,python+opencv》等相关资料。

一、问题分析

对于这样一副图片,如果想变成《你的名字》这种效果,需要做以下事情

(一)背景(天空)分割,替换后再融合

在自然界的图片中,很难出现动漫中大多大多的云彩。首先需要将背景(天空)分割出来,替换成动漫的天空,并且在很好地融合回去。

需要实现的技术:1.背景(天空)分割;2.再融合。需要准备的材料:1.大块的动漫云图

(二)前景色调转换

为了实现漫画中具有卡通意味的前景色调,需要对前面切割下来的前景图片进行色调转换。

需要实现的技术:3.LUT和色块制作

(三)程序框架

需要实现的技术:基于GOMfcTemplate2,实现图像的输入输出、滤镜操作的参数选择等基础操作

二、材料准备

1.大朵的云。先找到一副自然界中的云。

再准备(制作)一幅动漫的云和一副星空的图片.

三、算法实验

1.背景(天空)分割,采用材料中的方法,修改形态学部分

/************************************************************************/
/* 1.背景(天空)分割                                                                  */
/************************************************************************/
    cvtColor(matSrc,temp,COLOR_BGR2HSV);
    split(temp,planes);
    equalizeHist(planes[2],planes[2]);//对v通道进行equalizeHist
    merge(planes,temp);
    inRange(temp,Scalar(100,43,46),Scalar(124,255,255),temp);
    erode(temp,temp,Mat());//形态学变换,填补内部空洞
    dilate(temp,temp,Mat());
    imshow("原始图",matSrc);

对于这幅图来说,效果不错

2.再融合

以此为mask,直接将云图拷贝过来(之前需要先做尺度变换,就是resize)

cvtColor(temp,mask,COLOR_BGR2GRAY);//将结果存入mask
resize(matCloud,matCloud,matSrc.size());
matCloud.copyTo(matSrc,mask);

这个时候看图片,还是有很多瑕疵的,特别是边缘的地方。

所以采用seamlessclone,得到以下结果

//seamless clone
    Point center(matSrc.cols/2,matSrc.rows/2);
    Mat normal_clone;
    Mat mixed_clone;
    Mat monochrome_clone;
    seamlessClone(matCloud, matSrc, mask, center, normal_clone, NORMAL_CLONE);
    seamlessClone(matCloud, matSrc, mask, center, mixed_clone, MIXED_CLONE);
    seamlessClone(matCloud, matSrc, mask, center, monochrome_clone, MONOCHROME_TRANSFER);

NORMAL_CLONE

MIXED_CLONE

MONOCHROME_TRANSFER

相比较之下,MIXED_CLONE对原图纹理的保存更好一些,在最后是项目中,计划将这些选线都保留。

3.LUT和色卡制作

滤镜的实现,其实只是一个RGB通道到RGB通道的转换。这个我之前有所积累,为了实现最好的效果,我这里重新实现一遍。

//打印原始色卡
    Mat matBoard = Mat(2048,1024,CV_8UC3,Scalar(0));
    for (int b = 0; b < 128; b++) 
    { 
        for (int g = 0; g < 128; g++) 
        { 
            for (int r = 0; r < 128; r++) 
            { 
                int index = b * 128 * 128 + g * 128 + r; 
                int icols = index/1024;
                int irows = index%1024;
                matBoard.at<Vec3b>(icols,irows)[0] = b;
                matBoard.at<Vec3b>(icols,irows)[1] = g;
                matBoard.at<Vec3b>(icols,irows)[2] = r;
            } 
        } 
    }

采用美图秀秀对其进行卡通转换

四、工程实现

基于GOMfcTemplate2,实现图像的输入输出、滤镜操作的参数选择等基础操作

五、小结反思

来自为知笔记(Wiz)

时间: 2024-10-14 01:42:34

自己动手,实现“你的名字”滤镜的相关文章

【开源一个小工具】一键将网页内容推送到Kindle

最近工作上稍微闲点,这一周利用下班时间写了一个小工具,其实功能挺简单但也小折腾了会. 工具名称:Simple Send to Kindle Github地址:https://github.com/zhanjindong/SimpleSendToKindle 功能:Windows下一个简单的将网页内容推送到Kindle的工具. 写这个工具的是满足自己的需求.自从买了Kindle paperwhite 2,它就成了我使用率最高的一个电子设备.相信很多Kindle拥有者和我一样都有这样一个需求:就是白

ActionScript3游戏中的图像编程(连载二十七)

2.2 Photoshop投影样式在Flash基本滤镜中的体现 作为上帝的另一个化身,Flash在图层样式方面自然也不甘示弱,不过在Flash里面,它有另外一个名字--滤镜(仅仅从概念上说,Flash的滤镜包含了Photoshop里的图层样式和滤镜). 下面就让我们打开Flash CS6/5.5,一起在滤镜里寻找Photoshop图层样式的影子吧,同时,我们先暂时把Photoshop的图层样式清除掉(把样式前面那些复选框的勾全部去掉即可). 先新建一个文档("文件"--"新建

[原创]ActionScript3游戏中的图像编程(连载二十七)

2.2 Photoshop投影样式在Flash基本滤镜中的体现 作为上帝的另一个化身,Flash在图层样式方面自然也不甘示弱,不过在Flash里面,它有另外一个名字——滤镜(仅仅从概念上说,Flash的滤镜包含了Photoshop里的图层样式和滤镜). 下面就让我们打开Flash CS6/5.5,一起在滤镜里寻找Photoshop图层样式的影子吧,同时,我们先暂时把Photoshop的图层样式清除掉(把样式前面那些复选框的勾全部去掉即可). 先新建一个文档(“文件”——“新建”或Ctrl+N),

android Studio 二维码扫一扫 使用精简过的zxing

今天学习做个扫一扫  于是就上百度找找前人的作品,终于找到了,于是就开始搞 我使用的是 最新的android Studio Android Studio 3.1.2Build #AI-173.4720617, built on April 14, 2018JRE: 1.8.0_152-release-1024-b02 amd64JVM: OpenJDK 64-Bit Server VM by JetBrains s.r.oWindows 10 10.0 想做的APP样子是:  A界面中有个按钮.

安装vant2.2.7版本报错These dependencies were not found: vant/es/goods-action-big-btn in ./src/config/vant.config.js......

一.问题 前天,在使用vant的checkbox复选框的时候,注意到新增加一个全选功能,通过 ref 可以获取到 CheckboxGroup 实例并调用实例方法.于是我就想用这个,但是按照上面的示例写了以后,一直提示我toggleAll is not a function,让我很纳闷. 后来发现我自己的vant的版本还是1.x的,而这个功能是在2.2.6才新增加的,于是我就升级呗. 问题来了,安装了最新版以后,在我运行程序的时候 ,就一直报错, These dependencies were n

iOS8 Core Image In Swift:更复杂的滤镜

iOS8 Core Image In Swift:自动改善图像以及内置滤镜的使用 上面那篇文章主要是Core Image的基础,只是为了说明CIImage.CIFilter.CIContext,以及基础滤镜的简单使用.在上一篇中几乎没有对滤镜进行更复杂的操作,都是直接把inputImage扔给CIFilter而已,而Core Image实际上还能对滤镜进行更加细粒度的控制,我们在新的工程中对其进行探索.为此,我重新建立了一个空的workspace,并把之前所使用的工程添加到这个workspace

iOS滤镜 图片处理

摘要:本文结合实例详解了OS X和iOS图像处理框架Core Image的使用,如何通过Core Image来创建和使用iOS的内置滤镜,非常适合初学者学习.虽然示例代码是用Swift写的iOS程序,不过实现概念很容易转换到Objective-C和OS X. 这篇文章会为初学者介绍一下Core Image,一个OS X和iOS的图像处理框架. 如果你想跟着本文中的代码学习,你可以在GitHub上下载示例工程.示例工程是一个iOS应用程序,列出了系统提供的大量图像滤镜以供选择,并提供了一个用户界面

iOS上用GPUImage给视频加滤镜

最近在做一个需要给已有视频加滤镜的app,不是实时滤镜,而是给已经存在的视频加滤镜. 虽然网上有很多关于GPUImage的博客,但大多都是给图片加上滤镜或者是直接在摄像头上加上的实时滤镜,找了很久之后..... 发现在github上本来就有..... 但是在网上找,却没有说很多人给出这样的滤镜教程,这里简单给分享一下下. 1. 首先,什么是GPUImage?详细请度娘之,简单点来说,就是一个用GPU来处理图片和视频的第三方库. 2. 给图像加滤镜,如果是只加滤镜,那么网上有很多的教程,这里就不细

iOS8 Core Image In Swift:自动改善图像以及内置滤镜的使用

基于iOS SDK 8.0以及Xcode 6 Beta 6. Core Image是一个很强大的框架.它可以让你简单地应用各种滤镜来处理图像,比如修改鲜艳程度, 色泽, 或者曝光. 它利用GPU(或者CPU)来非常快速.甚至实时地处理图像数据和视频的帧.并且隐藏了底层图形处理的所有细节,通过提供的API就能简单的使用了,无须关心OpenGL或者OpenGL ES是如何充分利用GPU的能力的,也不需要你知道GCD在其中发挥了怎样的作用,Core Image处理了全部的细节. Core Image框