The Gradient @thegradient

0 posts0 participants0 posts today

**aBe** @hamoid@genart.social · Apr 12

Apr 12

aBe @hamoid@genart.social

Pack and go

#CreativeCoding #OPENRNDR #PGS
#Kotlin #generative

Code generated design. A bright background covered by irregular shapes of various sizes. The shapes are packed trying to cover all the space while keeping a distance between them.

The design is rendered twice, the second time rotated 90 degrees with blend mode ADD, giving the shapes a inner texture.

The shapes may look like stones placed on the ground to create a path.

The shapes are low-poly but with rounded corners.

**aBe** @hamoid@genart.social · Apr 12

Apr 12

aBe @hamoid@genart.social

This does something weird to my eyes...

Code generated 18x18 grid of deformed circles. Bright on dark background. The shapes are slightly offset from the centers of the grid cells, creating the illusion of seeing black lines in places where you are not looking. The lines disappear when trying to see them.

#opart #opticalIllusion #CreativeCoding

**aBe** @hamoid@genart.social · Apr 11 *

Apr 11 *

aBe @hamoid@genart.social

The program no longer crashes and the fix was simpler than I thought.

Instead of comparing rounded doubles (what a silly idea) I did the proper thing, which is abs(a - b) < epsilon. A lot of times Takes maybe half second to generate the design. Then I can pan, zoom and rotate to find a screenshot I like.

I'm thinking that the lines that end in lonely places should end with a tiny knot. I may try that next.

Code generated design with 8 shapes arranged around the center. One of the shapes seems to be arriving late to the party. The shapes are made out of many almost-straight thin dark curves, looking like some kind of digital cellular organisms crossed with city plans. In each shape two strokes are highlighted: one with light blue and another with orange.

#CreativeCoding #OPENRNDR #Kotlin

**aBe** @hamoid@genart.social · Apr 10

Apr 10

aBe @hamoid@genart.social

This iteration has been a big challenge: Generate shapes, get their concave hull, pack those hulls, calculate the transformation matrices mapping the original hulls to the packed ones. Apply those transformation matrices to the original shapes. Finally play with a 2D camera to find the right shot.

And I still have an interesting rounding bug which doesn't fit in this description :)

Code generated design made out of a few non-overlapping shapes, which are made out of hundreds of non-crossing curves curves. The lines obviously follow rules, but the rules are not obvious. There seem to be core lines, and other lines emerging from those. Very few curves are highlighted with two different colors. The color palette was sampled from old maps.

This version shows a close up of about 7 or 8 shapes, some of them cropped on the edges of the window.

#CreativeCoding #OPENRNDR #Kotlin

Continued thread

**aBe** @hamoid@genart.social · Apr 8 *

Apr 8 *

aBe @hamoid@genart.social

In this iteration I highlight two contours per shape, and bend the contours slightly.

See the alt text for more details.

Code generated 3x3 grid of line based compositions on white background. Each composition has numerous thin, curved black lines, one thick orange line and one thicker gray line. The orange line highlights the longest contour. The gray line the contour with most segments. Some compositions are simpler, with few lines.

To me it appears like somewhere between organic and digital.

Code generated 3x3 grid of line based compositions on white background. The top right shape occupies 2x2 cells, so there are only 6 shapes in total. Each composition has numerous thin, curved black lines, one thick orange line and one thicker gray line. The orange line highlights the longest contour. The gray line the contour with most segments. Some compositions are simpler, with few lines.

Code generated 2x3 grid of line based compositions on white background. Each composition has numerous thin, curved black lines, one thick orange line and one thicker gray line. The orange line highlights the longest contour. The gray line the contour with most segments. The compositions are more or less round.

#CreativeCoding #OPENRNDR #Kotlin

Continued thread

**aBe** @hamoid@genart.social · Apr 7

Apr 7

aBe @hamoid@genart.social

Ok, I added two more lines of code to rotate the shapes aligning their longest segment to the horizon.

Now I can go sleep :)

Code generated design using the same approach like in the previous image, but using 7 points per hobby curve and all shapes rotated so the longest segment of the shape aligns to the horizon.

#CreativeCoding #Kotlin #OPENRNDR

**aBe** @hamoid@genart.social · Apr 7

Apr 7

aBe @hamoid@genart.social

Playing with https://github.com/micycle1/PGS inside #OPENRNDR

I feel a bit guilty that this is just 4 lines of code But I still like those shapes a lot and want to send them to the #penplotter

A 4x4 grid of somewhat broken shapes drawn with a black stroke on white background. The shapes are generated using the chordal axis method in PGS applied to a random closed hobby curve with 10 points each. The results have many non-crossing lines, often almost parallel to each other, a bit like strange city maps of alien neighborhoods.

#CreativeCoding #Kotlin #generative

**aBe** @hamoid@genart.social · Mar 26

Mar 26

aBe @hamoid@genart.social

I minimal program that draws a circle then grows 150 distorted copies of it.

The core part of the program is about 10 lines of code.

Code generated design. Start by adding a circle to a collection, then repeat 150 times: add a slightly distorted copy of the last shape in the collection.

Close up version in which the largest shapes are partially out of the visible area. Due to the progressive distortion the result might resemble a close-up of a coral.

Code generated design. Black curves on white background. Start by adding a circle to a collection, then repeat 150 times: add a slightly distorted copy of the last shape in the collection.

In this version one can see the full resulting shape. The numerous curves with varying distance produce shades of gray. Most part look smoothly shaded, but in certain parts there are folds and apparent discontinuities.

#CreativeCoding #generative #madeWithCode

**aBe** @hamoid@genart.social · Mar 24

Mar 24

aBe @hamoid@genart.social

I took a walk and collected some textures to use in this one.

Code generated design. Geometric blocks are connected with each other on the edges. The background and the blocks have textures so they look less digital and more organic. The vertices on the block edges have been slightly displaced also to look less perfect.

In this variation there are two vertical shapes, as if standing next to each other and interacting.

#CreativeCoding #generative #abstract

**aBe** @hamoid@genart.social · Mar 22 *

Mar 22 *

aBe @hamoid@genart.social

Not long after one of the big bangs.

Working on a new artwork.

The list of things to try is long

Complex image generated by code using a simulation with many particles. Many colors and organic clustered shapes. No (purposefully) straight lines. Hard to say if its cosmic or microscopic scale.

#CreativeCoding #OPENRNDR #Kotlin

**aBe** @hamoid@genart.social · Mar 20

Mar 20

aBe @hamoid@genart.social

Next iteration where child types depend only on iteration number. Two designs start in one location, the other two start in four locations.

#GenerativeArt #generative #CreativeCoding #OPENRNDR #Kotlin
#geometry #symmetry

Code generated design made out of colorful blocks (yellow triangles, green squares, bluegreen pentagons, blue hexagons, brown 180 degree arcs and dark red 90 degree arcs) touching each other on the sides, which have all the same length.

In this one the design starts with four squares, and children at the same iteration are of the same type. What makes it not perfectly symmetric is that the arcs can be connected in two ways, making it a left turn or a right turn. Also, there's often not enough space for all children, so some are missing. That creates variety.

**aBe** @hamoid@genart.social · Mar 19

Mar 19

aBe @hamoid@genart.social

Some kind of buggy symmetry which probably makes it more interesting than properly working symmetry

This one looks like a bird with a tail and a crest standing on two legs telling someone to come.

Not sure what this one looks like. Maybe a person using a very strange vacuum cleaner full of contraptions.

I can see some kind of human on this one, like running towards a small arc and a weird thing on the head.

#CreativeCoding #OPENRNDR #Kotlin

**aBe** @hamoid@genart.social · Mar 17

Mar 17

aBe @hamoid@genart.social

In this next iteration I thought of adding curved shapes. The trick is to filter out the curved segments of such shapes and only allow connecting on the straight ones.

See, the arc has two curves and two straight segments connecting those curves.

Does it happen to you that you should be doing something else, but you have an idea and don't want to wait to try it out? And then you immediately have the idea for the next step? XD

#creativeCoding #OPENRNDR #Kotlin
#MadeWithCode #geometry

Code generated design made of over 50 shapes. There are 4 types of shapes: triangles, squares, pentagons and 90 degree arcs. The straight segments in all shapes are the same length, allowing to connect them with each other. Gray background, white shapes with black contour.

The final shape has been grown out of a central piece, connecting shapes to previous shapes, in a chaotic branching structure.

Child shapes connected to a parent shape are all of the same type.

Continued thread

**aBe** @hamoid@genart.social · Mar 16

Mar 16

aBe @hamoid@genart.social

Added a simple rule so shapes have children of the same type. A bit more orderly.

#CreativeCoding #OPENRNDR #Kotlin
#Geometry #polygons

Code generated image made out of regular polygons of equal side length touching on the sides. About 30 ~ 40 orange polygons with black contour and gray background. It resembles those designs one can cut with scissors to then glue and create a regular 3D polyhedron.

**aBe** @hamoid@genart.social · Mar 16 *

Mar 16 *

aBe @hamoid@genart.social

I'm writing small programs for a presentation. Programs that are simple to write in one framework or language which would be not so simple to write in different ones.

I feel like printing, cutting and folding it to create a 3D shape, knowing that it would not produce a nice closed one

Code generated design made of squares, pentagons, hexagons, heptagons and octagons of equal side length. Gray background, orange shapes with black outline. The shapes touch another shape in one or more edges. Uses a growth algorithm, trying to add new shapes while avoiding overlap with existing shapes or touching the window borders.

$The Kotlin source code of the program with the imports removed (otherwise the text is too long for Mastodon) fun main() = application { configure { width = 900 height = 900 } program { val contours = listOf(4, 5, 6, 7, 8).map { sides -> val c = regularPolygon(sides, Vector2.ZERO, 100.0) c.transform(transform { scale(50.0 / c.segments.first().length) }) } val result = mutableListOf(contours.random().transform(transform { translate(drawer.bounds.center) })) repeat(100) { val a = result.random() val b = contours.random() val poseA = a.segments.random().pose(0.5, YPolarity.CW_NEGATIVE_Y) val poseB = b.segments.random().pose(0.5, YPolarity.CCW_POSITIVE_Y) val candidate = b.transform(poseA * poseB.inversed).clockwise if (result.none { it.shape.intersection(candidate.shape).area > 0.0 || candidate.intersections(drawer.bounds.contour).isNotEmpty() }) result.add(candidate) } val rounded = result.map { it.roundCorners(4.0 ) } extend { drawer.clear(ColorRGBa.DARK_GREY) drawer.fill = ColorRGBa.ORANGE drawer.translate(drawer.bounds.center - result.bounds.center) drawer.contours(rounded) } } }$

#CreativeCoding #OPENRNDR #Kotlin

Continued thread

**aBe** @hamoid@genart.social · Mar 16

Mar 16

aBe @hamoid@genart.social

Another short #grid based #Kotlin program

import org.openrndr.application
import org.openrndr.extra.noise.primitives.random
import org.openrndr.extra.noise.simplex
import org.openrndr.extra.noise.uniform
import org.openrndr.extra.shapes.operators.roundCorners
import org.openrndr.extra.shapes.primitives.grid
import org.openrndr.math.IntVector2
import org.openrndr.math.map
import org.openrndr.shape.ShapeContour
import kotlin.math.pow
import kotlin.random.Random

fun main() = application {
configure {
width = 1920
height = 400
position = IntVector2(0, 1080 - height)
}

program {
extend {
val r = Random(5120)
drawer.contours(drawer.bounds.grid(40.0, 40.0).flatten().filter {
Boolean.random(0.9, r)
}.map { rect ->
val scale = simplex(7168, rect.center * 0.001).map(-1.0, 1.0, 0.1, 1.0)
ShapeContour.fromPoints(rect.contour.segments.map {
it.position(Double.uniform(0.0, scale, r).pow(2.0))
}, true).roundCorners(5.0)
})
}
}
}

#OPENRNDR #MadeWithCode #CreativeCoding

**aBe** @hamoid@genart.social · Mar 16

Mar 16

aBe @hamoid@genart.social

A short #grid based #Kotlin program

A screenshot showing code at the top and the visual result at the bottom. The code is written in Kotlin using OPENRNDR. The main 3 lines are these:

drawer.contours(drawer.bounds.grid(40.0, 40.0).flatten().map { rect ->
val scale = simplex(7168, rect.center * 0.001).map(-1.0, 1.0, 0.2, 1.0)
ShapeContour.fromPoints(rect.contour.segments.map { it.position(Double.uniform(scale)) }, true).roundCorners(5.0)
})

The result is a grid of white shapes with rounded corners on black background. The maximum dimensions of each shape are 40 pixels wide and tall. For each grid rectangle, 4 points on the edges are samples and joined to form a polygon, resulting in shapes smaller than the original rectangle. Simplex noise is used to decide how much the shapes are reduced. Some areas are almost rectangular, while others are smaller and more irregular, revealing more black background.

#OPENRNDR #MadeWithCode #CreativeCoding

**aBe** @hamoid@genart.social · Mar 7 *

Mar 7 *

aBe @hamoid@genart.social

For 5 years we've been posting images and videos to this thread in the #OPENRNDR forum.

Maybe some day we can mark it as answered

https://openrndr.discourse.group/t/doodles-wall-c/51/201

@Discourse #CreativeCoding #OPENRNDR #Kotlin #generative

A warm, colorful, symmetric code-generated image taken from a real-time running program. It features 5 layers with radial gradients, 4 of them include X and Y repetition. An additional layer contains an NPoint gradient with a different color in each corner of a square, to give an overall hue tint and break symmetry.

The main visible shapes are a 6x6 grid of circles formed by the gradients, with other smaller and larger circles somewhat visible.

**aBe** @hamoid@genart.social · Mar 6

Mar 6

aBe @hamoid@genart.social

Gradient jungle

Code generated pattern apparently made out of circles.

Actually, it's 5 layers with radial gradients that include transparency, allowing to see lower layers. The colors used are between yellow and green.

The coordinates in each layer have been multiplied, so the back layer has one center, the next one has 2x2 centers, the 3x3 centers, etc.

#CreativeCoding #OPENRNDR #Kotlin

**aBe** @hamoid@genart.social · Feb 28 *

Feb 28 *

aBe @hamoid@genart.social

Playing with the new `gradient { }` feature in orx-shade-styles.

Rendered with only 3 stacked rectangles featuring each a distorted 3-stop quantized linear gradient with the middle stop color being almost transparent (so lower layers are still visible).

Two post effects are applied for the dreamy effect: GaussianBloom and ColorCorrection.

Video https://makertube.net/w/sDAjRyochaez1XgFtykYNJ

Code-generated still image with wavy color bands. The colors range from almost black, dark red up to gold.

The bands are curvy have a predominant vertical direction, but they wrap around a few magnetic poles.

#OPENRNDR #CreativeCoding #kotlin

Recent searches

Search options

Administered by:

Server stats:

#openrndr