tile_transitions - ryzom/ryzomcore GitHub Wiki
title: Notes on transition tiles description: How the 48 transition tiles work, which 12 are unique, and how the remaining 36 are generated by rotation published: true date: 2023-03-16T23:02:17.610Z tags: editor: markdown dateCreated: 2022-03-13T05:18:48.485Z
For every type of terrain (like grass, stones, concrete) there are a number of different textures in different resolutions. The small tiles (128x128) are for refinement of the tiling. The large tiles (256x256) are for covering larger areas of terrain with more diverse ground features like holes or puddles — not for partial high-resolution areas.
The diffuse textures are always 128x128 and 256x256. The borders must be identical: top/bottom edges must match and left/right edges must match. See tile textures for the full border rules.
Every tileset should have both 128x128 and 256x256 textures for best visual variety, though only 128x128 tiles are strictly required.
A 128x128 tile covers a 2x2 meter area. A 256x256 tile covers a 4x4 meter area (2x2 tiles). The pixel ratio stays the same — the large tile simply covers more terrain, not higher resolution on the same area.
You should use at least 3-4 differently structured textures per type of terrain to avoid visual repetitiveness.
Transitions are used when one ground type blends into another, like grass to gravel.
For every tileset there is a complete set of 48 transition tiles. Each transition tile has a diffuse channel, an additive channel, and an alpha channel. The alpha channel defines the blend shape between the foreground and background materials.
The basic shapes of the 48 transition alphas can be seen in the tile bank page. The dark areas are transparent (alpha=0, background material), and the light areas are opaque (alpha=255, foreground material). The shape of the blend boundary can be whatever you like, but the edges of each transition must match its neighbors according to the border flag table in the engine (CTileSet::_TransitionFlags).
You do not need to create all 48 tiles by hand. Only 12 unique alpha bitmaps are needed — the remaining 36 are the same 12 reused with different rotations (90°, 180°, 270°). The batch load function in tile_edit.exe handles this automatically when the "use rotation to reuse alpha tiles" option is selected.
Here is the complete mapping showing which original tile is used for each of the 48 transition slots, and what rotation is applied:
| Slot | Source | Rotation | Slot | Source | Rotation | |
|---|---|---|---|---|---|---|
| 00 | original | — | 24 | = 00 | 180° | |
| 01 | original | — | 25 | = 01 | 180° | |
| 02 | original | — | 26 | = 02 | 180° | |
| 03 | = 00 | 90° | 27 | = 00 | 270° | |
| 04 | = 01 | 90° | 28 | = 01 | 270° | |
| 05 | = 02 | 90° | 29 | = 02 | 270° | |
| 06 | original | — | 30 | = 06 | 180° | |
| 07 | original | — | 31 | = 07 | 180° | |
| 08 | original | — | 32 | = 08 | 180° | |
| 09 | = 06 | 90° | 33 | = 06 | 270° | |
| 10 | = 07 | 90° | 34 | = 07 | 270° | |
| 11 | = 08 | 90° | 35 | = 08 | 270° | |
| 12 | original | — | 36 | = 12 | 180° | |
| 13 | original | — | 37 | = 13 | 180° | |
| 14 | original | — | 38 | = 14 | 90° | |
| 15 | = 12 | 90° | 39 | = 12 | 270° | |
| 16 | = 13 | 90° | 40 | = 13 | 270° | |
| 17 | = 14 | 270° | 41 | = 14 | 180° | |
| 18 | original | — | 42 | = 18 | 180° | |
| 19 | original | — | 43 | = 19 | 180° | |
| 20 | original | — | 44 | = 20 | 180° | |
| 21 | = 18 | 90° | 45 | = 18 | 270° | |
| 22 | = 19 | 90° | 46 | = 19 | 270° | |
| 23 | = 20 | 90° | 47 | = 20 | 270° |
The 12 original tiles are: 00, 01, 02, 06, 07, 08, 12, 13, 14, 18, 19, 20.
Tiles 00-02 and 06-08 are the basic edge and corner transitions. Tiles 12-13 are diagonal transitions (upper-left to lower-right, and lower-left to upper-right). Tile 14 is a three-way junction. Tiles 18-20 are the remaining edge combinations.
The challenge is creating textures with perfectly matching borders. Here is one approach:
- Take the texture you want to use (like a grass tile).
- Put that tile into a 128x128 image as a layer.
- Scale that layer to 64x64 and move it to the top-left corner.
- Copy and mirror that layer horizontally, move it to the top-right.
- Copy and mirror vertically, move it to the lower-right.
- Copy and mirror horizontally, move it to the lower-left.
The result will be a visually obvious mirrored image — but it guarantees perfectly fitting edges in all directions.
- Combine the four layers.
- Cut away everything except the 1-pixel border.
- Move the border layer to the top and lock it in place.
Now you have a workspace for your 128x128 textures — you can put any texture content inside and still retain a correct border.
For 256x256 textures, save to a different file, then:
- Resize the canvas to 256x256 (keep everything in the upper-left corner).
- Unlock the border layer.
- Copy the border layer 3 times and arrange the copies at each corner, forming a window-like frame.
- Combine those layers and clear the interior, keeping only the border.
- You now have a matching 256x256 border and can put any content inside.
See tile textures for simpler approaches to creating tiles with correct borders.
Displacement maps are used alongside the diffuse tiles to add geometric micro-detail to the landscape surface. Each tileset has 16 displacement map slots. These are 32x32 grayscale images that work like heightmaps — the landscape geometry is deformed according to the displacement values.
For example, a gravel road texture could have a displacement map that simulates puddle holes or rough patches by actually deforming the terrain mesh.
See tile bank — displacement maps for details on the displacement map format and how they are assigned to tilesets.