Step-by-step guide through the abstract and complex universe of Fragment Shaders.

Overview

The Book of Shaders

by Patricio Gonzalez Vivo and Jen Lowe

This is a gentle step-by-step guide through the abstract and complex universe of Fragment Shaders.

Contents

About the Authors

Patricio Gonzalez Vivo (1982, Buenos Aires, Argentina) is a New York based artist and developer. He explores interstitial spaces between organic and synthetic, analog and digital, individual and collective. In his work he uses code as an expressive language with the intention of developing a better together.

Patricio studied and practiced psychotherapy and expressive art therapy. He holds an MFA in Design & Technology from Parsons The New School, where he now teaches. Currently he works as a Graphic Engineer at Mapzen making openSource mapping tools.

Jen Lowe is an independent data scientist and data communicator at Datatelling where she brings together people + numbers + words. She teaches in SVA's Design for Social Innovation program, cofounded the School for Poetic Computation, taught Math for Artists at NYU ITP, researched at the Spatial Information Design Lab at Columbia University, and contributed ideas at the White House Office of Science and Technology Policy. She's spoken at SXSW and Eyeo. Her work has been covered by The New York Times and Fast Company. Her research, writing, and speaking explore the promises and implications of data and technology in society. She has a B.S. in Applied Math and a Master's in Information Science. Often oppositional, she's always on the side of love.

Acknowledgements

Thanks Scott Murray for the inspiration and advice.

Thanks Kenichi Yoneda (Kynd), Nicolas Barradeau, Karim Naaji for contributing with support, good ideas and code.

Thanks Kenichi Yoneda (Kynd) and Sawako for the Japanese translation (日本語訳)

Thanks Tong Li and Yi Zhang for the Chinese translation (中文版)

Thanks Jae Hyun Yoo and June Kim for the Korean translation (한국어)

Thanks Nahuel Coppero (Necsoft) for the Spanish translation (español)

Thanks Raphaela Protásio and Lucas Mendonça for the Portuguese translation (portugues)

Thanks Nicolas Barradeau and Karim Naaji for the French translation (français)

Thanks Andrea Rovescalli for the Italian translation (italiano)

Thanks Michael Tischer for the German translation (deutsch)

Thanks Sergey Karchevsky for the Russian translation (russian)

Thanks Andy Stanton for fixing and improving the pdf/epub export pipeline

Thanks to everyone who has believed in this project and contributed with fixes or donations.

Get new chapters

Sign up for the news letter or follow it on Twitter

Enter your email address

LICENSE

Copyright (c) Patricio Gonzalez Vivo, 2015 - http://patriciogonzalezvivo.com/ All rights reserved.

Issues
  • Can't make PDF on MacOS El Capitan 10.11.6

    Can't make PDF on MacOS El Capitan 10.11.6

    Hi,

    I've been struggling with the process of making a PDF out of the repo. I followed every steps described on the appendix 'How to print this book' and still can't make it work. Any help appreciated. Thanks

    Occurring right after the making of the shader images:

    Generating ./book.pdf from: ./00/tmp.md ./01/tmp.md ./02/tmp.md ./03/tmp.md ./04/tmp.md ./05/tmp.md ./06/tmp.md ./07/tmp.md ./08/tmp.md ./09/tmp.md ./10/tmp.md ./11/tmp.md ./12/tmp.md ./13/tmp.md ./14/tmp.md ./15/tmp.md ./16/tmp.md ./17/tmp.md ./18/tmp.md ./appendix/tmp.md ./examples/tmp.md ./glossary/tmp.md Using the following flags: -N --smart --no-tex-ligatures --toc --standalone --preserve-tabs -V documentclass=scrbook -V papersize=a4 -V links-as-note -S --latex-engine=xelatex Traceback (most recent call last): File "src/parseBook.py", line 107, in <module> returnCode = subprocess.call(texPandocCommand) File "/System/Library/Frameworks/Python.framework/Versions/2.7/lib/python2.7/subprocess.py", line 522, in call return Popen(*popenargs, **kwargs).wait() File "/System/Library/Frameworks/Python.framework/Versions/2.7/lib/python2.7/subprocess.py", line 710, in __init__ errread, errwrite) File "/System/Library/Frameworks/Python.framework/Versions/2.7/lib/python2.7/subprocess.py", line 1335, in _execute_child raise child_exception OSError: [Errno 2] No such file or directory make: *** [all] Error 1

    opened by benhdkn 8
  • safari web content

    safari web content

    Hello - Every time I pull up GLSL Editor, Safari Web Content crashes. This is a recent predicament. Whenever I attempted opening in Chrome, it opened up but the editor started flashing blue.

    opened by niteswim 8
  • Create a TravisCI configuration to check PDF building of the book

    Create a TravisCI configuration to check PDF building of the book

    I worked a bit on this last night and now I am facing a dilemma and I would like your opinion @patriciogonzalezvivo:

    This configuration is quite simple, I just have to build glfw and glfwViewer by hand because these two programs are not available in the standard Ubuntu Trusty repositories, which is the distribution used by default by Travis CI.

    And I have to add texlive-latex-recommended texlive-latex-extra texlive-fonts-recommended to the dependencies to avoid the following two problems:

    Successful building of ./book.tex
    pandoc: Error producing PDF from TeX source.
    ! Font T1/cmr/m/n/10=ecrm1000 at 10.0pt not loadable: Metric (TFM) file or inst
    alled font not found.
    <to be read again> 
                       relax 
    l.100 \fontencoding\encodingdefault\selectfont
    Error in building of ./book.pdf
    
    Successful building of ./book.tex
    pandoc: Error producing PDF from TeX source.
    ! LaTeX Error: File `etoolbox.sty' not found.
    Type X to quit or <RETURN> to proceed,
    or enter new name. (Default extension: sty)
    Enter file name: 
    ! Emergency stop.
    <read *> 
    l.8 \RequirePackage
    Error in building of ./book.pdf
    

    So maybe it might be a good idea to add them to the Raspberry Pi section of the Appendix because I'm pretty sure these packages are needed and are not delivered by default with Raspbian ...

    And now after fixing these issues, I'm stuck with the following error:

    Successful building of ./book.tex
    pandoc: Error producing PDF from TeX source.
    ! Unable to load picture or PDF file './04/glslEditor-01.gif'.
    <to be read again> 
                       }
    l.722 \includegraphics{./04/glslEditor-01.gif}
    Error in building of ./book.pdf
    

    Yes, it is somewhat obvious that the GIF image format can not be used by the XeTeX PDF output engine.

    It is therefore necessary to choose between:

    • convert all the .gif to .png in the parseBook.py script with something like iconv,
    • or use a Latex package like movie9 to include animations in the PDF (I'm not sure my Kindle reader can handle this).

    What do you think I should do?

    Thank you,

    opened by yvan-sraka 6
  • "More" link on examples page is broken

    Hi, Thanks for the book of shaders, it is fantastic :)

    I found a missing link -

    To reproduce go to the page below and click "more"

    http://patriciogonzalezvivo.com/2015/thebookofshaders/examples/

    opened by stuaxo 6
  • [WIP] Update Appendix 2 with a FAQ following issues #12 & #13

    [WIP] Update Appendix 2 with a FAQ following issues #12 & #13

    Hello,

    Because I wrote "by @cansik and @MartinRGB", I need your opinion on what I copied from issues #12 and #13!

    I also think we need to remove some content because some problems are now automatically corrected by the /src/parseBook.py script or can be easily corrected by it. But we need to keep the explanations on what this script does and what dependencies need to be installed depending on the version of MacOSX.

    opened by yvan-sraka 5
  • PDF build fails with xelatex missing on OSX

    PDF build fails with xelatex missing on OSX

    Creating this PDF is really not for beginners. I started with my last post #12 . Now let's try to really build a pdf out of the .text file.

    The simple way

    Waiiiiit, maybe you just want that pdf, doesn't matter if you built it your own! So please choose the simple way and download it from here:

    The Book Of Shaders PDF

    The pain way

    Install xelatex

    The parseBook.py always told me:

    Successful building of ./book.tex
    pandoc: xelatex not found. xelatex is needed for pdf output.
    Error in building of ./book.pdf
    

    I couldn't find xelatex on brew so I asked google and google said, port it (it's a monster package):

    sudo port install texlive-xetex
    

    Fix latex imports

    After installing it, let's try the building again:

    Successful building of ./book.tex
    pandoc: Could not find image `matrixes.png', skipping...
    pandoc: Could not find image `warmerdam.jpg', skipping...
    pandoc: Could not find image `tartan.jpg', skipping...
    pandoc: Could not find image `ryoji-ikeda.jpg', skipping...
    ! LaTeX Error: File `lmodern.sty' not found.
    
    Type X to quit or <RETURN> to proceed,
    or enter new name. (Default extension: sty)
    
    Enter file name: 
    ! Emergency stop.
    <read *> 
    
    l.3 \usepackage
    
    pandoc: Error producing PDF from TeX source
    Error in building of ./book.pdf
    

    Thank you University of Nebraska-Lincoln because they were hosting the lmodern.sty. Now building again:

    ! LaTeX Error: File `etoolbox.sty' not found.
    

    Fix it with ctan.org/.../etoolbox and run it again...

    Fix Font support

    ! Font EU1/lmr/m/n/10=[lmroman10-regular]:mapping=tex-text at 10.0pt not loadable: Metric (TFM) file or installed font not found.
    

    Ok..come on! -.-

    sudo port install texlive-fonts-recommended
    

    Fix bad parsing in .tmp files

    Wuhu, the font is now installed...but:

    pandoc: Could not find image `matrixes.png', skipping...
    pandoc: Could not find image `warmerdam.jpg', skipping...
    pandoc: Could not find image `tartan.jpg', skipping...
    pandoc: Could not find image `ryoji-ikeda.jpg', skipping...
    ! Unable to load picture or PDF file 'matrixes.png'.
    <to be read again> 
                       }
    l.2654 .../Matrix}{\includegraphics{matrixes.png}}
    

    So maybe we have to care about the skipped files. Looks like there is something wrong..(or it's me not able to read md..) (maybe again a parsing error) (I'll fix this later...):

    [![Wikipedia entry for Matrix (mathematics) ](matrixes.png)](./08/https://en.wikipedia.org/wiki/Matrix)
    

    Change it to in the relevant .tmp file in the chapter folders:

    [![Wikipedia entry for Matrix (mathematics) ](./08/matrixes.png)](https://en.wikipedia.org/wiki/Matrix)
    

    Do this for every file which is skipped at the beginning! Now build it again...

    Tadaaaaaaaaa! We've built the book of shaders! It's not perfect, some images overlay the text, but it's finally done.

    Maybe we should write a book about building the book of shaders...

    opened by cansik 5
  • Unable to load picture or PDF file 'matrixes.png'

    Unable to load picture or PDF file 'matrixes.png'

    Hello there,

    I am trying to compile the book into a pdf but I am getting the following error:

    Successful building of ./book.tex pandoc: Could not find image `matrixes.png', skipping... ! Unable to load picture or PDF file 'matrixes.png'. } l.2658 .../Matrix}{\includegraphics{matrixes.png}}

    pandoc: Error producing PDF from TeX source Error in building of ./book.pdf

    Any advice on how to solve it, would be truly appreciated. Thank you.

    Paulo

    opened by pauloguerraf 5
  • OSX: book export is broken

    OSX: book export is broken

    On osx, when I follow the tutorial to generate book (pdf...), It failed :

    `$ make

    rm -rf */tmp.md
    rm -rf */tmp*.png
    rm -rf book.*
    python2.7 src/parseBook.py  -f tex -f pdf -f epub
    glslViewer ./02/hello_world.frag --s 0.5 --headless -o ./02/tmp-hello_world.png
    Error watching for file 0.5
    Error watching for file ./02/tmp-hello_world.png
    

    Also python 2.7 is dead on homebrew :(

    System info : MacBook Pro (13-inch, 2018, Four Thunderbolt 3 Ports) 10.15.7

    opened by xeonarno 4
  • Add support for building book in epub format

    Add support for building book in epub format

    Add epub metadata & placeholder cover image Refactor parseBook.py and extend Makefile to enable support for more formats Update appendix 2 Add book.epub to .gitignore

    Fixes #229

    opened by andystanton 4
  • A patch for the Japanese translation

    A patch for the Japanese translation

    Hello,

    This is a small patch for the Japanese translation in chapter 11. I changed some mathematical expressions in Japanese.

    ... with a quintic interpolation curve ( f(x) = 6x^5-15x^4+10x^3 )

    The "4次エルミート曲線" is not a correct translation of "quintic interpolation curve". I think that "5次式の曲線" would be better.

    Thanks.

    opened by Keyaki-v 4
  • changing the code from examples

    changing the code from examples

    If you are reading this book in a browser the previous block of code is interactive. That means you can click and change any part of the code you want to explore. Changes will be updated immediately thanks to the GPU architecture that compiles and replaces shaders on the fly. Give it a try by changing the values on line 6.

    I can see the code using devtools, but I guess that's not the idea :) What am I missing?

    opened by moleike 4
  • needed a null check in parsedown.php

    needed a null check in parsedown.php

    Love the project, all the best:

    $line was null, which hurt my php.
    So, my fix: line num #144 in Parsedown.php: foreach ($parts as $part) { $lineLength=0; if ($line) { $lineLength = mb_strlen($line, 'utf-8'); } $shortage = 4 - $lineLength % 4;

    $line .= str_repeat(' ', $shortage);
    $line .= $part;
    

    }

    opened by unmodify 0
  • Question about license

    Question about license

    I read the license file and I just wanted to ask for a clarification if this also applies to all the code samples. It sounds like it wouldn't even allow for copying the code samples to play around with them, much less reuse them in another project. I'm looking for some shader code I can use in a GPL v2 project. Is it fair to say that the code samples in the book of shaders are a no-go then?

    opened by TomArrow 3
  • [ES] Referencia a linea debe ser actualizada

    [ES] Referencia a linea debe ser actualizada

    Since this is the spanish file I guess I can write in spanish, but lmk if you need a english explanation!

    La linea 19 posee la definicion de la funcion main y no la linea que define y con el exponente. Este "typo" tiene sentido porque en la primera version si era la linea 19, pero con cambios este numero de linea cambio hasta el 22.

    opened by nazamoresco 0
  • can't make pdf on Macos

    can't make pdf on Macos

    The error msg were: No such file or directory pls help me finger out what is the problem, thx

            --output=./book.pdf
            -N
            --toc
            --standalone
            --preserve-tabs
            -V documentclass=scrbook
            -V papersize=a4
            -V links-as-note
            --pdf-engine=xelatex
    Traceback (most recent call last):
      File "src/parseBook.py", line 114, in <module>
        returnCode = subprocess.call(pandocCommand)
      File "/System/Library/Frameworks/Python.framework/Versions/2.7/lib/python2.7/subprocess.py", line 172, in call
        return Popen(*popenargs, **kwargs).wait()
      File "/System/Library/Frameworks/Python.framework/Versions/2.7/lib/python2.7/subprocess.py", line 394, in __init__
        errread, errwrite)
      File "/System/Library/Frameworks/Python.framework/Versions/2.7/lib/python2.7/subprocess.py", line 1047, in _execute_child
        raise child_exception
    OSError: [Errno 2] No such file or directory
    make: *** [pdf] Error 1
    
    opened by funfungo 1
A step by step example of creating your own React Native TurboModule.

Discovering Turbo Modules Note: This example was made in RN 0.63. Some things have changed since then, but the good news is that now the setup should

Bartłomiej Klocek 89 Jul 30, 2022
Code of this universe. Fork from private repository.

Universe Code of this universe. Forked from a private repository. Hello User. This is a fork of Universe project. Unfortunately free access to latest

Samsonov Dima 8 May 27, 2022
The main repository for the Darkflame Universe Server Emulator project.

Darkflame Universe Introduction Darkflame Universe (DLU) is a server emulator for LEGO® Universe. Development started in 2013 and has gone through mul

null 439 Aug 5, 2022
The mainly point on this project is show how level of my comprehend for fragment SHADER.

PS The mainly point on this project is show how level of my comprehend for fragment SHADER. This project has some issue I can't solve else. cause I st

null 2 Nov 26, 2021
PlenOctree Volume Rendering (supports CUDA & fragment shader backends)

PlenOctree Volume Rendering This is a real-time PlenOctree volume renderer written in C++ using OpenGL, constituting part of the code release for: Ple

Alex Yu 463 Aug 2, 2022
This is a helper library to abstract away interfacing with floppy disk drives in a cross-platform and open source library.

Adafruit Floppy This is a helper library to abstract away interfacing with floppy disk drives in a cross-platform and open source library. Adafruit Fl

Adafruit Industries 126 Jul 24, 2022
A Graphical Engine written in C++ for abstract OpenGL

Lukeda Graphical Engine (LGE) It's a simple graphical library, written in C++ with OpenGL(GLEW) and GLFW Start as a fork from my other project named "

Lucas Morais 2 Jul 13, 2022
Tightly coupled GNSS-Visual-Inertial system for locally smooth and globally consistent state estimation in complex environment.

GVINS GVINS: Tightly Coupled GNSS-Visual-Inertial Fusion for Smooth and Consistent State Estimation. paper link Authors: Shaozu CAO, Xiuyuan LU and Sh

HKUST Aerial Robotics Group 490 Aug 11, 2022
Blade - A simple, fast, clean, and dynamic language that allows you to develop complex applications quickly.

The Blade Programming Language Quick links: BUILDING | CONTRIBUTING | DOCS | LICENSE | tl;dr Blade is a simple, fast, clean and dynamic language that

Blade Programming Language 103 Aug 6, 2022
🔥 A number of Flutter projects that cover slightly more complex topics.

Check out the YouTube videos to see the indepth process of each project! Reactive Grid https://youtu.be/OEtt_8_FU0s Fancy Full Screen Animation https:

Philip Vu 24 Jul 28, 2022
A guide and set of tools for working with TinyML powered Audio Sensors

Audio Sensor Toolkit This is a guide on how to build an Audio Sensor using Machine Learning, and helpful tools. Audio Sensor Guide Audio Tools Acceler

IQT Labs 19 Jun 13, 2022
Opencore-based Hackintosh EFI and guide for Lenovo Thinkpad X1 Carbon Gen 7

macOS on Thinkpad X1 Carbon 7th Generation OpenCore-based Hackintosh EFI and guide for Lenovo Thinkpad X1 Carbon Gen 7. This guide has been generated

Aidan Chandra 33 Aug 9, 2022
V4L0R4NT 0V3RL4Y 3XT3RN4L 35P CH34T -- Guide written in Indonesian Language~

V4L0VL4Y V4L0R4NT 0V3RL4Y 3XT3RN4L 35P CH34T K4L4U M4U N908R0L M45UK 4J4! H3H3 C4R4 C0MP1L3 DR1V3R 1N5T4L W5L K4L4U 94K PUNY4 L1NUX 9UN4K4N L1NUX Y4N9

Basilius Bias Astho Christyono 29 Aug 1, 2022
A comprehensive guide to 50 years of evolution of strict C programming, a tribute to Dennis Ritchie's language

42 School Cheat Sheet by agavrel ?? Intended for 42 alumni, current students and candidates Truth can only be found in one place: the code – Robert C.

Antonin GAVREL 952 Aug 4, 2022
Macos-arm64-emulation - A guide for emulating macOS arm64e on an x86-based host.

macos-arm64-emulation Use the following guide to download and configure all of the necessary tools and files for emulating the macOS arm64e kernel. Th

Cylance 218 Jul 28, 2022
Guide to Cross Compiling on a Raspberry Pi

Guide to Cross Compilation for a Raspberry Pi > Start Setup XCS and RPi Setup RPi Network and SSH Setup RPi Peripherals Setup Cross-compile environmen

Hessel van der Molen 55 Apr 20, 2022
A guide that teach you build a custom version of Chrome / Electron on macOS / Windows / Linux that supports hardware / software HEVC decoding.

enable-chromium-hevc-hardware-decoding A guide that teach you build a custom version of Chrome / Electron on macOS / Windows / Linux that supports har

Sta Zhu 210 Aug 5, 2022
A FREE Windows C development course where we will learn the Win32API and reverse engineer each step utilizing IDA Free in both an x86 and x64 environment.

FREE Reverse Engineering Self-Study Course HERE Hacking Windows The book and code repo for the FREE Hacking Windows book by Kevin Thomas. FREE Book Do

Kevin Thomas 1k Aug 11, 2022