Skip to content

References: 2D Primitive Shapes & Custom Geometries

  1. Bézier curve - Wikipedia - Mathematical formulation and geometric construction of quadratic and cubic polynomial curves using control points. Invaluable for mastering smooth parametric curve generation with p5.js bezier() and vertex functions.

  2. Raster graphics - Wikipedia - Comprehensive exploration of pixel arrays, scan conversion algorithms, and geometric rasterization. Provides essential context on how mathematical vector primitives translate into rasterized canvas pixels on computer displays.

  3. Polygon - Wikipedia - Geometric properties of convex, concave, and complex polygons, vertex ordering, and winding rules. Establishes the topological rules required for building custom closed geometry with beginShape() and endShape().

  4. Learning Processing: A Beginner's Guide to Programming Images, Animation, and Interaction (Second Edition) - Daniel Shiffman - Morgan Kaufmann - Shiffman introduced the intuitive 'connect-the-dots' pedagogical model for vertex geometry, using visual coordinate grids that demystify custom polygon construction for beginning creative coders and students.

  5. Computer Graphics: Principles and Practice (Third Edition) - John F. Hughes, Andries van Dam, Morgan McGuire, David F. Sklar, James D. Foley, Steven K. Feiner, and Kurt Akeley - Addison-Wesley - Hughes and van Dam established canonical explanations for polygon triangulation, scanline rasterization, and parametric curve interpolation that define modern 2D graphics render pipelines and drawing engines.

  6. p5.js Shape Reference Guide - p5.js Foundation - Complete API documentation covering 2D primitives, ellipse modes, rectangle modes, vertex attributes, and contour winding rules with interactive code examples demonstrating stroke and fill parameter options.

  7. A Primer on Bézier Curves - Pomax Guide - An exhaustive, visual, and interactive deep dive into Bézier curve mathematics, control tangents, and subdivision algorithms with live visualizer widgets that clarify complex curve curvature calculations.

  8. Curves and Splines in Computer Graphics - Scratchapixel - Detailed educational lesson on parametric curve evaluation, Bernstein polynomials, and de Casteljau's algorithm for computing smooth visual curves from discrete control vertices in digital rendering systems.

  9. Canvas 2D Path API Documentation - MDN Web Docs - In-depth reference on browser path creation, arc rendering, quadratic curve commands, and sub-path closing mechanisms powering p5.js custom shape drawing functions and contour management on canvas.

  10. Drawing Curves with beginShape() in p5.js - The Coding Train - Video demonstration exploring curveVertex(), stroke caps, and stroke joins, showing how to construct complex organic outlines and closed ribbons in p5.js sketches with live debugging examples.