De Stijl Generator

Website . Interactive De Stijl Generator 

JavaScript . CSS . HTML

· concept ·

De Stijl Generator is

▪︎  an art-making tool
▪︎  a modern re-creation
▪︎  an experiencial learning opportunity

De Stijl Generator is an interactive website allows people to create their own De Stijl artworks. Through the platform, people could learn by making; to have a different understanding of De Stijl art and the principles of De Stijl through the eyes as a creator.


· context . De Stijl ·

De Stijl

is a Netherlands-based movement embraced an abstract, pared-down aesthetic centered in basic visual elements such as geometric forms and primary colors. The De Stijl (Dutch for “the style”) group was one of several art and design movements that responded to the chaotic trauma of World War I with a “return to order.”

Piet Mondrian is easily the most recognizable and most well known artist from the movement. To Mondrian, the vertical and horizontal elements represented two opposing forces: the positive and the negative, the dynamic and the static, the masculine and the feminine.

Composition with Large Red Plane, Yellow, Black, Gray, and Blue, Piet Mondrian, 1921;
Composition VII (The Three Graces), Theo van Doesburg

· principles of De Stijl ·
Using only rectangular planes, straight lines, primary colors. The form of art restrains its' shape, composition, and color.

· influence ·
The influence of De Stijl is across diverse industries. Including Fashion, Architecture, Graphic Design, Music, Furniture, Fine art and so on.

The White Stripes took De Stijl inspiration for their so-titled album; Mondrian dresses by Yves St Laurent, 1966; Non-Objective I, Roy Lichtenstein, 1964
Red Blue Chair, Gerrit Rietveld, 1918-1923; Microsoft's perfect grid; Ultra-Rare Raf Simons "De Stijl" Hiking Boot

de stijl generator

· homepage ·
De Stijl generator provides three kinds of approach for the user to create their unique De Stijl artwork, based on the principle of De Stijl. Through the experience, users could gain further understanding of the art movement in a fun way.

· canvas one . variable compostion ·
Hover on each small areas, to active and move the patterns inside.
Refresh the page to change the given pattern.

· canvas two . variable shape ·
Drag any corner of the triangles to resize.
Composition and color are fixed.

· canvas three . variable color ·
Click on the color blocks given to pick up a color.
Select any area to fill in with the selected color.

Copyright © 2024 Lu Jia. All Rights Reserved.

visual       ·      multimedia       ·      interaction       ·       archive