如何设计好的连续(无缝)瓷砖?


33

我有麻烦的设计瓷砖,这样组装时,他们并不像瓷砖,但看起来像一个同质的东西。例如,请参见下图:

在此处输入图片说明

即使草的主要部分只有一个瓷砖,您也不会“看到”网格。如果仔细看一下,您知道它在哪里,但这并不明显。而当我设计图块时,您只能看到“哦,老天,同一图块的64倍”,如下图所示:

在此处输入图片说明 (对不起,我从另一个GDSE问题中得出了这一点;对游戏并不批评,但这证明了我的意思。实际上,无论如何我都拥有更好的拼贴设计。)

我认为主要问题是我将它们设计为独立的,如果彼此靠近,则两个图块之间没有连接。我认为让磁贴更“连续”会产生更平滑的效果,但无法做到,对我来说似乎太复杂了。

我认为它可能比我一旦知道了如何做就简单,但找不到关于该特定点的教程。有已知的设计连续/均质砖的方法吗?(我的术语可能是完全错误的,请毫不犹豫地纠正我。)


值得注意的是:在您链接的屏幕截图中,棋盘图案中可能会出现2个或更多的草砖。计时扳机有多种草砖
doppelgreener 2012年

1
我还建议快速搜索RPG Maker贴图集。它们不是最重要的图块,但您可以看到过渡图块的一些示例。
Mike

除了上述答案外,可以帮助您的一件事是使用像素艺术编辑器,该编辑器允许您在绘制图块时预览它们。我推荐Pickle:pickleeditor.com
用户找不到

2
这里还有关于此主题的另一篇好文章:gas13.ru/v3/tutorials/sywtbapa_obliterating_grid.php
Tesserex 2012年

1
谢谢,尤其是对于最后一个教程,它回答了我遇到的许多其他问题:p
Cristol.GdM 2012年

Answers:


20

免责声明:我不是艺术家,所以这只是程序员的艺术知识。

您的示例中出现网格效果的原因主要是因为瓦片底部边缘上的那片较浅的草丛:

在此处输入图片说明

像这样容易识别的细节立刻就让您知道,您只是在重复相同的图块。

查看这篇文章该文章有很多关于该主题的有用提示。特别是使用Photoshop:

  • 使用补丁工具摆脱明显的细节。
  • 使用Doge或Burn工具可在任何地方获得均匀的亮度。
  • 通过偏移图像使边缘无缝,然后使用修补工具将边缘融合在一起。我也看到人们为此目的复制和镜像四次。

同样,在您链接的图像中似乎也存在实现问题,因为放大图像时,您会看到图块之间的一些间隙:

在此处输入图片说明


3
+1复制和镜像对我来说似乎很好用,还有一些工具可以帮助您:这是许多教程之一-photoshoptextures.com/texture-tutorials/seamless-textures.htm-关键字基本上是“无缝纹理”。
Oskar Duveborn 2012年

好的,我尝试了(答案教程和注释教程),结果都好多了,知道“无缝纹理”一词将来会有所帮助,所以谢谢!
Cristol.GdM 2012年

@OskarDuveborn尼斯链接,最终图像清楚地表明了它产生了很大的变化!
David Gouveia 2012年

15

我不是专家,但是从拥有多种类型的草砖(人们并不完全不同,但人们认识到足够不同)的角度出发,一个窍门可能是在两种不同类型的草砖之间使用“过渡砖”。使用您显示的示例图像,在完全灰色和完全绿色的瓷砖之间使用半绿色,半灰色的瓷砖可以帮助平滑过渡。另外,如果使这些过渡变圆并且看起来更自然(一个纹理逐渐淡入下一个纹理),则可以起到效果的作用。

请注意,位于底部中心的Chrono Trigger图像中,它是如何具有一半的褐色(污垢),一半的绿色(草)以及一片深色草丛的。它还使用较轻的草和石头来增加自然变化(也许是一块透明的砖,上面有石头或浅草,也许吗?)


5
+1过渡磁贴至关重要!黄金法则:在需要的基础上进行过渡。你把雪放在草旁边了吗?没有?这样一来,您就不必进行从草到雪的过渡了。您是第一次将熔岩放在泥土旁边吗?太好了,是时候为此创建一组过渡图块了。
doppelgreener 2012年

11

您必须进行转换,对于多种类型的图块的每种可能组成,都必须绘制完成转变的图块。您可能想要确定游戏中不可能有很多组合,因为您原本必须进行的过渡数量会轻易增加到很大数量。

通常,这意味着以某种方式混合表面类型的质量,例如,从草到尘土的简单过渡通常会随着进入污垢块的距离越来越小而草丛越来越少。但是,为了快速修复,您可以简单地淡出一种纹理,而使其淡入另一种纹理,或者进行抖动处理,即使用从偏爱一种纹理转移到另一种纹理的加权机会,从两种纹理之一中随机选择像素。

另外,我建议您从查看图块转变为小图块模式,考虑一下这两个图块的图像,如果您不想制作完整的图块来制作与红色图形相对应的形状,则您将永远不需要两个以上的不同表面相同的图块,从而极大地限制了您必须制作的过渡图块的数量,然后可以继续从这些菱形图块生成用于游戏中的正方形图块,或者您可以直接直接使用菱形图块,而计算机并不需要对这些事情非常挑剔。

子瓷砖标记为红色



6

首先制作一个普通的瓷砖。然后将瓷砖水平和垂直分成4个相等的部分,剩下4个“平铺”。

磁贴现在将如下所示:

1 2
3 4

将块2放在块1的左侧。对3和4进行相同的操作。图块现在将如下所示:

2 1
4 3

现在,将两个较低的部分向上移动到顶部的部分上方。您剩下的是:

4 3
2 1

假设您的图块是32x32,则每块都是16x16。现在,您删除中间部分,比如说22x22像素(由您决定),剩下一帧图块。现在,该框架将与自身完美平铺,您将留下唯一的空间来填充中间的空隙,例如碎石,石头,一些高高的草丛或其他任何东西。

您可能需要稍微摇动像素,但是当您拥有画框时,就可以制作出许多独特但完美的平铺图块。


0

我设计瓷砖的方式是这样的:

  1. 做你的草稿
  2. 将图块复制到X和Y方向的3倍大的图像中
  3. 复制您的图块,以便图像中应有9个图块
  4. 您应该能够看到每个图块的开始和结束位置,您需要做的是使用模糊工具(我为此使用GIMP)并对边缘进行模糊处理,使其看起来像是一个大图块。
  5. 然后将中间图块复制出图像,然后得到最后一个图块

当您将多个图块彼此相邻放置时,结果应该看起来不错。您始终可以重复此过程以微调您的瓷砖。


1
-1在第4步中,模糊不适用于两侧(例如,中间磁贴底部的模糊与顶部磁贴底部的模糊不匹配),因此您的结果不是无缝的。偏移是确保无缝性的更好的工具。
doppelgreener 2012年

如果操作正确,它将显示为无缝的;如果在所有接缝处均匀地进行处理,则效果很好;如果减小模糊工具上的压力,则可以微调边缘,使其在所有面上看起来都均匀。
约翰
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.