account and count
preface
account and counting
an art, programming, visual experiment to demonstrate
- how painting and writing relates together
- why they are similar, if not even the same “painting is writing vice versa” <-> “the mind picture”, imago, imagine Writing and painting happened in and on the same materials. They share the same technical implementations: stone and carving, pen and paper, print, the digital sphere, which relies on binary data, numbers.
why account and counting
It is the simples form of note taking which is still painting, drawing, scratching though a transitional, a transfer media even over the time and ages down to binary, up to the digital media
social, historical background of the artworks
account and counting Part1 numeric systems like duodecimal(dozen) versus decimal -> time trekking/tracking, traces -> periodical systems -> Meander <- flow
other (non)numeric systems of (ac)counting
account and counting Part3 (ac)counting in the visual arts, prehistoric, early history, historical, modern and nowadays Chauvet Cave, …, …, Hanne Darboven etc. account and counting Part2
the experiments
- “free”-lines
lieschen mueller | © June 2024 |
---|---|
“free”-lines on the grid collection_bm_wave_10.html |
/*
* The JavaScript code creates a dynamic canvas-based visual effect.
* It begins by importing a module named moduleTweetRandom.js and
* then sets up three canvases: the main canvas, a wash canvas,
* and a buffer canvas. These canvases are used to draw and apply
* various visual effects.
*
* Canvas setup:
* The main canvas is appended to the document body,
* and its context (ctx) is used for drawing. The wash and buffer
* canvases are slightly larger than the main canvas to allow for
* offset drawing and blurring effects. The code defines a grid size
* and unit size based on the canvas dimensions.
*
* Pseudo random preparation:
* The tweetRandom and secondaryTweetRandom functions are used to
* generate random numbers, either from the imported module or
* the built-in fallback function. Two functions, variants and
* variantPixels, are defined to generate random pixel values based
* on these pseudo random number generators.
*
* Colour Definitions:
* A set of colours is defined in the colours array, and the canvas
* is initially filled with a specific colour. The brushBackground
* function is responsible for drawing a blurred background using
* Bezier curves. It uses random values to determine the control
* points and orientation of the curves, creating a dynamic and
* randomized background effect.
*
* Drawing the "free"-line:
* The brushWaveLine function constructs a wave-like pattern
* along a line. It uses random values to determine the start
* and end points, as well as the break points along the line.
* The function draws the wave using Bezier curves and applies
* various visual effects such as blurring and shadowing.
*
* Animation and Update:
* The update function is responsible for animating the canvas.
* It uses requestAnimationFrame to repeatedly call itself,
* updating the canvas at each step. The function ensures that
* the background and wave lines are drawn at appropriate intervals.
* The main logic is here.
*
* Window Load Event:
* Finally, the window.onload event triggers the update function
* after a short delay, starting the animation process. The overall
* effect is a dynamic and visually appealing canvas animation that
* uses random values to create unique patterns and effects.
*
*/
- in part(s) of the grid
- automatic writing
lieschen mueller | © September 2024 |
---|---|
automatic writing with fantasy letters on the grid collection_automat_write_9.html |
|
LTR linear automatic writing with lines and squares collection_automat_write_9a.html |
/*
* This JavaScript program dynamically generates
* and draws patterns on an HTML canvas element. It begins by importing
* a module named moduleTweetRandom.js and creating a canvas element with
* a width and height of 512 pixels. The canvas is then appended to
* the document body, and its 2D rendering context is obtained.
*
* Module Import and Canvas Setup:
* The code defines several constants and functions to manage the
* drawing process. The tweetRandom and secondaryTweetRandom functions
* are used to generate random numbers, either from the imported module
* or the built-in fallback function, depending on the availability
* of the module. The variants and variantPixels functions generate
* pseudo random values within a specified range, again using either
* the module's functions or the fallback.
*
* Colour Definitions:
* A set of predefined colours and points are defined, which will be used
* to draw various shapes and patterns on the canvas.
*
* Background Brush Function:
* The brushBackground function fills the canvas with a background colour
* and applies a blur effect. It uses random values to determine the
* positions and control points for drawing Bezier curves, creating a
* textured background.
*
* Letter drawing functions:
* The drawAutomatLetter function draws complex shapes based on
* predefined points. It uses random values to determine the direction
* and position of the shapes, as well as their colours and shadow effects.
* The function also applies a blur effect and draws Bezier curves to
* create intricate patterns.
*
* Block drawing function:
* The drawSquare function draws squares on the canvas, again using
* pseudo random values to determine their positions, colours, and
* shadow effects. It also applies a blur effect and draws Bezier curves
* to create the squares.
*
* Animation and Update:
* The update function is responsible for animating the drawing process.
* It uses the requestAnimationFrame method to repeatedly call itself,
* drawing either a square or a complex shape on each iteration. Because the
* Message is organized linear from left to right the main logic is here.
* The animation continues until a specified maximum number of iterations
* is reached.
*
* Window Load Event:
* Finally, the update function is called with a delay of 100
* milliseconds when the window loads, starting the animation process.
*
*/
- stripe counting as letters
- with triangles
lieschen mueller | © September 2024 |
---|---|
stripe counting as letters, starting with (0-5) and repetition (1-5) 12x12_automat_write_4x4.html |
|
with triangles 12x12_automat_write_tri_4x4.html |
/*
* The JavaScript program dynamically generates and manipulates
* a canvas element to create a visual representation of a grid
* with various patterns and colours. The image is a model to assemble
* the three dimensional block. That's why an outer ring and an inner
* grid exists. Here's a detailed explanation of the code:
*
* Module Import and Canvas Setup:
* The code begins by importing a module named moduleTweetRandom.js as TWR.
* A canvas element is created and appended to the document body.
* The canvas dimensions are set to 1024x1024 pixels, but its display size is
* scaled down to 512x512 pixels.
* The canvas context (ctx) is obtained for drawing operations.
*
* Grid and Random Functions:
* The grid size is set to 4, and each unit within the grid is calculated
* based on the canvas width. Two random functions, tweetRandom and
* secondaryTweetRandom, are defined. These functions either
* use methods from the imported module or fall back functions,
* if the module is not available.
* Two additional functions, variants and variantPixels, are defined to
* generate random values within specified ranges.
*
* Colour Definitions:
* An array of RGBA colour values is defined, representing various colours
* with a transparency level of 0.65.
*
* Background Brush Function:
* The brushBackground function is responsible for changing the background
* colour of the canvas. It selects random colours from the colours array and
* applies them to the canvas using various drawing techniques.
*
* Drawing Functions:
* The drawBackgroundBrushStroke function draws brush strokes on the canvas
* using Bezier curves. The strokes' orientation and control points are
* determined by the pseudo random values. The drawTriangleStroke function
* draws strokes within a triangle shape, using different orientations and
* random control points.
*
* Message Building and Raster Creation:
* The buildMessage function generates a message composed of letters and
* layers, each with random properties such as colour and orientation.
* Several functions
* (createLinearRaster, createBoustrophedonRaster,
* createSpiralRaster, createCircleRaster)
* are defined to create different raster patterns based on the message.
* These functions arrange the letters in various patterns like linear,
* boustrophedon, spiral, and circle.
*
* Drawing Rectangles and Triangles:
* The drawRect function draws rectangles for the count of 0(start),
* 1-5(repetition) on the canvas based on the properties of the message
* letters.
* It also calls the drawTriangle function to draw triangles within,
* over or under, the rectangles. The drawTriangle function draws
* triangles on the canvas, using different orientations and control
* points with a modulation by pseudo random.
*
* Animation and Update:
* The update function is responsible for animating the drawing process.
* It uses requestAnimationFrame to repeatedly call itself, updating the
* canvas with new drawings based on the current animation step.
* The init and init2 functions initialize the drawing process by setting up
* the message and raster patterns and starting the animation.
*
* Window Load Event:
* The window.onload event is used to start the initialization process after
* a short delay.
*
*/
account and counting: why painting is like writing
early prehistory (cave of Chauvet, …, Lascaux) red dots, hand, scratches (groups, lines)
directions: linear, boustrophedon, circular, spiral
account and counting systems
- duodecimal vs decimal and -> other systems -> and their history -> time - the figure of meander
- bit and bytes -> the digital transfer
change of writing/reading directions in western history and the influence on painting and it’s reception
dice as the grid and the variants of “dice” cube (6 faces), box (10 faces), frame (8 faces), shovel (8 faces), half-cube (6 faces)
literature which may be used for image generation
- Marlow’s
- Doctor Faustus
- Goethe’s
- Faust Fragment
- Urfaust
- Faust Part 1
- Faust Part 2
- Metamorphosis
- Farbenlehre
- Homer’s
- Ilias
- Odessey
- James Joyce
- Ulysses
- Why Dozen (12) Based Counting Systems Were Preferred Over Metric (10) Ones?
- We start discussing the historical and practical reasons why base-12 systems were often preferred over base-10. This includes reasons such as divisibility (12 divides more easily into smaller parts) and its cultural and historical roots in various civilizations.
- Painting as Writing and Vice Versa
- We explore how both painting and writing act as forms of communication that evoke mental imagery, often referred to as “mind-pictures.” Both translate abstract thoughts into tangible forms, relying on structure, composition, symbolism, and narrative techniques.
- The connection is framed through the lens of accounting (recording, reporting) and counting, suggesting that both mediums involve processes of organizing, structuring, and recounting experiences or stories.
- Historical Perspectives: From Rock Art to Early Writing
- The conversation moves into the evolution of writing and art, beginning with early rock art and handprints, moving through pre-writing schemas, and into formalized written language. This development reflected the role of iterative grouping and the increasing complexity in how humans recorded and transmitted information.
- The historical shift from rock art to early writing was framed as a transformation in both accounting (documenting events or transactions) and counting (organizing knowledge, time, or objects).
- The Meaning of “Accounts” Over the Centuries
- The concept of accounts evolved from simple records to more elaborate forms of storytelling, propaganda, and history painting. We examined how artworks such as:
- Ambrogio Lorenzetti’s Allegory of Good and Bad Government (propaganda),
- Leonardo’s Battle of Anghiari (history painting),
- and Jacques-Louis David’s Oath of the Horatii (legend painting) reflected different aspects of recording human experiences, beliefs, and histories.
- The concept of accounts evolved from simple records to more elaborate forms of storytelling, propaganda, and history painting. We examined how artworks such as:
- Modern Perspectives: Painting as Writing in Data Representation
- We discusses how modern data representation is a fusion of painting and writing, as both fields increasingly blur into each other with the use of visualizations, infographics, and symbolic imagery in the digital age.
- The pros and cons of this convergence is considered, particularly in terms of how it aids or complicates the transmission of information.
- Circular vs. Spiral Structures
- We differentiate between circular and spiral structures. Circular structures return to the same point, representing cycles or closed systems, while spirals expand or progress outward, symbolizing growth, evolution, or open-ended processes. These distinctions reflect different narrative or symbolic approaches in both writing and visual art.
- Writing in 3D
- We explore how writing in three dimensions challenges traditional linear text. This included discussions of:
- Text sculptures (e.g., Jenny Holzer’s work),
- Augmented and virtual reality applications for immersive storytelling,
- Narrative in 3D space through installations or interactive environments,
- And the idea of using architecture or physical space as part of storytelling.
- This expansion of writing beyond two-dimensional surfaces allows for new forms of interactivity and narrative complexity.
- We explore how writing in three dimensions challenges traditional linear text. This included discussions of:
Suggested Structure for Better Flow and Coherence
I. Introduction
- Dozen vs. Metric Systems: Introduce the importance of counting and structure in historical and practical contexts.
- The Connection Between Painting and Writing: Present the idea that painting and writing both serve as forms of visual and mental accounting.
II. Historical Evolution of Art and Writing
- Cave Art to Early Writing: Discuss the transition from rock art to early writing schemas, focusing on the iterative grouping of symbols and the development of pre-writing systems.
- Accounts and Reports Through the Ages: Show how art evolved into a form of accounting for history, events, and propaganda.
- Example Artworks: Include Ambrogio Lorenzetti, Leonardo, Michelangelo, Jacques-Louis David, etc.
- Emphasize how these works served as reports or narratives of events.
III. Modern Perspectives: Data as Visual Language
- Painting and Writing in the Digital Age: Analyze the fusion of painting and writing in modern data representation and storytelling through visual forms.
- Pros and Cons of the Convergence: Explore the benefits and potential pitfalls of this merger in transmitting information clearly and effectively.
IV. Narrative Structures in Art and Writing
- Circular vs. Spiral Structures: Differentiate between the narrative implications of circular and spiral structures, with examples from literature and visual art.
- Meander Figures: Introduce meander figures as another complex form of structure in both painting and writing.
V. Writing in 3D: Beyond the Page
- Text as Sculpture and Installation: Examine examples of how writing can be expanded into physical or virtual spaces.
- Interactive and Kinetic Narratives: Discuss interactive storytelling and kinetic typography as examples of writing in 3D.
- Implications for the Future of Writing/Painting: Thoughts on how three-dimensional writing/painting may continue to evolve.
Roll the Dice Program
future features - an after thought
conversation trac(k)ing
contemporary social
library based
why a library
Libra (♎︎) (Ancient Greek: Ζυγός, romanized: Zygós, Latin for “scales”)
library - a collection of scales, accounts, stories.
selections of methods, variations of code for a VM, virtual machine
different types of virtual machines: linear, boustrophedon, spiral, circular
general features:
Register jumping
Condition of “death”
VM hopping
use of triangles aka “false” direction indicators, palimpsest (layers)
</small></i></small>