3 approaches to
data-driven generative art
Ada Ada Ada - Die Angewandte Wien 2022
Today's agenda
Who is Ada Ada Ada?
3 approaches to data-driven generative art
Representation · Quantitative data
Non-fungible Identities · Abstract data
Klyft · Temporal data
Free code giveaway!
https://ada-ada-ada.art/linktree
Who is Ada Ada Ada*?
*: a.k.a. Ada Hyldahl Fogh she/her
Co-founder of Circuit Circus
Interactive art studio. Physical installations. Bodily experiences.
Exhibitions at SXSW, Roskilde, Århus Havn, Medical Museion and more.
Prev. Head of Tech at Organic Basics
Low-impact Website. Impact Report. Compensation committee.
Independent hybrid artist since late 2021
Intersectional eco-feminism. Gender and algorithms. Design and programming.
3 approaches to data-driven generative art
Representation
A generative art data visualization of
gender representation in parliaments of the world
https://www.fxhash.xyz/generative/slug/representation
Non-fungible Identities
thispersondoesnotexist.com
behindthename.com API
OpenAI GPT-3
custom algorithm
face-api.js age recognition
p5.js
https://non-fungible-identities.art/
Klyft
An eco-feminist temporal data visualization of
climate change and gender gap projections
https://www.fxhash.xyz/generative/slug/klyft
Representation
Noise texture
Gradient circles drawn as lines
Tiny label
Data set determining the gradient
Started with a different dataset
It was a visualization of how gender markers work in national identifiers
E.g. Denmark uses even numbers for women and odd numbers for men.
Each iteration would get a "fake" ID, e.g. 0101011970.
The gender of that ID would be visualized for 6 different countries.
But Ada… That sounds really convoluted!
The dataset had multiple issues
1. It was too convoluted to understand.
2. I didn't really have data for more than 20-25 countries. Most of them were in Europe.
3. Some of the identifiers didn't have gender markers, which muddled the concept.
I quickly found another, much simpler and more complete dataset:
gender representation in parliaments.
But I liked the circle
I started playing with grain after
seeing the effect on fxhash
Gradients also started showing up at this time
But it was a bit too much,
so I simplified again
I added placement variety
I added size variety
And I made it responsive
Non-fungible Identities
thispersondoesnotexist.com
behindthename.com API
OpenAI GPT-3
custom algorithm
face-api.js age recognition
Technical breakdown
Poster:
p5.js
Webpage:
Vue.js
Data fetching & generation:
Node.js
Step one:
Take an image and some basic data
and start experimenting in Illustrator
Step two:
Start building the website around it
Step three:
Experiment some more with poster design
Step four:
Simplify!
Step four, part 2:
Simplify! Again!
Step five:
Print and feel.
Final result:
Simple. Legible. Eerie.
Klyft
Early on, I knew that I wanted to work with gender gap data,
so I made a literal gap using perlin noise to make an interesting shape.
I did this for a while
When stuck, making moodboards can really help
At some point,
I stepped away from the data and just made something simple and completely different
I even went back to messing with circles
Then I grabbed the penline function from this unreleased project…
… and started experimenting with it
And then I went back to gaps
I even animated them so I could share it on Twitter, but compression messes up my beauties completely 😂
At this point I found out that I had to show it at Art Basel on a 16:9 vertical screen, which I wanted to embrace
At this point, I started to feel like it wasn't interesting enough to visualize the gender gap
So what about combining one data point with another?
Why not embrace my eco-feminism and combine eco & feminism for the first time in one artwork?
I had previously used glitches in One Point Five Degrees Celcius, another climate artwork
The added climate change layer utilized a glitch aesthetic to symbolize carbon emissions
It still felt a bit empty, so my girlfriend suggested I started doing something with the background
At this point, I could start adding variation, colors, easter eggs, key interactions, as well as test for bugs, different resolutions and more.
What. A. Journey.
Free code giveaway
Making circles without ellipse() or circle()
Aligning text
The non-fungible identities way
Another way
Drawing penlines
Questions?
Questions?
Questions?
Questions?
Questions?
Questions?
With love,
Ada 💕
🌐
ada-ada-ada.art
🐦📷
@ada_ada_ada_art
👤
non-fungible-identities.art
🐘
@ada_ada_ada@genart.social