Full Screen - Cloud Travel

Example 1

Tap Clouds

3D cloud scene designed for full screen 3D display, with frame saving. Tap to view frame by frame. Print screen to save a frame. Each cloud scene renders slightly different results with shader code modifications or different image uploads.

This WebGL shader project simulates the effect of moving through the clouds with fog, motion, and perspective in three dimensions. The project applies GLSL shaders while blending two cloud texture maps.

Frame Savers

WebGL 3D full screen examples. Tap to move frame by frame. These projects allow you to see details up close.

Simple Shaders: Learn WebGL Book 4

Learn the basics of WebGL shader programming with Simple Shaders: Learn WebGL Book 4. This book covers seven projects with unique shaders, in detail, providing an overview of GLSL (OpenGL Shading Language), which is the shader language used for WebGL. See the following projects online Spotlight Across Text, Radiating Colors, Cube Vertex Colors, Color Filters, Zoom Shader, Spotted Balloon Bursts and Colors Fade. Most shaders activate as you swipe over the canvas. See various visual effects including color animation, zooming, color filters, a traveling spotlight and expanding mesh.

Simple Shaders explains how to prepare basic WebGL GLSL shaders. This new Kindle book includes detailed instruction and links to many interesting WebGL shader examples online. Learn to program WebGL shaders. Harness the power of the Graphics Processing Unit (GPU).