Styleguide
This is the styleguide for the whole course, including all its assignments and projects. I highly recommend to follow all the rules strictly.
The idea behind this styleguide is to adapt the aesthetics of photograms to create and share a strong, common visual language. This will put all of our works into a coherent context.
We will use Processing and stick to a few visual constants, defining the size and the color theme of the whole project. This is basically the briefing. Everything else is up to you!
This is The Magic Triangle for this course. The Magic Triangle is a powerful creativity-technique to plan self-commissioned, explorative projects.
Basic Geometric Shapes
In the previous course, Creative Coding Essentials, you have learned how to create and control abstract geometric shapes in Processing. Geometry is a fundamental pillar of the Bauhaus aesthetic. These are the basic geometric shapes, for each of which there is also a corresponding function in Processing:
Format
The size of of the sketch must be set to 900*900 pixels. This is a great format for Instagram posts.
Colors
All generated results must be black and white. Whether you decide for a black or a white background is up to you. Depending on which color scheme you choose, your visual will look more like a photogram negative or a drawing on paper.
If you decide to use a light background, please do not use pure white, otherwise the visual will not stand out from the background. With the color value #f1f1f1 you guarantee that your result is well defined on white areas.
// POSITIVE COLOR-THEME
color bg = #f1f1f1; // "bg" stands for "background"
color fg = #000000; // "fg" stands for "foreground"// NEGATIVE COLOR-THEME
color bg = #000000; // "bg" stands for "background"
color fg = #f1f1f1; // "fg" stands for "foreground"A template to get started
If you are not experienced with Processing, a template is mostly a good starting point. Simply copy and paste the code into your Processing editor.
color bg = #000000;
color fg = #f1f1f1;
void setup(){
size(900,900);
}
void draw(){
background(bg);
// Get Creative!
}Related Links
0 comments so far. Click here to share your thoughts.
Related
Creative Coding Barcelona
Community
Livestream – Vera Molnar Reconstructed
A conversation with Yannick Gregoire
Conversations
Lena Weber on Ambiguous Aesthetics
Conversations
Martin Lorenz on the intersection of Creative Coding and Flexible Visual Systems
Community Conversations
DEMO Festival 2022 was a blast
Writings
Key visual for Slate + Ash’s new software instrument
Commissions Projects
Generative portraits for IBM
Commissions Projects
Llum Negra / La Luz Negra / Black Light
Commissions Projects
What is Creative Coding?
Writings
Creative Coding as an Experience
Writings
Building a digital painting studio from scratch with Processing
Workshop: “Algorithmic Adventures” at International Assembly
Workshops
An ode to the Gif
Writings
Curating the DESIGN IN MOTION Festival 2022
unlisted
A conversation with Yehwan Song
Community Conversations
We need a sustainable perspective on life with technology
Writings
2021 was my year of liberation
The best programming language for Creative Coding in 2022
unlisted
Processing Community Day 2021 Recap
“The Infinite Layout Machine” by Michael Kreß
Community Student Work
PCD2021 – Q&A with Casey Reas
Community Conversations
PCD2021 – Vera van de Seyp
Community Conversations
Two Perspectives – Episode 3
Community Conversations
Processing-Tutorial: A Grid of Arcs
Tutorials
Processing-Tutorial: Exploring Wave-Figures
Tutorials
Interactive Grid System (Livestream)
Tutorials
The Hidden Benefits of Learning to Code
unlisted
Creative Coding Manifesto 2021
Writings
My Story (part 2 – told at Taaalks Conference 2020)
New Course: Bauhaus Coding Workshop
unlisted
Learnings from the Bauhaus about Art and Technology
Writings
Constants & Variables
Community Conversations
TypeMachines – A workshop at écal Lausanne
Workshops
My Story (Part 1)
Writings
Processing-Tutorial: Rasterize 3D
Tutorials
Processing-Tutorial: Image-Rasterizer
Tutorials
Processing-Tutorial: Kinetic Typography 1
Tutorials
My 10 favorite Processing-libraries
4 alternative, free and well-curated resources for images, fonts and data
unlisted
Processing or p5.js? My opinions
Protected: A conversation with Soyun Park
Conversations
Talk at Elisava w/ livestream
Martin and I as guests at TAAALKS
Conversations
New course draft: Molnar Reconstructed
