REGARDING TEXTURES

File Extensions for Graphics

If you are uploading in CTR, the file extensions you can use are:.jpg & .gif ... & no others.

• * * * * * * * * * * * * * * * * * * *

.jpg

This is perhaps the most commonly used of the graphics extensions. The most frequently cited drawback of them is that they do tend to 'bleed' or 'blur' pixels when saved. You can, however, achieve reasonable file sizes with them; the color range is complete ( 24 or 48 bit True Color ); &, depending on your graphics programme, you can save them at percentages of their full quality or even save them with methods that will guarantee high levels of non-distortion.

• * * * * * * * * * * * * * * * * * * *

.gif

This extension has a limited palette of 256 colors; when saved does render with no or very little distortion; & typically yields the smallest of the file sizes possible owing to the limited palette. It is also possible to make some portions of your texture transparent ( usually done at the point when you are saving your texture ). The drawback of it is that it often produces a very pixelly texture. If you use it carefully however, it does have its applications.

• * * * * * * * * * * * * * * * * * * *

QUICK TIPS :

1. It can happen that CAPITALIZING the file extensions ( eg. .JPG or .JPEG ) will cause the texture not to appear on the object, so the safest method of saving your textures is to simply refrain entirely from using any CAPS in any part of your texture filename.
2. When making textures that include transparency, take the time to reopen the texture file in your graphics programme & clean up the pixels that are producing visual dirt. When making these graphics, it's common for some of what you think is a perfectly solid color to turn just a little 'off' & when you go to save the texture with transparency those slightly 'off' pixels will remain on the texture. At times, it takes a lot of work to create a really good texture but the end result will more than justify the time spent :)
3. There is one other option for saving a .jpg & that is to save it as a grey-scale texture & apply color to it using material color. In my experiments with this method, it has not produced the greatest of results but you should bear it in mind for some applications ( like grass or some walls ). The colors do tend to be highly active using this method however, displaying at full color at some angles of viewing & not at others.

• * * * * * * * * * * * * * * * * * * *

Basic VRML Coding for Textures

Adding texture to your object is part of the appearance node in the coding, the same as material is. Here is what the coding looks like:

texture ImageTexture { url "yourtexture.jpg" }}

In this example, we have taken the second bracket that would have finished material as part of the appearance node ( if we weren't using a texture ), & moved it to the end of the texture coding instead ( since texture is also part of the appearance node ). Here's what the appearance node coding looks like now:

appearance Appearance {
material Material {}
texture ImageTexture { url "yourtexture.jpg" }}

QUICK TIP : Coding your texture onto an object using just this coding is going to put a SINGLE instance of your texture on each facet of the object. Each of the basic shapes is going to do this in a different way. For a Box, one copy of the texture will appear on each of the 6 sides. For a Cylinder, the rounded side will take one copy all the way around, while the top & bottom will have a distorted instance of only part of the texture on it. For a Sphere, one copy of your texture will be applied all the way around & from top to bottom so there will be distortion at the top & bottom ends & likely some distortion around the middle as well. And for a Cone, what happens on the bottom is the same as for a Cylinder, & what happens at the top is the same as for a Sphere - a lot of distortion.

• * * * * * * * * * * * * * * * * * * *

textureTransform TextureTransform

TextureTransform is the appearance coding we use to manipulate texture on surfaces. There are a number of attributes within TextureTransform that you can use. Here's an example of the coding :

textureTransform TextureTransform { rotation X center X X scale X X }

rotation - place a single rotational number here, for example 1.57 ( a quarter turn to the right ) or -3.14 ( a half turn to the left ) or others center - these numbers will specify the centerpoint of the texture you wish to use. The 1st X represents a number on the horizontal axis, the 2nd X a number on the vertical axis. scale - here the 1st X represents the number of instances of your texture you wish to have appear on the horizontal axis, the 2nd X represents the number of instances of your texture you wish to have appear on the vertical axis.

The possibilities for manipulating your texture & producing completely different results is endless. This is one of the areas you will want to experiment & play with. It's a whole lot of fun to see what you can make happen!

Here is what we have for coding on a box now :

Transform { translation -1.5 0 -10 children [
Shape { appearance Appearance { material Material {}
texture ImageTexture { url "extension1.jpg" }
textureTransform TextureTransform { scale 2 2 }}
geometry Box { size 1 1 1 }}
]}

QUICK TIP : If you code scale with 0.001 0.001 you will be isolating the bottom left pixel on your texture. This is a useful pixel for coding solid-colored objects & you might sometimes want to purposely color this pixel with a color you want to use somewhere on an object or world you don't want to ( or can't in the case of Mall objects ) upload a separate texture for.

• * * * * * * * * * * * * * * * * * * *

Pixel Texture

PixelTexture is a method of applying a pattern to your object without needing a separate texture. There are two methods of coding PixelTexture.

For the first method, color is achieved using material color. Here's the coding ( make sure when you are using this coding to line the lines up as you see them here - if you copy/paste them they may not line up properly ) :

texture PixelTexture { image 2 2 1
0x44 0x88
0x88 0x44 }

Here's how PixelTexture works : the 1st two numbers after the word 'image' define the number of rows & columns. The 3rd number defines a series of effects that can be added, for example, transparency. The number configurations ( eg. 0x44 ) are based on the hexadecimal color system ( unlike material color, which is based on the RGB color system ). The 0x part never changes. The numbers & letters after the x define the lightness/darkness with lower numbers being darker & higher numbers being lighter. The hexadecimal system goes from dark to light in this progression :

0 3 6 9 C F ( yes, there are letters as well )

And you can use any pairing of numbers between 0 & 9.

Basically what we are doing when we use this kind of PixelTexture is creating a greyscale pattern on which we add material color.

QUICK TIP : Since PixelTexture usually just generates a small piece of patterning, use TextureTransform coding to apply scale to it. As an example, have a look at the 'Evergreen Topiary' in the club.

Here's an example of this kind of coding :

Transform { translation 0 0 0 children [
Shape { appearance Appearance {
material Material { diffuseColor 0.5 0 0 }
texture PixelTexture { image 2 2 1
0x64 0x68
0x68 0x64 }
textureTransform TextureTransform { scale 5 5 }}
geometry Box { size 1 1 1 }}
]}

In the second method of coding PixelTexture, we use the HEX CODE for color which allows us to accurately specify the actual color of a pixel. With this method we can also create elaborate texuture maps, thus allowing us to use more than one texture in an object. An example of this would be the flooring, wall tiles, shower curtain & towels in the beige & blue 'Grand Bathroom' which you can have a look at in the club. This coding can be quite complex but again, worth the effort. Here's what its PixelTexture coding for the floor looks like :

Transform { translation 0 -1.75 0 children [
Shape { appearance Appearance { material Material { emissiveColor 0.3 0.3 0.3 }
texture PixelTexture {
image 12 12 3
0xccb27a 0xccb27a 0xccb27a 0xccb27a 0xccb27a 0xccb27a 0xccb27a 0xccb27a 0xccb27a 0xccb27a 0xccb27a 0xccb27a
0xccb27a 0xccb27a 0xccb27a 0xccb27a 0xccb27a 0xccb27a 0xccb27a 0xccb27a 0xccb27a 0xccb27a 0xccb27a 0xccb27a
0xccb27a 0xccb27a 0x6885c2 0x6885c2 0x6885c2 0x6885c2 0x6885c2 0x6885c2 0x6885c2 0x6885c2 0x6885c2 0x6885c2
0xccb27a 0xccb27a 0x6885c2 0x6885c2 0x6885c2 0x6885c2 0x6885c2 0x6885c2 0x6885c2 0x6885c2 0x6885c2 0x6885c2
0xccb27a 0xccb27a 0x6885c2 0x6885c2 0xd6c29f 0xd6c29f 0xd6c29f 0xd6c29f 0xd6c29f 0xd6c29f 0xd6c29f 0xd6c29f
0xccb27a 0xccb27a 0x6885c2 0x6885c2 0xd6c29f 0xd6c29f 0xd6c29f 0xd6c29f 0xd6c29f 0xd6c29f 0xd6c29f 0xd6c29f
0xccb27a 0xccb27a 0x6885c2 0x6885c2 0xd6c29f 0xd6c29f 0xacb9b6 0xacb9b6 0xacb9b6 0xacb9b6 0xacb9b6 0xacb9b6
0xccb27a 0xccb27a 0x6885c2 0x6885c2 0xd6c29f 0xd6c29f 0xacb9b6 0xacb9b6 0xacb9b6 0xacb9b6 0xacb9b6 0xacb9b6
0xccb27a 0xccb27a 0x6885c2 0x6885c2 0xd6c29f 0xd6c29f 0xacb9b6 0xacb9b6 0xa48263 0xa48263 0xa48263 0xa48263
0xccb27a 0xccb27a 0x6885c2 0x6885c2 0xd6c29f 0xd6c29f 0xacb9b6 0xacb9b6 0xa48263 0xa48263 0xa48263 0xa48263
0xccb27a 0xccb27a 0x6885c2 0x6885c2 0xd6c29f 0xd6c29f 0xacb9b6 0xacb9b6 0xa48263 0xa48263 0xa48263 0xa48263
0xccb27a 0xccb27a 0x6885c2 0x6885c2 0xd6c29f 0xd6c29f 0xacb9b6 0xacb9b6 0xa48263 0xa48263 0xa48263 0xa48263 }
textureTransform TextureTransform { scale 20 20 rotation 0.785 }}
geometry Extrusion { beginCap FALSE endCap TRUE solid FALSE
crossSection [ -4.8 -0.2, -4.8 -9.8, 4.8 -9.8, 4.8 -0.2, -4.8 -0.2, ]
spine [ 0 0 0, 0 0 0, ]
scale [ 1 1, 1 1, ]}}
]}

The hex codes for colors are typically available in a graphics programme. There are also extensive charts of colors you can explore online, good to use when you are looking for a specific color, for example - the color of an egg yolk. You can also use this coding for a single instance of a special color you need to achieve. I often do this because any kind of texture ( image or pixel ) is more stable than material color :

image 1 1 3
0xccb27a }}

In this case, you don't need the textureTransform line so you need to add that second bracket at the end of the hex code.

QUICK TIP : It's not too difficult to plot a pattern map if you use graph paper.

• * * * * * * * * * * * * * * * * * * *

COPRIGHT & TEXTURES

The bottom line where copyright is concerned is that the best & safest thing to do is to make your own textures. The next best thing is to use a Universal Media texture as these are available precisely for use in building objects & worlds ( NOTE: Universal Media textures are not meant to be used as tubes for paintings ). And finally, the last best thing is to use textures created by someone else BUT ONLY if you have their express ( ie. written ) permission to do so ! Do take the time to hunt around collection websites to find copyright information because, as 'they' say, 'ignorance is no excuse in the face of the law' !

Using textures you acquire from texture collection websites that SAY the textures are copyright-free ( HA HA ), or SAY they're not sure where they came from but are happy to remove any of them if the originator asks them to, or SAY that the textures are all theirs ( and you've seen them on another similar website ), OR SAY the textures are theirs & with written permission you can use them ( AND YOU DON'T TAKE THE TIME TO GET THAT PERMISSION ), is a very risky thing to do.

Personally I have found artists on the net very approachable & very reasonable with regard to obtaining permission on those occasions when I've sought it ( not for VRML-related work but for website design & other personal purposes ). And besides, playing safe & contacting the artist can also make fresh contacts & even friends for you :)

The best thing to do if you are serious about this artform is not to jeopardize your reputation & your possibilities by stealing the work of others. And no hotlinking textures from external sites either :) No hotlinking of anything in CTR !

But what about AI generated art? It's best to think of an AI generator AS an artist from whom permission is required. Each such site would have its own rules in this regard so have a careful look at their requirements. Some will permit personal use but this information must also be included in your WorldInfo with wording something like this:

"The image is AI generated at ( name the site ) in ( month & year )" "Its Intellectual Property Rights are transferred to me to use for personal purposes"

It's not necessary to include any of this info on your thumb/2d pic, nor should you be signing the art since it's not your own !