创建可旋转的瓦片图案

Following on my tutorial on how to make tileable stripe patterns, this is a tutorial on how to make tileable rotated versions of any tileable pattern or texture (for example, a rotated checkerboard, a tilted grid or an angled weave pattern). This is a little more complicated than the stripes pattern and requires a bit more math. As with the previous tutorial, the problem is to take a tileable texture and rotate it and still keep the rotated texture tileable as part of a web page background or something like that. Shown below is a generic tileable pattern where I highlighted the repeating texture element (texel), along with a rotated version of the same texture. Tiling is easy for the unrotated image, all you need to do is make an image that contains exactly one of the repeating texture elements. The rotated texture is trickier to tile and you can see that the pattern at each edge of the image will be hard to match up with the opposite edge. This tutorial works out how to make it tileable.

继我关于如何制作可铺设的条纹图案的教程之后,这是一个关于如何制作任何可铺设的图案或纹理的可铺设的旋转版本的教程(例如,一个旋转的棋盘,一个倾斜的网格或一个有角度的编织图案)。这比条纹图案要复杂一些,需要更多的数学运算。和上一个教程一样,问题是要把一个可平铺的纹理旋转起来,并且仍然保持旋转后的纹理可平铺,作为网页背景的一部分或类似的东西。下面显示的是一个通用的可平铺图案,我突出了重复的纹理元素(texel),以及同一纹理的旋转版本。对于未旋转的图像来说,贴图是很容易的,你所需要做的就是制作一个正好包含一个重复纹理元素的图像。旋转的纹理在铺设时比较麻烦,你可以看到图像每个边缘的图案都很难与对面的边缘相匹配。本教程研究了如何使它可被铺设。

Unrotated generic pattern with repeating texel highlightedRotated generic pattern with repeating texel highlighted

Although this tutorial is written for the GIMP, there are actually very few GIMP-specific instructions. It is therefore applicable to Photoshop or any other paint program.

虽然本教程是为GIMP编写的,但实际上很少有针对GIMP的说明。因此,它也适用于Photoshop或任何其他绘画程序。

The strategy is identical to the tileable stripes tutorial:

该策略与可铺设的条纹教程相同。

  1. Take an unrotated, tileable texture that repeats horizontally and vertically.
  2. 取一个未经旋转的、可平铺的纹理,在水平和垂直方向上重复。
  3. Tile it to a large image.
  4. 把它平铺到一个大图像上。
  5. Rotate the large image by the desired angle.
  6. 将大图像旋转到所需的角度。
  7. Find the size of the smallest repeatable unit of this rotated texture (using the math below).
  8. 找到这个旋转纹理的最小可重复单位的大小(使用下面的数学方法)。
  9. Crop the large image to the size of the repeatable unit.
  10. 将大图片裁剪成可重复单位的大小。

This produce...

开通本站会员,查看完整译文。

首页 - Wiki
Copyright © 2011-2025 iteam. Current version is 2.146.0. UTC+08:00, 2025-10-12 16:25
浙ICP备14020137号-1 $访客地图$