Awesome Creative Coding
Creative Codingを扱う資料や関連プロジェクトをまとめたAwesomeリストです。
目次
- Books
- Online Books
- Courses
- Tools
- Learning Resources
- Communities
- Math
- Machine Learning • Computer Vision • AI
- Inspiration
- Events
- Museums • Galleries
- Schools • Workshops
- Blogs • Websites
- Related
書籍
- Generative Art: A Practical Guide - Processingを用いた実用ガイド
- Generative Design - Processingで可視化、プログラミング、創造する
- The Nature of Code - p5.jsを用いた自然システムのシミュレーション
- Programming Design Systems - グラフィックデザインの新しい基礎に迫る実用入門
- Learning Modern 3D Graphics Programming - OpenGLを用いたグラフィカルレンダリングに関するチュートリアルシリーズ
- Programming Interactivity - Processing、Arduino、openFrameworksのデザイナー向けガイド
- openFrameworks Essentials - プログラマー、ビジュアルアーティスト、デザイナー向けopenFrameworks初心者ガイド
- Mastering openFrameworks: Creative Coding Demystified - openFrameworksの高度な詳細ガイド
- Algorithms for Visual Design Using the Processing Language - デザイン問題を実験し、3Dアニメーション、GUIなどを作成する
- Foundation HTML5 Animation with JavaScript - HTML5キャンバスを用いたアニメーション作成に必要なすべての知識
- Playing with chaos - JavaScriptでフラクタルと異常吸引子をプログラミング
- Ray Tracing in One Weekend - レイトレーシングに関するミニブック
- Processing 2: Creative Programming Cookbook - 実用的で有用なレシピを用いてProcessing環境を探索するガイド
- Data-driven Graphic Design - ビジュアルコミュニケーションにおけるクリエイティブコーディング
- Real-Time Rendering - 現代的な技術を用いて、数秒で合成3D画像を生成する方法を学ぶ
- Graphics Shaders: Theory and Practice - 一般的なシェーダープログラミングの紹介だが、GLSLシェーダーランゲージに焦点を当てる
- Anton’s OpenGL 4 Tutorials - OpenGLを用いた3Dプログラミングのスタートアップ実用ガイド
- Physics for JavaScript Games, Animation, and Simulations - JavaScriptプログラマーがHTML5ゲーム、アニメーション、シミュレーションに実際の物理を組み込む方法を教える
- Math for Programmers - 本書はコードで数学問題を解決する方法を教える
- Synthèse d’images avec OpenGL (ES) - フランス語の書籍で、OpenGL、OpenGL ESおよびWebGLをカバー
- Hands-On Music Generation with Magenta - ディープラーニングが音楽生成や補助的な音楽作曲に果たす役割を調査する
オンライン書籍
- The Book of Shaders - 抽象的で複雑なフラグメントシェーダの宇宙をステップバイステップで解説
- WebGL Fundamentals - WebGLの基礎から学ぶ。魔法は一切ない
- WebGL 2 Fundamentals - WebGL2の基礎から学ぶ。魔法は一切ない
- Learn OpenGL - 現代OpenGLを学ぶための広範なチュートリアルリソース
- Scratchapixel 2.0 - ゼロからコンピュータグラフィックスを学ぶ
- ofBook - openFrameworksに関するコミュニティが執筆した書籍/ガイド
- OGLdev - Etay Meiriによる現代OpenGLチュートリアルのコレクション
- OpenGL Tutorial - OpenGL 3.3以降のチュートリアルを提供するサイト
- Open.gl - OpenGLの基本的な使い方を教えるガイド
- Pixel Shaders - グラフィックスプログラミングへのインタラクティブな導入
- OpenGLBook - オンライン書籍形式の無料OpenGLプログラミングチュートリアル
- Graphics Programming Projects - Morgan McGuireによる3Dコンピュータグラフィックスに関する書籍
- On Generative Algorithms - Anders Hoffが執筆した、さまざまな有機パターンの生成に関するメモと例、Pythonコード
- Computer Graphics from Scratch - OpenGLおよびDirectXがどのように機能するかを教えるレイトレーシングとラスタライズの教科書
- A Primer on Bézier Curves - Bézier処理を行うために本当に必要な場合の無料書籍
- 3D Game Shaders For Beginners - リアルタイムシェーディング技術をステップバイステップで解説
- XEM WebGL Guide - WebGLをステップバイステ及に解説
- Creative Coding Notebooks - Diego Inácioによるクリエイティブコーディングとコンピュータアートの基本的なPythonレシピセット
- WebGL Academy - WebGLと3Dアルゴリズムを進行型かつインタラクティブに学ぶ
コース
- Create 3D Graphics in JS Using WebGL - WebGLを使ってフレームワークなしでコンテンツを作成を開始する
- Learn HTML5 Graphics and Animation - canvas 2D描画APIの紹介
- Interactive 3D Graphics - Udacityが提供する3Dコンピュータグラフィックスの原理を学ぶコース
- Interactive Computer Graphics - Courseraによるコンピュータグラフィックスコース
- Kadenze Creative Coding - Kadenzeのコース選択肢:p5.js、TensorFlow、Max/Jitter、ChucKをカバー
- Creative Programming for Digital Media & Mobile Apps - Processingを使ったクリエイティブコーディングのCourseraコース
- Imaginary Institute - 美しいインタラクティブグラフィックスを作成する方法を学ぶ
- Future Learn: Creative Coding - コンピュータプログラミングを創造的な分野として、音、画像、アニメーションなどを生成する
- Intro to JS: Drawing & Animation - JavaScriptとProcessingJSライブラリを使って図形とアニメーションを作成する
- Advanced JS: Natural Simulations - JS、ProcessingJS、そして数学的概念を組み合わせて、プログラム内で自然をシミュレートする
- Programming Data Visualizations: A Coding Toolkit for Processing - 情報設計者ニコラス・フェルトンとProcessingの世界に参加する
- Introduction to Data Visualization - ニコラス・フェルトンによる、スマートで包括的でインスピレーションを与えるデータ可視化の導入コース
- Programming Graphics I, , - ジョシュア・デイビスによる生成芸術とProcessingの学習 2 3
- Creative Coding with Canvas & WebGL - マット・デスラウリエスによる生成芸術、インタラクティブアニメーション、3Dグラフィックス、シェーダーに関するワークショップ
- Advanced Creative Coding with WebGL & Shaders - マット・デスラウリエスによるグラフィックスプログラミング、数学、シェーダーに関する深い内容のワークショップ
- Three.js Journey - ブルノ・シモンによるコースは、Three.jsを使って最強のWebGLサイトを作成する秘訣を、初心者や上級者に問わず教えます
- 3D Computer Graphics Programming - Cプログラミング言語を使って、ゼロからソフトウェアレンダラーを作成しながら、3Dグラフィックスの理論と数学を学ぶ
ツール
Frameworks • Libraries • Ecosystems
- Processing [クロスプラットフォーム] - ビジュアルアート向けのプログラミング言語とIDE
- py5 [クロスプラットフォーム] - ProcessingをPython 3エコシステムに統合するライブラリ
- Cinder [クロスプラットフォーム] - C++によるプロフェッショナルなクリエイティブコーディング向けオープンソースライブラリ
- openFrameworks [クロスプラットフォーム] - クリエイティブコーディング向けのオープンソースC++ツールキット
- NAP [クロスプラットフォーム] - データ駆動型リアルタイム制御および可視化プラットフォーム。プロフェッショナルなインストール向けにC++で構築されたもので、Vulkanレンダラーをサポート
- C4 [iOS] - iOS向けのオープンソースクリエイティブコーディングフレームワーク
- Unity [Mac, Win] - ゲームエンジンだが、クリエイティブコーディングやインストールに活用できる
- Godot [クロスプラットフォーム] - オープンソースゲームエンジンで、さまざまな用途に使える
- PlayCanvas [クロスプラットフォーム] - リアルタイム協調型WebGLエンジン(オープンソース)
- hg_sdf [クロスプラットフォーム] - GLSLによるシグネッド距離関数を構築するライブラリ
- nannou [クロスプラットフォーム] - Rust言語向けのオープンソースクリエイティブコーディングフレームワーク
- thi.ng [クロスプラットフォーム] - JavaScript、TypeScript、ClojureおよびClojureScript言語向けのオープンソースコンピューターデザインツールのコレクション
- PixelKit [iOS, Mac] - メタルを用いたオープンソース、リアルタイムグラフィックス、Swiftフレームワーク
- OPENRNDR [クロスプラットフォーム] - クリエイティブコーディング用のオープンソースライブラリ(Kotlinで記述)
- Phaser [クロスプラットフォーム] - ゲーム開発用のHTML5フレームワーク。CanvasおよびWebGLレンダラーを併用
- Canvas-sketch [クロスプラットフォーム] - JavaScriptおよびブラウザで生成アートを制作するためのHTML5フレームワーク
- AsyncGraphics [iOS, macOS] - メタルを用いたオープンソース、リアルタイムグラフィックス、async / await、Swiftパッケージ
- Lygia [クロスプラットフォーム] - パフォーマンスと柔軟性を重視した、マルチ言語(GLSL、HLSL、WGSL、MSLおよびCUDA)のシェーダライブラリ
- Fragment.tools [クロスプラットフォーム] - クリエイティブコーディング向けのウェブ開発環境
Visual Programming Languages
- vvvv [Win] - ハイブリッドな視覚的・テキスト入力リアルタイムプログラミング環境。プロトタイピングおよび開発が容易
- NodeBox [Mac, Win] - クロスプラットフォーム、ノードベースGUI。データ可視化および生成デザインに効率的に活用できる
- TouchDesigner [Mac, Win] - リアルタイムプロジェクトを作成するための視覚開発プラットフォーム
- Quartz Composer [Mac] - グラフィカルデータの処理およびレンダリング用の開発ツール
- Vuo [Mac] - ライブインタラクティブメディアプログラミング環境。
- Max [Mac, Win] - メディア用の視覚プログラミング言語。
- Pure Data [Cross-platform] - メディア用のオープンソース視覚プログラミング言語。
- ossia score [Cross-platform] - インタラクティブかつインタメディアの音視聴順列化ツール。
- TiXL [Win] - インタラクティブ3Dコンテンツとアニメーションを作成するためのオープンソースツール。
- XOD [Cross-platform] - マイクロコントローラベースプロジェクト用のオープンソース視覚プログラミング言語および環境。
- Isadora [Cross-platform] - シーンベースのメディア制御ソフトウェアで投影マッパーを統合。
- cables [Cross-platform/Web] - 美しいインタラクティブコンテンツを作成するためのモデルキット。
- eternal [Web] - プログラムをグラフとして、グラフを構成ツールとして使う。
- Notch Builder [Win] - リアルタイムグラフィックスに強い焦点を置いたノードベースの作成ツール。
- JOY.JS - リアルタイム視覚コードツールで、理解しやすく初心者向け。
- TIC-80 - 240*136ピクセルの画面でピクセルアートスタイルのゲームやアートを作成。
Sound Programming Languages
- SuperCollider [Multi-platform] - 音響合成とアルゴリズムによる作曲のプラットフォーム。
- ChucK - 強力なタイム制御、並列処理、即時実行の音楽プログラミング言語。
- TidalCycles - パターンのライブコーディングに特化したドメイン特定言語。
- Sonic Pi - 誰でも使えるライブコーディング音楽シンセサイザー。
- Csound - 音と音楽のコンピューティングシステム。
- Orca - プロシージャルシーケンサを迅速に作成するためのライブコーディング環境。
- handel - ブラウザ内で歌を書くための小さなプロシージャルプログラミング言語。
- Overtone - 合成と楽器構築からライブコーディングまで新しい音楽アイデアを探索するためのオープンソース音環境。
- Melrōse - MIDIを生成する環境でライブ音楽を作成する
- Glicol - Rustで書かれたグラフ指向のライブコーディング言語と音声/オーディオDSPライブラリ
Web Programming • Libraries
- three.js - JavaScriptによる3Dライブラリ
- regl - 関数型WebGL
- Stackgl - ブラウザフィーとnpmに基づくWebGL向けオープンソフトウェアエコシステム
- Paper.js - ベクターグラフィックススクリプティングのスイス軍刀
- Pixi.js - HTML5の2D描画エンジンでWebGLを使用し、キャンバスにフォールバック
- p5.js - Processingの元の目的をもつJavaScriptライブラリ
- Pts.js - 可視化とクリエイティブコーディング用のJavaScriptライブラリ
- Fabric.js - キャンバスに変換するSVGを解析するJavaScriptキャンバスライブラリ
- Maker.js - SVG、CNCおよびレーザー切断機用のパラメトリックライン描画
- JSCAD - JavaScriptによるプログラム的な3Dモデリング
- Sketch.js - 最小限のJavaScriptによるクリエイティブコーディングフレームワーク
- Two.js - 現代のウェブブラウザ向けの2次元描画API
- lightgl.js - 軽量なWebGLライブラリ
- picogl.js - 最小限のWebGL2描画ライブラリ
- Alfrid - WebGLツールセット
- Babylon.js - HTML5とWebGLで3Dゲームを構築するための完全なJavaScriptフレームワーク
- twgl.js - 小さなWebGL補助ライブラリ
- luma.gl - データ可視化用のWebGL2コンポーネント
- css-doodle - CSSでパターンを描くためのウェブコンポーネント
- OGL.js - JavaScript 3D ライブラリ(WebGL)
- Zdog - キャンバスとSVG用の擬似3Dエンジン
- Oimo.js - JavaScript用の軽量3D物理エンジン
- Ammo.js - Emscriptenを用いたBullet物理エンジンのJavaScript直接移植
- Theatre.js - 視覚ツールを備えたモーションデザインライブラリ
- textmode.js - リアルタイムASCIIおよびテキストモードグラフィックス用のJavaScriptキャンバスライブラリ
Projection Mapping • VJing
- MadMapper [Mac] - ビデオマッピングプロJECTIONおよびライトマッピング
- VDMX [Mac] - リアルタイムマルチメディアパフォーマンスアプリケーション
- Modul8 [Mac] - リアルタイムビデオミックスおよびコンポジティング
- Resolume [Mac, Win] - リアルタイムでデジタルビデオとエフェクトのミックス
- VirtualMapper - プロジェクションマッピング用のリアルタイムプレビューツール
- Millumin [Mac] - インタラクティブオーディオビジュアルショーの作成およびパフォーマンスを行うソフトウェア
- Smode [Win] - リアルタイム2D/3-3D作成、コンポジティングおよびビデオマッピングエンジン
- Veejay [Linux] - 多数のソース(ファイル、デバイス、ストリームなど)からのシンプルな非線形編集およびミックスを備えたライブパフォーマンスツール
Online
- Shadertoy - 世界と共有し、インスピレーションを得るシェーダーの構築
- Shader Park - インタラクティブプロシージャル2Dおよび3Dシェーダーを作成するためのJavaScriptライブラリ
- GLSL Sandbox - オンラインシェーダー編集器とギャラリー
- Shdr Editor - オンラインシェーダー編集器
- CodePen - 高度な技術を示したケーススタディ(編集可能なソースコード付き)
- Shadershop - GPUシェーダーをプログラミングするためのインターフェース
- Vertexshaderart - オンラインシェーダー編集器とギャラリー
- Cyos - オンラインシェーダー編集器
- GlslEditor - シンプルなWebGLフラグメントシェーダー編集器
- OpenProcessing - Processing、p5jsおよびprocessingjsで作成されたアルゴリズム設計
- P5.js Editor - p5.js用のオンラインウェブエディタ
- LiveCodeLab - VJ、音楽家、教師、学生、子どもたちがリアルタイムで実行できるツール
- Turtletoy - 生成コード用のミニマリズムAPIとオンラインショวーケース(JavaScript)
- ShaderGif - コードで作られた芸術のオープンソースホーム(WebGL1/2、JavaScript Canvas & p5.js)
- P5LIVE - p5.jsのライブコーディング環境
- NEORT - クリエイティブコーディング者向けのデジタルアートプラットフォーム(フラグメントシェーダー、JavaScript Canvas)
- Shelly - タートルに指示を出すことでプログラミングを学ぶ
- tixy.land - 最もミニマリズムなクリエイティブコーディング環境が生きている
- BBC Micro bot - ツイートを8ビットコンピュータエミュレータで実行できる
- Hydra - ライブコード可能なビデオシンセとコーディング環境
- editor.textmode.art - textmode.js用のオンラインウェブエディタ
- synth.textmode.art - textmode.js用のオンラインライブコーディング環境
Hardware
- Arduino - デジタルデバイスやインタラクティブオブジェクトを構築するためのオープンソースマイクロコントローラーキット
- Raspberry Pi - 小型シングルボードコンピュータ
- Puck.js - ワイヤレスでプログラミングできるオープンソースJavaScriptマイクロコントローラー
- BeagleBoard - 低消費電力のオープンソースシングルボードコンピュータ
- Makey Makey - 日常の物をタッチパッドに変換し、インターネットと組み合わせる
- Leap Motion - 手や指の動きを入力としてサポートするセンサー機器
- AxiDraw - シンプルで現代的かつ正確なペンプロット機
- Phidgets - コンピュータ用のセンサー、入力デバイスおよびコントローラー
- Teensy - USBベースのマイクロコントローラ開発システム
- Lightform - 内蔵深度センサーによるAR投影マッピング
Other
- Structure Synth [クロスプラットフォーム] - デザイン文法を指定して3D構造を生成するアプリ
- F3 [Mac] - 3Dデザインをリアルタイムでコードで作成できる強力な3Dデザインアプリ
- ShaderTool [Win] - プログラマやFXアーティスト向けの現代的なシェーダーIDE
- Syphon [Mac] - アプリケーション間でリアルタイムでフレームを共有できる機能
- KodeLife - リアルタイムGPUシェーダー編集器、ライブコード実行ツールおよびグラフィックスプロトタイピングスケッチパッド
- ISF - インタラクティブアプリケーションで使用可能なGLSLシェーダー
- glslViewer - GLSLシェーダーをリアルタイムでレンダリングするライブコーディングコンソールツール
- shoebot [クロスプラットオーラ] - ShoebotはPythonでベクターグラフィックスとアニメーションを作成するための創造的コーディング環境
- DrawBot [Mac] - Pythonベースの教育向け2Dグラフィックスプログラミング環境
- Klak - Unityで創造的コーディングを行うためのスクリプトのコレクション
- basil.js - InDesignでのスクリプティング(JS)—Processingの精神をもつデザイナーおよびアーティスト向け
- Konstrukt [クロスプラットフォーム] - SVGとしてスケーラブルなパターンを生成するコマンドラインツール
学習リソース
Videos
- The Coding Train - Daniel Shiffmanが創造的コーディングについての動画を制作
- MFGD - Fragment Shaders - YouTubeにアップロードされたフラグメントシェーダーに関するプレイリスト
- Shaders Laboratory - シェーダーに関するYouTubeチャンネル
- Makin’ Stuff Look Good - シェーダーに関するケーススタディに関するYouTubeチャンネル
- openFrameworks Tutorial Series - オープンオフロームを学ぶためのYouTubeシリーズ
- openFrameworks tutorial - オープンオフロームに関するYouTubeプレイリスト(2015年以降更新されていない)
- Shader Tutorial Series - Visual Studio Codeを使ってシェーダーを作る方法に関するYouTubeプレイリスト
- Kha Tutorial Series - Khaフレームワーク(Haxeで構築)に関するYouTubeプレイリスト
- Fun with WebGL 2.0 - WebGL 2.0に関するYouTubeプレイリスト
- Modern OpenGL 3.0+ Tutorials - 現代的なOpenGLに関するYouTubeプレイリスト
- Vertexshaderart - 頂点シェーダーに関するYouTubeプレイリスト
- Diving in Three.js - three.jsに深く Dive するためのYouTubeプレイリスト
- Shadertoy Tutorials - Shadertoyを使ってゼロからシェーダーを作る方法を教えるYouTubeプレイリスト
- WebGL Lighting - Greg TatumによるWebGLのライトに関する紹介
Talks
- Inigo Quilez Live - Íñigo Quílezによるライブコーディング動画のコレクション
- There is also canvas - Bruno ImbriziがWebExpo 2016でキャンバスを使ったクリエイティブコーディングについて説明。インタラクティブスライド here
- OpenGL 3D Game Tutorials - OpenGLを使って3Dゲームを作成する初心者向けチュートリアルシリーズ
- How We Do This Shit - テクノロジーを活用したアーティストがその収入をどうやって確保しているかに関する講演
- Making WebGL Dance - 線形代数学を学び始めた私の体験談
- The Pixel Factory - Steven WittensによるWebGL、GPU、数学に関する講演
- Poetic Computation - Zach Liebermanによるインスピレーションを与える講演
- Generative Machines - FITCでマット・デスラウリエスが生成芸術への情熱について語る
Articles • Tutorials
Shaders • OpenGL • WebGL
- Introduction to shaders - threejsを用いたシェーダー導入の第1部
- Three.js 101 - 創造的なコード開発者の視点からthree.jsの導入
- lwjgl: Shaders - lwjgl-basicsの文脈におけるシェーダーチュートリアル
- Shaders: A primer - シェーダーに関する入門
- Shaders: Second stage - 前の内容の第2部
- WebGL Lessons — Fragment Shaders - フラグメントシェーダーについての簡易導入
- WebGL Lessons — ThreeJS Shaders - ThreeJSでカスタム頂点およびフラグメントシェーダーの使用方法
- ThreeJS post-process example - ThreeJSにおけるポストプロセス効果の例
- Introduction to Ray Tracing - 3D画像を作成するためのシンプルな方法
- Ray Marching and Signed Distance Functions - レイマーチングと符号距離関数についての導入
- GLSL lighting walkthrough - glslifyを用いたPhongシェーディングチュートリアル
- Three glslify example - three.jsとglslifyの使用方法に関する例
- WebGL Beyond Dom - グレッグ・タトムがReglを用いてWebGLの基本を説明
- FBO particles - @nicoptereによるFBO/GPGPU粒子に関する記事
- Ray marching (with THREE.js) - @nicoptereによるthree.jsを用いたレイマーチングに関する記事
- Custom shaders with Three.JS - three.jsにおけるカスタムシェーダー、ユニフォーム、テクスチャおよび照明についての導入
- An intro to modern OpenGL - 現代OpenGL導入の第1部
- Modern OpenGL Series - OpenGLのいくつかの用語についての良い導入
- Smooth minimum - smoothに基づくプリミティブ合併に関する記事
- Modeling with distance functions - 距離関数のコレクションを一つの中央化された場所に集約したもの
- Volumetric rendering - ボリュームシェーダー内で複雑な3D形状を作成する方法を説明
- Real-time Rendering - リアルタイムレンダリングに関する書籍、ブログ、およびリソースのコレクション
- OpenGL 4 Shaders - アントン・ゲルダランによるOpenGLシェーダーへの短いで分かりやすい導入
- On ray casting, ray tracing, ray marching and the like - タイトルに書かれている通り、アドクによる導入
- Writing a small software renderer - ソフトウェアレンダリングの基本的な仕組みについての非常に良い導入
- WebGL Tutorials - WebGLチュートリアルを非常に良くまとめて提供しているウェブサイト
- Generating Geometry: 1、 2、 MARK-0001 - ボディーメッシュオブジェクトを作成するための初心者向け導入 3
- Into Vertex Shaders - WebGL、Three.js、Three.basに関するチュートリアルシリーズ
- The Spaces of WebGL - 3Dグラフィックスパイプラインにおけるさまざまな座標系についての概要
- WebGL Workshop - WebGLへの短いで分かりやすいオンライン導入
- THREE.js & instanced geometry - three.jsとインスタンスジオメトリを使って作るふわふわな捕食者
- Particle Effects via Billboards - ビルボードとWebGLを使ってパーティクルエフェクトを作成する方法
- Beautifully Animate Points with WebGL and regl - reglを使ってGPGPUパーティクルを作成する方法
- WebGL Tutorial: Directional Shadow Mapping without extensions - リアルタイム方向光シャドウマッピングの基本概念についての導入
- WebGL Quest - WebGLレイマーチングと距離関数を簡単に使うためのチュートリアルと便利なリソース一覧
- Exploring bump mapping with WebGL - 異なるバーンマッピング技術についての導入
- OpenGL/GLSL Shader Programming - OpenGL/GLSLシェーダープログラミングに関するデッキ
- Particles in a Simplex Noise Flow Field - パーソンノイズフロー場チュートリアル
- Flow Fields, Part 1 - 流れ場(ベクトル場)についての紹介
- Flow Fields, Part 2 - 流れ場(ベクトル場)についての紹介
- Graphics for Games - ネイジル大学による3Dグラフィックスプログラミングの紹介(シェーダー、数学のポストプロセスなど)
- Three.js Basics - エリック・ヘイズによるThree.jsの紹介
- An Interactive Introduction to WebGL and three.js - SIGGRAPH 2017のWebGLワークショップのスライド
- How to Start Learning Computer Graphics Programming - エリック・アーネバックによる、初学者向けのアドバイスと考え
- What Every Coder Should Know About Gamma - ガンマの重要性についての深掘り
Canvas
- HTML Canvas Deep Dive - キャンバスAPIについての深い紹介
- 31 days of Canvas tutorials - シブ・リー・デリスルによるキャンバスチュートリアルのコレクション
Hardware
- Pen Plotter Art & Algorithms Part 1, 2 - JavaScriptでAxiDrawペンプロッターを使う方法
Other
- Noise in Creative Coding - 創造的コーディングにおいて欠かせないノイズについての詳細なブログ記事
- Cat Like Coding - 数学、アルゴリズム、Unityに関する詳細なチュートリアル
- Fun Programming - 簡単なプログラムを書くことで創造的コーディングを学ぶ
- Creative-coding on iOS with C4 - Creative Applicationsで公開されたC4についての紹介
- COSMOS - C4を使ってアプリケーションの設計、プログラミング、リリースを行うための端到端チュートリアル
- Particle Physics - 粒子物理学の解説
- Visualizing Algorithms - アルゴリズムを理解・説明・デバッグするための可視化の利用について
- Adventures in Game Development World - ゲーム開発に関するわかりやすい記事のコレクションだが、創造的コーディングにも関連がある
- Amit’s Game Programming Information - パスファインディング、AI、数学などに関するリソースのコレクション
- Tips to Improve Your Generative Artwork - 作品の見た目をより良くするためのヒント
- Working With Color in Generative Art - 色を正しく表現するためのヒント
Interactive
- Shader-school - GLSLシェーダーとグラフィックスプログラミング向けワークショップ
- Webgl-workshop - shader-schoolの続編:WebGL APIを学ぶ
- Fragment-foundry - インタラクティブなフラグメントシェーダーチュートリアル
- SDF Tutorial 1: box & balloon - Shadertoyにおけるレイトレーシングチュートリアル
- HOWTO: Ray Marching - Shadertoyにおけるレイマーチングチュートリアル
- Raymarch Tutorial2 - Shadertoy レイマーチングチュートリアル
- GLSL 2D Tutorials - Shadertoy GLSL 2Dチュートリアル
- Bubble Breakdown - Perlinによるシェーダーの解説
- Let’s Make A Ray Marcher - インタラクティブなShader-Toyによるレイマーチャーの作成チュートリアル
- Raymarching - インタラクティブなShader-Toy レイマーチングチュートリアル
Quick References • Cheat Sheets
- Shaderific GLSL - OpenGL ESシェーディング言語リファレンス
- The Book of Shaders Glossary - テーマ別シェーダー用語集
- gltut glossary pages: 1, 2, 3, 4, 5, 6, 7, 8 - OpenGL 3Dプログラミング用語集
- Canvas Cheatsheet - 簡潔で視覚的なキャンバス cheatsheet
- WebGL Cheatsheet - WebGL 1.0 API リファレンスカード
- Glossary of Computer Graphics - コンピュータグラフィックス関連用語集
- GLSL Reference Guide - OpenGLシェーディング言語のクイックリファレンスガイド
- 3D Maths Cheat Sheet - Anton GerdelanによるOpenGL書籍から取った数学のcheatsheet
- docs.GL - 公式OpenGLドキュメントの改善
- OpenGL Shading Language - KhronosグループGLSL Wiki
- OpenGL 4.3 Reference Card - OpenGL 4.3 API の PDF リファレンスカード
- Easings - インタラクティブなエイジング関数のチェックシート
- PixelSpirit - トーティカードの裏側に記載された GLSL ライブラリ(学習および参照用)
- Procedural Patterns And Noises - プロシージャルパターンとプロシージャルノイズのコレクション
- Visual Noises - 1次元および2次元におけるノイズアルゴリズムの可視化
- Trigonoparty - シンプルな三角関数の可視化
- Morphogenesis - 自然に現れる形状・構造・パターンの探索
コミュニティ
Subreddits
- r/creativecoding - コンピュータプログラミングを創造的分野としての利用方法の共有と議論
- r/raytraycing - レイトレーシングに関するサブレッド
- r/opengl - すべてのプラットフォームにおけるOpenGLのニュースと議論
- r/graphicsprogramming - グラフィックスプログラミングに関するサブレッド
- r/processing - Processingに関するサブレッド
- r/shaders - シェーダーに関するサブレッド
- r/proceduralgeneration - プロシージャル生成に関するサブレド
- r/MachineLearning - 機械学習に関するサブレッド
- r/generative - 生成芸術および音楽に関するサブレッド
Slack
- Creative Coding Club - Creative Coding Club Slack
Other
- The Creative Coding Podcast - Iain と Seb が創造的コードの詳細について語る
- realtimevfx.com - リアルタイムVFXコミュニティ
- Data Stories - データ可視化に関するポッドキャスト
- 3D Programming Weekly Articles - シェーダーおよび数学関連のリソースが豊富なコレクション。
数学
- Math as code - コード形式での数学記号のチェックリスト。
- Coding Math - プログラマーとして必要な数学を学ぶための教材。
- Math snippets - グラフィックプログラミングを意識した数学のコードスニペット。
- Formula Animations - 数学を使って絵を描く原理。
- Learning Maths again - JavaScriptおよびGLSLの数学スニペットのコレクション。
- Eases - モジュラーフィードバックのためのエイジング式の集まり。
- Math for Motion - 異なる運動方程式の可視化。
- Matrix Multiplication - 行列乗算の可視化。
- Algebra rules - 基本的な代数の最も有用なルール。
- Immersive Math - 完全にインタラクティブな線形代数。
- Image Kernels - 画像カーネルに対するインタラクティブかつ可視化された導入。
- Sine and Cosine - サインとコサインについてのインタラクティブな説明。
- Perlin Noise - パーソンノイズの詳細な解説。
- Vector Math for 3D Computer Graphics - コンピュータグラフィックスの視点からベクトル代数および行列代数のチュートリアル。
- Desmos - 関数をグラフ化、データをプロット、式を評価、変換を探索など、さまざまな機能を提供。
- MFGD - ゲーム開発者向けの数学に関するYouTubeプレイリスト。
- Essence of linear algebra - 線形代数の本質に関するYouTubeプレイリスト。
- Mathematics of Animation - アニメーションの数学についてのスライド(repo)。
- Sketching with Math and Quasi Physics - 数学および準物理学への美しい可視化された導入。
- Gene Kogan: Perlin Noise - 2Dおよび3DのPerlinノイズについての導入
- Matrix Math and You - マトリクスについての高度な導入
- Mathematical Symbols - すべての数学記号と記号のリスト
- The magnificent 2d matrix - 変換マトリクスをより理解しやすくするインタラクティブツール
- Game Dev Movement cheatsheet with examples - 移動に関するJavaScript数学コードのサンプル
- Maths & trigonometry cheat sheet for 2D & 3D games - 2Dおよび3Dゲーム開発者向けの数学のサマリー
- Matrices for Creative Coding - グレッグ・タットムによるマトリクスの導入
- Making Things With Maths - スティーブン・ウィテンズによるベジール曲線、プロシージャル生成、物理エンジン、フラクタルについての講演
- MyPhysicsLab - フォームとコードを含むリアルタイム物理シミュレーション
- Intuitive Math - 線形代数学や幾何学などの分野についての説明で、視覚的な直感を育てることを目的としている
- L-systems - HaskellによるLシステムのパッケージ
- Linear Interpolation - 線形補間(mix/lerp)についての導入
- Practical use of Vector Math in Games - ゲーム数学用のベクトルについての詳細記事
- Shepherding random numbers - ランダムな数値を管理するための小さなガイド
- Shepherding random grids - ランダムなグリッドを管理するための小さなガイド
- Shepherding random growth - ランダドな成長を管理するための小さなガイド
機械学習・コンピュータービジョン・AI
- ml4a - アーティスト向けの機械学習
- Keras.js - GPU対応でブラウザ上でKerasモデル(TensorFlowバックエンド)を実行
- Tesseract.js - 純粋JavaScriptによるマルチ言語OCR
- Google ML - グーグルによるクラウド機械学習
- TensorFlow - 機械知能向けオープンソースソフトウェアライブラリ
- ConvNetJS - ブラウザ内で深層学習を行う
- Wekinator - 誰でも機械学習を活用できる
- Machine Learning - Coding Trainのリポジトリで機械学習リソースへのリンクを提供
- Teachable Machine - ブラウザ内で機械学習がどのように機能するかを実時間で体験
- TensorFlow.js - ブラウザおよびNode.js上で機械学習モデルの訓練とデプロイを行うJavaScriptライブラリ
- ml5.js - ウェブ向けに親しみやすい機械学習
- Model Zoo - オープンソースの深層学習コードと事前訓練済みモデルを発見
- Runway - 動画およびコンテンツ作成向けAIツール
インスピレーション
- OpenProcessing - Processing、p5jsおよびprocessingjsで作成されたアルゴリズム設計
- Dwitter - 短いJavaScriptデモを共有するソーシャルネットワーク
- Chrome Experiments - クリエイティブコーディングコミュニティが書いたウェブ実験の展示
- For your Processing - Processingに関するプロジェクトとチュートリアル
- Art From Code - ケイト・ペーターズによるコードスケッチ
- Generator.x - 芸術・デザインにおける生成戦略に関するFlickrグループ
- Generative Art - 生成芸術に関するFlickrグループ
- People You Should Follow on CodePen - 注目すべき人々のリスト
- Raven Kwok - 視覚芸術家であるラヴン・クォックによるTumblr
- P5Art - Processingにおける実験の素晴らしいコレクション
- Echophon - 視覚的インスピレーションを提供するTumblr
- Bees & Bombs - ダビースが提供する、グイフを含むTumblr
- Folds2d - カーブ、表面、スケーラーおよびベクトル場を扱うTumblr
イベント
- OFFF Festival - デジタルデザインフェスティバル(オンライン・フラッシュ・フィルム・フェスティバル)
- Gray Area Festival - クリエイティブ・コーディング、芸術と技術フェスティバル
- Signal Festival - チェコ共和国のプラハで開催される光芸術と新技術を展示するイベント
- Eyeo Festival - データ、芸術、技術の交差点に立つクリエイティブ・コーディング者、データデザイナー、クリエイターたちを結びつけるイベント
- Mutek - 音、音楽、音視覚芸術におけるデジタルクリエイティビティを推進する組織
- Node - 文化、芸術、技術に関する交換のためのオープンプラットフォーム
- Digital Design Days - 3日間のイベントで、講演、ワークショップ、デジタル展示、インスタレーションを提供
- CODAME ART+TECH - プロジェクトおよび非営利イベントを実施し、体験を通じてインスピレーションを提供
美術館・ギャラリー
- ZKM — Zentrum für Kunst und Medien, Karlsruhe/Germany - ZKMはメディア、デジタル化、グローバル化の影響についての展示およびイベントを主催
- Ars Electronica Center, Linz/Austria - 未来博物館——芸術ジャンル、科学分野、技術分野の多様な融合を展示・処理する場
- Technorama, Zurich/Switzerland - テクノラモアは、数百の自然現象と技術を体験できる場を提供
- Kate Vass Gallery - Zürich/Switzerland - 国際的な確立されたアーティスト、中堅アーティスト、新進アーティストが撮影と新技術をテーマにした作品を展示する現代芸術ギャラリー
- Digital Art Museum - Berlin/Germany - デジタルアート博物館は、デジタルファインアートの歴史と実践に関するオンラインリソース
- NXT Museum - Amsterdam/Netherlands - オランダで新メディアアートを専門に扱う最初の博物館
学校・ワークショップ
- Goldsmiths, UoL, MA Computational Art - ロンドンの大学で、創造的計算の表現世界を通じてアート実践を発展させる修士課程
- UAL Creative Computing Institute - ロンドンで創造性と計算技術の交差点に立つ学校
- School for Poetic Computation - ニューヨークの学校で、コード、デザイン、ハードウェア、理論の交差点を探索する教育を提供
- Copenhagen Institute of Interaction Design - さまざまな教育プログラムを運営しており、特にインタラクションデザインプログラムおよびCIIDサマースクール
- Residencies, Fellowships, Summer Schools - 世界中にある大きなリソース一覧(左下のタブでナビゲート)。
ブログ・ウェブサイト
- CreativeApplications.Net [CAN] - 有名なデジタルアートブログ。
- iquilezles.org - Íñigo Quílezのホームページ。GLSLおよび数学のスニペットに特化。
- bit-101.com - ケイト・ペータースによるブログ。創造的コードに特化。
- ibreakdownshaders - シェーダーの背後にある数学を探索。
- adriancourrèges.com - ソフトウェアエンジニアアドリアン・コルルエのブログ。ゲームグラフィックス研究などについての記事。
- clicktorelease.com - ジャウメ・サンチェス・エリアスのホームページ。WebGLおよびWebVRに関するデモ、講演、記事を提供。
- syntopia - ミカエル・ハヴィトールト・クリスティエンセンによる生成アートとシステムに関するブログ。
- madebyevan.com - エヴァン・ウォールスによるWebGL実験と記事。
- songho.ca - ソン・ホ・アンのホームページ。OpenGLおよび数学に関するチュートリアルが豊富。
- simonschreibt.de - シモン・シュレibtによるゲームアートのトリック、デザインのトリック。
- sighack.com - マノハル・ヴァンガによる生成アートアルゴリズムと技術に関するブログ。
- jsdo.it-archives - WebGL実験のコンパイル。WebGLフレームワークおよび物理エンジン(oimo.js、cannon.js、ammo.js)の比較を含む。
- WebAudio Weekly - WebAudio APIに関するすべての情報を知るニュースレター。
関連情報
- Awesome opengl - 素晴らしいOpenGLライブラリ、デバッガーやリソースの厳選リスト。
- Awesome webgl - 素晴らしいWebGLライブラリ、リソースなど、厳選された一覧。
- Awesome canvas - 素晴らしいHTML5キャンバスリソース、例、関連記事および投稿を厳選した一覧。
- Awesome audio visualization - オーディオ可視化に関する厳選された一覧。
- Awesome computer vision - 素晴らしいコンピュータビジョンリソースを厳選した一覧。
- Awesome visualization research - データ可視化に関するおすすめの研究論文およびその他の読み物を厳選した一類。
- Awesome livecoding - ライブコーディング言語およびツールを厳選した一覧。
- Awesome graphics - コンピュータグラフィックスのチュートリアルやリソースを厳選したリスト
- Graphics resources - グラフィックプログラミングのリソースを厳選したリスト
- Magic tools - 魔法が現れるようなゲーム開発用のリソースを厳選したリスト
- Awesome public datasets - 公開されているデータセットを厳選したリスト、主に無料のリソース
- Link collection of ray marching on the GPU - 2013年から厳選したリスト
- 3D Machine Learning - 3D機械学習向けのリソースリポジトリ
- Awesome creative technology - クリエイティブテクノロジー関連のグループ、企業、スタジオ、集団などを厳選したリスト
ライセンス
可能な限り法に従い、Terkel Gjervigはこの作品に関するすべての著作権および関連又は隣接する権利を放棄した。