---

layout: default

---

<h2>Basic Demos</h2>

<p>Basic demonstrations of how Processing works, from the <a href="http://processing.org/">Processing.org</a>

web site. All of the following demos were written by <a href="http://reas.com/">Casey Reas</a>

and <a href="http://benfry.com/">Ben Fry</a> unless otherwise stated.</p>

<p>You can also view <a href="http://processing.org/learning/basics/">Basic Demos on processing.org</a></p>

<h3>Structure</h3>

<li><a href="/learning/basic/statementscomments/">Statements and Comments</a>

<li><a href="/learning/basic/coordinates/">Coordinates</a>

<li><a href="/learning/basic/widthheight/">Width and Height</a>

<li><a href="/learning/basic/setupdraw/">Setup and Draw</a>

<li><a href="/learning/basic/noloop/">No Loop</a>

<li><a href="/learning/basic/loop/">Loop</a>

<li><a href="/learning/basic/redraw/">Redraw</a>

<li><a href="/learning/basic/functions/">Functions</a>

<li><a href="/learning/basic/recursion/">Recursion</a>

<li><a href="/learning/basic/recursion2/">Recursion 2</a>

<li><a href="/learning/basic/creategraphics/">CreateGraphics</a>

<h3>Form</h3>

<li><a href="/learning/basic/pointslines/">Points and Lines</a>

<li><a href="/learning/basic/shapeprimitives/">Shape Primitives</a>

<li><a href="/learning/basic/simplecurves/">Simple Curves</a>

<li><a href="/learning/basic/piechart/">Pie Chart</a>

<li><a href="/learning/basic/vertices/">Vertices</a>

<li><a href="/learning/basic/trianglestrip/">Triangle Strip</a>

<li><a href="/learning/basic/bezier/">Bezier</a>

<li><a href="/learning/basic/bezierellipse/">Bezier Ellipse</a>

<h3>Data</h3>

<li><a href="/learning/basic/variables/">Variables</a>

<li><a href="/learning/basic/integersfloats/">Integers and Floats</a>

<li><a href="/learning/basic/truefalse/">True/False</a>

<li><a href="/learning/basic/charactersstrings/">Characters and Strings</a>

<li><a href="/learning/basic/datatypeconversion/">Datatype Conversion</a>

<li><a href="/learning/basic/variablescope/">Variable Scope</a>

<h3>Control</h3>

<li><a href="/learning/basic/iteration/">Iteration</a>

<li><a href="/learning/basic/embeddediteration/">Embedded Iteration</a>

<li><a href="/learning/basic/conditionals1/">Conditionals 1</a>

<li><a href="/learning/basic/conditionals2/">Conditionals 2</a>

<li><a href="/learning/basic/logicaloperators/">Logical Operators</a>

<h3>Math</h3>

<li><a href="/learning/basic/incrementdecrement/">Increment/Decrement</a>

<li><a href="/learning/basic/operatorprecedence/">Operator Precedence</a>

<li><a href="/learning/basic/modulo/">Modulo</a>

<li><a href="/learning/basic/distance1d/">Distance 1D</a>

<li><a href="/learning/basic/distance2d/">Distance 2D</a>

<li><a href="/learning/basic/sine/">Sine</a>

<li><a href="/learning/basic/sinecosine/">Sine and Cosine</a>

<li><a href="/learning/basic/sinewave/">Sine Wave</a>

<li><a href="/learning/basic/additivewave/">Additive Wave</a>

<li><a href="/learning/basic/polartocartesian/">Polar to Cartesian</a>

<li><a href="/learning/basic/arctangent/">Arctangent</a>

<li><a href="/learning/basic/graphing2dequation/">Graphing 2D Equation</a>

<li><a href="/learning/basic/random/">Random</a>

<li><a href="/learning/basic/doublerandom/">Double Random</a>

<li><a href="/learning/basic/noise1d/">Noise 1D</a>

<li><a href="/learning/basic/noise2d/">Noise 2D</a>

<li><a href="/learning/basic/noise3d/">Noise 3D</a>

<li><a href="/learning/basic/noisewave/">NoiseWave</a>

<h3>Typography</h3>

<li><a href="/learning/basic/letters/">Letters</a>

<li><a href="/learning/basic/words/">Words</a>

<h3>Image</h3>

<li><a href="/learning/basic/displaying/">Displaying</a>

<li><a href="/learning/basic/backgroundimage/">Background Image</a>

<li><a href="/learning/basic/pointillism/">Pointillism</a>

<li><a href="/learning/basic/transparency/">Transparency</a>

<li><a href="/learning/basic/sprite/">Sprite</a>

<li><a href="/learning/basic/alphamask/">Alphamask</a>

<li><a href="/learning/basic/createimage/">CreateImage</a>

<h3>Color</h3>

<li><a href="/learning/basic/hue/">Hue</a>

<li><a href="/learning/basic/saturation/">Saturation</a>

<li><a href="/learning/basic/brightness/">Brightness</a>

<li><a href="/learning/basic/colorwheel/">Color Wheel</a>

<li><a href="/learning/basic/reading/">Reading</a>

<li><a href="/learning/basic/creating/">Creating</a>

<li><a href="/learning/basic/relativity/">Relativity</a>

<li><a href="/learning/basic/lineargradient/">Linear Gradient</a>

<h3>Transform</h3>

<li><a href="/learning/basic/translate/">Translate</a>

<li><a href="/learning/basic/scale/">Scale</a>

<li><a href="/learning/basic/rotate/">Rotate</a>

<li><a href="/learning/basic/triangleflower/">Triangle Flower</a>

<li><a href="/learning/basic/arm/">Arm</a>

<h3>Input</h3>

<li><a href="/learning/basic/mouse1d/">Mouse 1D</a>

<li><a href="/learning/basic/mouse2d/">Mouse 2D</a>

<li><a href="/learning/basic/mousepress/">MousePress</a>

<li><a href="/learning/basic/mousesignals/">Mouse Signals</a>

<li><a href="/learning/basic/easing/">Easing</a>

<li><a href="/learning/basic/constrain/">Constrain</a>

<li><a href="/learning/basic/storinginput/">Storing Input</a>

<li><a href="/learning/basic/mousefunctions/">Mouse Functions</a>

<li><a href="/learning/basic/keyboard/">Keyboard</a>

<li><a href="/learning/basic/keyboardfunctions/">Keyboard Functions</a>

<li><a href="/learning/basic/milliseconds/">Milliseconds</a>

<li><a href="/learning/basic/clock/">Clock</a>

<h3>Arrays</h3>

<li><a href="/learning/basic/array/">Array</a>

<li><a href="/learning/basic/array2d/">Array 2D</a>

<li><a href="/learning/basic/arrayobjects/">Array Objects</a>

<h3>Objects</h3>

<li><a href="/learning/basic/objects/">Objects</a>

<li><a href="/learning/basic/multipleconstructors/">Multiple Constructors</a>

<li><a href="/learning/basic/compositeobjects/">Composite Objects</a><br/>

<li><a href="/learning/basic/inheritance/">Inheritance</a>

<li><a href="/learning/basic/neighborhood/">Neighborhood</a>

<h3>Web</h3>

<li><a href="/learning/basic/embeddedlinks/">Embedded Links</a>