COS_NPR非真实渲染_头发

最新推荐文章于 2023-10-21 18:09:40 发布

羽扇轩轩

最新推荐文章于 2023-10-21 18:09:40 发布

阅读量1.7k

点赞数 5

CC 4.0 BY-SA版权

分类专栏： ABigDeal的小宝库

本文链接：https://blog.youkuaiyun.com/ABigDeal/article/details/88406602

本文介绍了一种非真实渲染（NPR）技术在创建头发效果上的应用。通过控制漫反射和高光反射，结合各向异性与扰乱贴图，实现了简洁而逼真的头发渲染效果。文中提供了参考思路以及实际操作中使用的扰乱贴图，并附有相关代码示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一个非真实渲染的头发

只有简单的两部分，因为是打包手表，所以尽量简洁了

漫反射（可控背影颜色）+高光反射（各向异性+扰乱）

效果：

参考崩坏的想法：

所用的扰乱贴图：

代码：

// Upgrade NOTE: replaced '_Object2World' with 'unity_ObjectToWorld'
// Upgrade NOTE: replaced 'mul(UNITY_MATRIX_MVP,*)' with 'UnityObjectToClipPos(*)'


//非真实渲染_头发

Shader "ABigDeal/COS_AnistotrpicHair" {
	Properties {
		_M

最低0.47元/天解锁文章

200万优质内容无限畅学

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

羽扇轩轩

关注关注

5
点赞
踩
17

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

Chapter14 非真实感渲染 NPR——Shader入门精要

weixin_70073176的博客

07-20

926

【代码】Chapter14 非真实感渲染 NPR——Shader入门精要。

游戏中各向异性头发的渲染

探索之眼——无尽

11-03

1万+

趁有时间写一篇关于各向异性头发的渲染。先上效果图（不含Ao）。这个是04年的一个ppt，主要介绍了头发的渲染，其追到源头还是要看这个原理。 各向异性的主要计算公式：主要代码如下：切线混合扰动部分（这部分也可以用T+k*N，来对切线进行扰动）： float3x3 tangentTransform = float3x3(i.tan

参与评论您还未登录，请先登录后发表或查看评论

【NPR】非真实感渲染实验室

weixin_33957648的博客

08-04

604

写在前面前几天在知乎看到一个问题——关于非实感图形学或者风格化渲染有哪些好的书或者paper，我刚好接触过一些就去里面回答了一下。答完以后突然想在Unity里搞一个这样的集锦，把一些简单的NPR论文或者教程在Unity里实现一下。于是这两天就做了一下。我把这个项目放到了GitHub（https://github.com/candycat1992/NPR_Lab）...

非真实渲染技术（NPR）-1.卡通渲染

PlayBoy's 部落格

06-12

1万+

卡通渲染， sihouette,勾边，卡通着色， NPR，非真实渲染， renderMonkey

C for Graphic：卡通头发

羊羊的博客

12-27

981

卡通头发也有一个渲染上的特点，俗称”天使环“，就是头发上有一圈圆环高光。

非真实感渲染(NPR)论文理解及其复现(Unity) - 《Stylized Highlights for Cartoon Rendering and Animation》

122&&113的博客

07-23

1301

论文理解及其复现

卡通头发的做法

weixin_30908649的博客

11-17

296

总体发现的方法有三种：Idolmaster最简单，看上去就是在头发上画一个特殊的Reflect mask maphttps://youtu.be/l5i4vC-uUIk?t=25Dream Clubhttps://youtu.be/EjFBHfoGeNw?t=206猜测用的是这个Paper中的做法MMD很讨巧的一种做法，根据视空间顶点法线转算UV，连Rim Light都顺便实现了。。。我已经把Sh...

unity NPR 卡通渲染

qq_20179331的博客

10-21

2777

NPR是计算机图形学中的一类，即非真实感绘制(Non-photorealistic rendering)，主要用于模拟艺术式的绘制风格，也用于发展新绘制风格，形式一般是卡通造影。NPR是Unity中的一种非真实渲染技术，它使用一种称为"NPR"的算法来模拟非真实渲染效果。这种技术可以用于制作各种类型的视觉效果，包括卡通效果、手绘效果、水彩画效果等等。NPR算法的核心思想是将3D模型表面的每个点映射到一个二维平面上，这个平面上的每个像素点对应一个颜色。

gpu gems——第23章头发动画和渲染

阿拉平平的专栏

08-25

2517

https://developer.nvidia.com/gpugems/GPUGems2/gpugems2_chapter23.html 我们要实现的目标是渲染长的，金色的，流动的水下头发。这节介绍实现实时渲染目标的一些技术。包含一个仿真头发运动的系统，一个计算头发自阴影的算法，模拟单个头发的光散射的反射模型。结合起来，这些元素生成逼真的头发图像。在Nalu头发着色器后台，有一个系统生成头发

[渲染层错误] updatemultimarker faild_头发渲染的前世今生：如何在游戏中拥有一头迷人秀发？...

weixin_39605191的博客

12-11

363

文丨Mr_ctong腾讯互动娱乐工程师导语：在游戏制作中，人物的占比越来越大而且已经成为一个体系。渲染和优化的时候都会为角色量身定制一套方案。甚至为了角色表现，会为展示在大厅的角色单独做一套效果和资源。本篇主要从角色渲染中最难的头发渲染开始说起。本人水平有限，如有错误，请不吝赐教。大纲头发模型科普一下实时渲染和离线渲染的区别。实时渲染：计算机需要在运行时生成所有的3D模型、贴图等等，并以尽可能快...

头发的生成以及渲染方案

云那边是海的专栏

10-02

5173

搁笔良久，今起复耕本文主要涉及头发的生长方案，光照模型，阴影效果，透明效果以及多次采样抗锯齿。一. 头发的生长：定义根节点以及头发长度参数头发从头皮生长，根据mesh的UV展开图，编辑头部头发生长区域以及利用颜色控制头发的长度。鉴于头发后期仿真模拟的需要，此处使用tessellation shader，可以生长更加细密的头发。对头部头...

COS_头发渲染shader

ABigDeal的博客

01-25

2558

好久没更了。苦战一周，总算捅咕出点能看的了，赶紧总结，免得以后忘了~~代码还是有点乱套，关于最主要的饿地方，切线空间还是有点蒙圈，得抓紧补基础渲染，底层的东西，要不真的让人头大，废话少说，入正题：这次是参考unity官网的铁匠的头发shader的高光反射部分，和unity的软化边缘的部分。因为是Gama渲染，好多参数都是用If判断的，小白~看不懂。。。只能一个一个试，看看运行的是哪部分，提取出...

基于Unity 5的次世代卡通渲染技术 -- Unite 2017 米哈游总监贺甲分享实录

aikb6223的博客

10-31

1457

在5月12日Unite2017开发者大会上，米哈游技术总监兼美术指导贺甲进行了主题为次世代卡通渲染的演讲。一下为详细分享内容：　　大家好，首先自我介绍一下，我叫贺甲，在米哈游担任技术总监和美术指导工作，目前主要关注的方向是非写实渲染以及可交互物理方面的研究。很高兴在这里给大家带来一场有关于次世代卡通渲染的演讲。　　我们在考虑如何运用次世代渲染技术，对当...

NPR&卡通渲染

小孔明的专栏

04-24

3871

术语介绍： NPR——non photorealistic render. 即非真实感图形学。 Cel-Shading 或者叫做 ToneBasedShading 即所谓的卡通渲染。学习曲线： https://blog.youkuaiyun.com/jvandc/article/details/81171250#npr卡通渲染轮廓线，勾边，描边图像的边缘可以指灰度不连续，或者亮度、深度、表面法线、表面反...

【Unity Shader】带描边的半透明材质处理（头发为例）

zolin7的专栏

03-21

1万+

最近做头发shader的时候做了这么一个简单测试，用的模型是以前制作的一个角色头部，在这里用来记录一下作为学习的总结。基本思路就是利用3个Pass处理带描边的半透明材质看下最终的测试截图（头发的材质不在本次讨论范围，有机会单独做一个总结）：关于Blend部分也测试下截图保留：1.第一个Pass开启深度写入，处理AlphaTest，但不输出颜色//第一个Pass，开启深度写入，不输出颜色，处理Alp...

【《Real-Time Rendering 3rd》提炼总结】(十) 第十一章 · 非真实感渲染(NPR)相关技术总结

最新发布

04-27

<think>好的，我现在需要帮助用户在Unity中创建非真实感渲染（NPR）Shader，特别是卡通效果。首先，我得回忆一下之前用户提供的引用内容，看看有没有有用的信息。引用[2]提到了卡通渲染的四个要素：轮廓描边、色阶、高光、边缘光。这些应该是实现的关键点。接下来，我需要考虑用户的具体需求。用户可能已经了解了一些基础概念，现在需要具体的实现步骤和方法。我应该分步骤讲解每个要素的实现方法，并给出代码示例，这样用户可以直接应用。首先，轮廓描边部分。常见的实现方法有基于法线或深度的边缘检测，或者后处理描边。不过引用[3]提到的是将3D模型表面映射到二维平面进行计算，可能涉及顶点和片段着色器的处理。这里可能需要使用两个Pass，第一个渲染背面并挤出轮廓，第二个正常渲染正面。这样处理轮廓线比较常见，应该适合用户的需求。然后是色阶处理。引用[2]提到色阶是要素之一，需要将颜色离散化。在Shader中，可以使用ramp纹理或者颜色分阶算法。比如，将光照计算后的结果映射到几个固定的颜色上，这可以通过对漫反射进行离散化处理来实现，比如使用floor函数或者step函数。高光部分，卡通风格的高光通常是锐利的块状。传统的Phong或Blinn-Phong高光模型可能不够，需要修改为阈值判断，只显示超过一定强度的高光区域，并使用平滑处理让边缘不那么生硬。边缘光，也就是边缘的泛光效果，可能需要计算视角和法线的夹角，当夹角接近边缘时添加颜色。比如使用菲涅尔效应，结合自定义的颜色和强度参数。另外，引用[3]提到的映射到二维平面进行计算，可能涉及到屏幕空间的处理，或者使用表面着色器中的一些方法。这部分可能需要更深入的理解，但考虑到用户可能需要基础的实现，或许先集中在传统的顶点-片段着色器方法上。需要确保代码示例正确，并且符合Unity Shader的语法。比如，使用ShaderLab语法，定义Properties，SubShader中的Pass结构，以及正确的CGPROGRAM部分。可能的问题点：轮廓线的实现方式是否正确，是否需要使用几何着色器或者其他方法？但考虑到用户可能刚开始，使用双Pass法挤出背面可能更简单易懂。此外，引用[1]提到的NPR方法，比如卡通、水彩风格，用户现在专注于卡通，所以可以专注于四个要素的具体实现步骤。最后，要检查是否有遗漏的步骤，比如是否需要处理光照模型，或者如何集成到Unity的渲染管线中。可能需要指导用户在Unity中创建Shader和材质，并应用到模型上。总结步骤：轮廓描边→色阶处理→高光调整→边缘光添加，每个部分给出代码示例，并说明原理。确保代码语法正确，使用$$...$$格式显示独立公式，例如漫反射计算、菲涅尔公式等。</think>在Unity中实现卡通风格的非真实感渲染（NPR）Shader，需围绕四个核心要素构建：**轮廓描边、色阶、高光、边缘光**。以下是具体实现步骤及代码示例： --- ### 一、轮廓描边实现 **方法1：背面挤出法** 通过渲染模型背面并挤出轮廓实现描边效果，需两个Pass： ```glsl Shader "NPR/Cartoon" { Properties { _OutlineColor ("轮廓颜色", Color) = (0,0,0,1) _OutlineWidth ("轮廓宽度", Range(0, 0.1)) = 0.03 } SubShader { // 第一个Pass：渲染轮廓 Pass { Cull Front // 只渲染背面 CGPROGRAM #pragma vertex vert #pragma fragment frag float _OutlineWidth; struct v2f { float4 pos : SV_POSITION; }; v2f vert (appdata_base v) { v2f o; // 沿法线方向挤出顶点 float3 normal = normalize(v.normal); float3 pos = v.vertex + normal * _OutlineWidth; o.pos = UnityObjectToClipPos(pos); return o; } fixed4 frag (v2f i) : SV_Target { return _OutlineColor; } ENDCG } // 第二个Pass：渲染正面 Pass { // 正常光照计算代码... } } } ``` --- ### 二、色阶处理（颜色离散化）通过漫反射光照计算后，使用色阶贴图或算法简化颜色层次： ```glsl // 在片段着色器中添加： fixed4 frag (v2f i) : SV_Target { float3 lightDir = normalize(_WorldSpaceLightPos0.xyz); float diff = dot(i.worldNormal, lightDir) * 0.5 + 0.5; // 离散化为3阶 diff = floor(diff * 3) / 3; fixed4 albedo = tex2D(_MainTex, i.uv) * _Color; fixed3 diffuse = _LightColor0.rgb * albedo.rgb * diff; return fixed4(diffuse, 1.0); } ``` 或使用Ramp纹理控制色阶： ```glsl sampler2D _RampTex; fixed3 rampColor = tex2D(_RampTex, float2(diff, 0.5)).rgb; ``` --- ### 三、高光锐化处理将传统高光模型改为阈值判断： $$ \text{高光强度} = \begin{cases} 1 & \text{当 } \cos\theta > T_{\text{threshold}} \\ 0 & \text{否则} \end{cases} $$ ```glsl float spec = pow(max(0, dot(reflectDir, viewDir)), _Gloss); spec = step(_SpecThreshold, spec); // 阈值化 spec *= _SpecularColor.rgb; ``` --- ### 四、边缘光（菲涅尔效应）基于视角与法线夹角添加发光效果： $$ \text{边缘光强度} = (1 - \max(0, \cos\theta))^{\text{power}} $$ ```glsl float fresnel = pow(1.0 - saturate(dot(normalize(i.worldNormal), viewDir)), _FresnelPower); fixed3 rim = _RimColor.rgb * fresnel * _RimIntensity; ``` --- ### 完整Shader框架示例 ```glsl Shader "NPR/Cartoon" { Properties { _MainTex ("贴图", 2D) = "white" {} _RampTex ("色阶贴图", 2D) = "white" {} _SpecThreshold ("高光阈值", Range(0,1)) = 0.8 _RimColor ("边缘光颜色", Color) = (1,0,0,1) } SubShader { // 轮廓Pass（略） // 主Pass Pass { Tags {"LightMode"="ForwardBase"} CGPROGRAM // 包含上述色阶、高光、边缘光代码 ENDCG } } } ``` --- ### 调试与优化建议 1. **轮廓锯齿问题**：开启多重采样（MSAA）或使用Sobel算子后处理描边 2. **色阶过渡生硬**：在Ramp纹理中使用渐变过渡色块 3. **性能优化**：将高光与边缘光计算合并到同一Pass，减少计算量 [^1]: 非真实感渲染目标与卡通风格定义 [^2]: 卡通渲染四要素理论支持 [^3]: 颜色映射与扫描计算逻辑 ---