Home

Awesome

Custom Materials for Materials Live Wallpaper

Materials that can be imported to Materials Live Wallpaper

Samples

How to create a Custom Material

Create a zip file containing these optional files:

Base color texture a.k.a. Diffuse map

File name: base.<image-format>, for example base.png

An image file representing the base colors. Also known as diffuse map.

Default behavior when base texture is not included: Black texture.

Reflections color texture

File name: reflections.<image-format>, for example reflections.png

An image file representing the color (filter) of reflections in different points. Black color reflects no light, white reflects any light with max brightness, red only reflects the red hue of the lights. Make sure that the sum of base and reflections color at each point is less than or equal to white color.

Default behavior when reflections texture is not included: Black texture.

Normal texture

File name: normal.<image-format>, for example normal.png

An image file that represents the normal vector at each point. Normal vector shows what direction the surface is facing. The y axis is the phone's up direction, x is its right direction and z points to its front (screen) direction, same for Brush texture's x, y and z. Red represents x, Green represents y, Blue represents z. 0 value translates to -1, 128 or 127 to 0, and 255 to 1.

Default behavior when normal texture is not included: A texture filled with (128, 128, 255) or #8080FF (forward direction).

Shininess texture

File name: shininess.<image-format>, for example shininess.png

An image file that represents shininess, the more the shininess, the smaller the reflection radius/size is. This can be in grayscale format (1 byte per pixel).

Default behavior when shininess texture is not included: Black texture (0 value).

Brush texture

File name: brush.<image-format>, for example brush.png

An image file representing brush direction and magnitude at different points. The brush effect doesn't expand the reflection radius, it shrinks it in a specific direction, so try to use less shininess values in the brushed areas. Red represents x, Green represents y, Blue represents z. 0 translates to almost -1 (-1.003921569), 128 to exactly 0, and 255 to almost 1 (0.996078431). It is recommended to use 1 (= 128 - 127) as -1, and 255 (= 128 + 127) as 1.

Default behavior when brush texture is not included: A texture filled with (128, 128, 128) or #808080 (0 vector).

Note: If the brush vector at a point is defined as V, -V has the same effect as V because it's about brushing, so it can be applied both ways.

Brush Intensity texture

File name: brush_intensity.<image-format>, for example brush_intensity.png

An image file representing a number at each point to multiply the brush vector by it. This is used to have more precise brushes, by using more ranges in the brush texture, representing brush directions, and then reducing the brush vector sizes using this texture.

Default behavior when brush intensity texture is not included: A texture filled with (255, 255, 255) or #FFFFFF, or 255 or #FF grayscale value (1 coefficient).

As an example, see CircularBrush.zip located in DefaultMaterials.zip or one of ColorfulCircularBrush_<resolution>.zip, available in samples section and releases.

Depth and height textures

File names: depth.<image-format> and height.<image-format>

Depth represents depth at each point and height represents height. 0 for depth means on screen, 255 is max depth. 0 for height means on screen, 255 is max height. Depth and height intensities can be set in the config file. It is recommended to lower FrameWithParallaxEnabled for higher intensities, unless the edges are tiled and the intensity is low enough. If both depth and height are present, their final values will add up.

Default behavior when either of them are not included: A texture filled with 0 (black).

The FrameWithParallaxDisabled setting is used from the config if neither of the depth/height textures are in the zip for any layer.

Config

File name: config.json

There are these optional fields to set:

See sample_config.json as an example. Note that the name of this file in the zip should exactly be config.json. The values in the sample config file are the default values for the current version.

Resolutions and aspect ratios

Please use 1:1 aspect ratio (width=height) in all of the images, this is to support both portrait and landscape view without rotating the textures 90 degrees. Images can have different resolutions, they will be stretched to match the square, it is recommended to use resolutions that are powers of 2, for example 2048x2048. If the result is not intended to look pixelated, 2048x2048 is enough for 1080p displays, and almost fine for 1440p, 4096x4096 is enough for 4K and 1440p, 1024x1024 is almost fine for 720p.

Layers

Additional layers of each texture can be added to create global illumination or other effects. Maximum allowed number of additional layers is 4, and the default is 2 from v0.4. Each additional layer's file is named like this (1 ≤ number ≤ 4): <texture-name><layer-number>.<image-format>

For example: base.png, reflections.png, base1.png, reflections1.png, normal1.png, shininess1.png, reflections2.png, brush2.png, brush_intensity2.png

Avoid bright base and reflections for the additional layers to prevent an overexposed look. The blending mode used is additive, that means the resulting color in a pixel is the sum of all the colors in all layers in that pixel.

Users might allow a limited number of additional layers or turn them off, so prioritize on what to put in the main layer and the additional layers. The main layer (rendered from the files without numbers) is always shown. For additional layers, the less the layer's number, the more likely it's going to be shown.

Where to share custom materials

You can create an issue to include links to pages here.

Changelog