There are a lot of apps with similar, or common functions, but just a few ones have little or more unique features. I'm happy to have downloaded, and used one of them. 
 A few days ago, I introduce to us [**BinaryEye**](https://steemit.com/utopian-io/@rufans/binaryeye--create-recreate-and-scan-barcodes-and-qrcodes); A project by Markus Fisch. Today's project is also from the same developer. And, he titled it [ShaderEditor]( https://github.com/markusfisch/ShaderEditor).

---


### Introduction To GLSL Shaders

OpenGL Shading Language, is a high-level shading language with a syntax based on the C programming language.<Sup>[Wikipedia](https://en.wikipedia.org/wiki/OpenGL_Shading_Language)<Sup/>

Shaders use GLSL (OpenGL Shading Language), a special OpenGL Shading Language with syntax similar to C. GLSL is executed directly by the graphics pipeline. If you are willing to read more on this topic, kindly visit this blog post [GLSL Shaders
](https://developer.mozilla.org/en-US/docs/Games/Techniques/3D_on_the_web/GLSL_Shaders).

---

### What Exactly Is [ShaderEditor]( https://github.com/markusfisch/ShaderEditor)?

![vec4.png](https://cdn.steemitimages.com/DQmRRZ4FrckkCoTCrv8hhNuwAeSUJGELjJQhToNTUYBQM63/vec4.png)

 After I reviewed the first project from markusfisch, then I realized how brilliant he is. In fact, I wasn't scared if I was gonna be disappointed after I knew he's the developer behind ShaderEditor. 

[ShaderEditor]( https://github.com/markusfisch/ShaderEditor) Is simply an Android application used for editing Shaders. In other words, [ShaderEditor]( https://github.com/markusfisch/ShaderEditor) is an IDE for OpenGL Shading Language. 
I never knew how powerful  [ShaderEditor]( https://github.com/markusfisch/ShaderEditor) is for over 2months, untill some days ago, when  I decided to understand its functionalities.

It an editor with a Shaders compiler embedded into it. It can still be regarded as a lightweight app because of its size (1mb of size). 


Apart from seamlessly writing your lines of instructions, you can as well set your program output as your Android live wallpaper. This is done after you've successfully verified that your codes are of no errors. Just in case you are wondering, how can that be achieved? Keep calm, because you don't have to download another software to verify your codes. Code verification is the same as running your codes to confirm that there are no errors. 

---

### My Personal Experience With [ShaderEditor]( https://github.com/markusfisch/ShaderEditor)

<br>

[ShaderEditor]( https://github.com/markusfisch/ShaderEditor) is developed in such a way that, it won't look weird to its first-time users. Immediately after installation, users are provided with a sample code known as **Default**. The sample can be read, or edited.  The ability to allow users to read, and write on default code is awesome.  I love this feature so much because, it gives users with, or without programing knowledge the ability to play with the codes. 
The first time I open it, I messed up with codes, but, there's an option to re-load the codes. That's another great feature there.

 It is common on most  IDEs, to write codes first before running it. But, [ShaderEditor]( https://github.com/markusfisch/ShaderEditor) made things easier by providing an option to enable auto compile, and also  toasts  any detected errors.  It is certain that, not everyone would love this feature, which is why the developed had provided an option to disable the auto run feature.

### How Does A Shader Code Look Like?

From the definition given at the beginning of this article, Shader codes is similar to a C programming language. For an example, the codes below are the codes from the **default file** that opens immediately after launching [ShaderEditor]( https://github.com/markusfisch/ShaderEditor). 

<div class="pull-left">

![](https://i.imgur.com/M3R4WNx.png)

</div>

<div class="pull-right">


```

#ifdef GL_FRAGMENT_PRECISION_HIGH
precision highp float;
#else
precision mediump float;
#endif

uniform float time;
uniform int pointerCount;
uniform vec3 pointers[10];
uniform vec2 resolution;

void main(void) {
	float mx = max(resolution.x, resolution.y);
	vec2 uv = gl_FragCoord.xy / mx;
	vec3 color = vec3(
		uv,
		0.25 + 0.5 * sin(time) );

	for (int n = 0; n < pointerCount; ++n) {
		vec3 hole = vec3(sin(1.5 - distance(
			uv,
			pointers[n].xy / mx) * 8.0));

		color = mix(color, hole, -0.5);
	}

	gl_FragColor = vec4(color, 1.0);
}



```


</div>

<hr>

<br>



The app, and the sample codes displays are beautiful. I don't see any reason why any user have to dislike the app appearance. 
Well, I don't know if I found it friendly because of the knowledge I already had in  C programming .  Shader codes are easier, and powerful than some other programming languages. That is the honest truth I found out after using it.

The codes above are sample codes which transist between different colors. Check the Gif below for its output.


<div class="pull-left">

![1k6ykt6mwv.gif](https://img.esteem.ws/1k6ykt6mwv.gif)



</div>


<div class="pull-right">


![](https://i.imgur.com/ULi8XMr.png)


</div>

---


The list of options you get when you click on the 3dots from app, is similar to the options you get from common text editing apps. 
The uncommon features are:
* Update Wallpaper
* Load samples.

###  Update Wallpaper

<br>

One of the unique features of this app is, the ability to set your programmed shader as your wallpaper.  If you're a programmer, and would love a custom animated wallpaper for your device, then, ShaderEditor is the best app to use.

  I was able to play around with the default codes.  For example, here is a sample code titled **Circles**, and how I decided to edit it to my preferred version. 

---



<div class="pull-left">


### Default version


```

uniform vec2 resolution;
uniform float time;

void main(void) {
	float mx = max(resolution.x, resolution.y);
	vec2 uv = gl_FragCoord.xy / mx;
	vec2 center = resolution / mx * 0.5;
	float t = time * 10.0;

	gl_FragColor = vec4(
		vec3(sin(t - distance(uv, center) * 255.0)) * 0.2,
		1.0);
}


```

</div>




<div class="pull-right">


### My version

```

uniform vec2 resolution;
uniform float time;

void main(void) {
	float mx = max(resolution.x, resolution.y);
	vec2 uv = gl_FragCoord.xy / mx;
	vec2 center = resolution / mx * 1.0-10.0;
	float t = time * 10.0 + 4.0;

	gl_FragColor = vec4(
		vec3(sin(t - distance(uv, center) * 200.0)) * 0.2,
		1.0);
}


```

</div>







---

## Result

<div class="pull-left">

### Default version

![qw6sl1j5y7.gif](https://img.esteem.ws/qw6sl1j5y7.gif)

</div>


<div class="pull-right">

#### My version

![gdl3cb20zg.gif](https://img.esteem.ws/gdl3cb20zg.gif)


</div>

---

### Load Samples

 If you're not a programmer, or you don't know how to play with the codes, but you would love to use a different style of sample codes for your wallpaper, then, you should make use of the **Load sample** option to load other samples. The option has 9 different samples of codes to pick from.
![](https://i.imgur.com/elS5fOg.png)


### ShaderEdittor Vs Others


I searched thoroughly on Playstore for the best application to compare with ShaderEdittor, and I found **Photoshade**.  Although, it doesn't  have the feature to set code outputs as wallpaper. Also, **Photoshade** is filled with ads which isn't available on ShaderEdittor.

<div class="pull-left">

![Screenshot_20190412-001140.png](https://cdn.steemitimages.com/DQmVjEb5FUEJzTfxZ9eFSTFvTrcv4naYzg529j7oDRrMTJM/Screenshot_20190412-001140.png)

</div>

<div class="pull-right">

![Screenshot_20190412-002331.png](https://cdn.steemitimages.com/DQmWiHMoNQje5cggo6sKpvGkzXdNh9Mhbn88BNhaGbBZDU8/Screenshot_20190412-002331.png)

</div>



## ShaderEdittor Project Update

The project owner isn't  active on this project, as the last update was 3rd of February 2019 with V2.16.0. Also, there isn't any upcoming release, as there's no any latest code update, or features request.


## Conclusion

GLSL Shaders isn't meant for only wallpapers. ShaderEditor is only an editor that adds to the usage of GLSL Shaders. GLSL Shaders is mainly meant for Game development. 
ShaderEditor has been able to make it easier for game developers to develop 2D type of animation on the go. Also, ShaderEditor  is useful for non-programmers as its an interface to set animated displayes as theirwallpapers. 

Try the sample codes, and comment here with what you did with it. I'm waiting ...