Home » WebGL Introduction: For Designers and Developers by A. Butler
WebGL Introduction: For Designers and Developers A. Butler

WebGL Introduction: For Designers and Developers

A. Butler

Published September 9th 2014
ISBN :
Kindle Edition
158 pages
Enter the sum

 About the Book 

WebGL provides the ability to display hardware accelerated (fast) interactive 2D and 3D animated graphics online. WebGL offers the opportunity to post games, animation, scientific simulation, interactive presentations, and other graphic intensive WebMoreWebGL provides the ability to display hardware accelerated (fast) interactive 2D and 3D animated graphics online. WebGL offers the opportunity to post games, animation, scientific simulation, interactive presentations, and other graphic intensive Web pages.We believe WebGL represents the future for online 3D media and games. Current Windows PCs, Macintosh OS X Yosemite, Android with Firefox browser, Windows Phone 8.1, and iPhones with iOS 8 and proper hardware, support WebGL. As of fall 2014, iPhone 6 displays WebGL online content.Thats big news for Web developers and designers. Soon all major mobile devices and operating systems will have the ability to display WebGL 3D games and media online. WebGL appears ready to change the Web significantly.WebGL Introduction explains fundamental concepts of WebGL with a simple process which starts with a triangle, and progresses to multiple moving, rotating, colored squares. We provide an introduction to WebGL, as a foundation for future projects.We discuss how to display a triangle, a square plane, multiple square planes, change colors, move, then rotate squares around the X, Y and Z axes. We discuss the WebGL JavaScript API, shader functions, and properties, required for each project. We explain how to prepare, compile, and link two vertex shaders and a simple fragment shader.We explain some common matrix transformation functions. The transformations include moving and rotating a mesh. We discuss vertex buffer objects.If those terms seem new to you, then WebGL Introduction offers helpful instruction.We dont discuss lighting, textures, complex models, or other more advanced topics. Index buffers are recommended for future reading.We avoided reliance on external JavaScript libraries as much as possible. Our goal is to help the reader understand WebGL itself, rather than prepared libraries. Then you can use external code with confidence, understanding why and what they do.We assume the reader understands basic HTML markup and JavaScript. The book includes source code listings while discussing each project. The full source code is available for download, as well.The projects include:1. Display a WebGL triangle.2. Learn to display a WebGL square plane.3. Interactively change colors on the square plane.4. Rotate the square plane.5. Rotate two intersecting square planes.6. Animate, rotate, and dynamically change colors, on five square planes.WebGL Introduction: For Designers and Developers provides a starting point, for aspiring 3D developers.The projects provided with WebGL Introduction were tested with Android devices running the Firefox browser, iPhone 6, Windows Phone 8.1, Windows Vista PC with Google Chrome browser, and Windows 8.1 PC with Internet Explorer 11, Firefox, and Google Chrome browsers. All examples worked well on those devices and browsers.