• Ê
  • Â

5 Week 2: Abstract Forms

Above is a video of how I suggest thinking about your patterns. Start with a concept/direction/codebase that you’re interested in, then be open to playing with it to find your result. I suggest using the Web Inspector.

4 Blog / Week 2: Abstract Forms   b Add comment

Leave a Reply

Modern Spice is a fairly intricate pattern where four bands of color intersect to create a total of ten different tones (four main colors plus the six blended combinations). This beautiful overlay of color on top of color recalls Anni Albers’s 1930 tablecloth design and textile (in the collection of The Museum of Modern Art), an even more intricate pattern of line and color. Within the complexity of Wright’s and Albers’s patterns is a simplicity of overall effect that befit the modern interior in 1930s Germany and 1950s America and makes them timeless even today.

Read more about it

4 Week 2: Abstract Forms   b Add comment

Leave a Reply

í Assignment 4: Make five patterns
September 20

Due next week

Absolute positioning may be ideal for creating a drawing or a simple layout, however it falters quickly when many elements start stacking up. The web, in short, is not about control. This take-home assignment asks you to take specific elements and repeat them to form a continuous pattern. The pattern may be created from the combination of floating elements and positioned elements.

Start by repeating a single element. Consider refining this first step into a single composition. Note the figure and ground relationships that emerge. Expand your work to include more layers and more shapes. Use only one color per layer.

Upload your experiments to a post on this website and categorize it under “4: CSS Patterns”.

CSS Properties from class

Code examples from class

To come

Sample properties

Refer to some of these css properties to help
Shape reference (week 1)

Additional examples

b Add comment    

Leave a Reply

í Assignment 3: Create an abstract composition
September 20

Work in class

Wade Guyton

Create a single abstract shape — a shape that does not need to represent something real (a concrete object). Your shape should be one single HTML element (a div) with a single class of CSS properties. Upload your HTML to the site and insert it into a post as an iframe and categorize that post in the “3A: Abstract shapes” category. Add a link to the HTML file so it’s easy to download. Take no more than 20 minutes to make your shape.

After your shape is uploaded, choose two shapes from the class set and create a unified composition. By unified, your elements may touch, overlap or more generally form an aesthetic connection with each other. Your intention is to make one form from your two shapes. How can you create the same tension, dynamism and joy that the printed examples above demonstrate? How does the canvas of the screen house your work? You will likely need to adjust the CSS properties to create a unified composition. Make more than one if you like.

Take a screen capture of your finished composition and upload to the website with a link to your HTML file. Categorize the post as 3B: Abstract Compositions

Sample code

CSS Properties from class

Code examples from class

Sample properties

b Add comment    

Leave a Reply

B “Geometrics”, Frank Guille
September 20

Baseline Magazine

b Add comment    

Leave a Reply

B 10 Print

10 PRINT is a book about a one-line Commodore 64 BASIC program, published in November 2012. Book purchases support the nonprofit organizations PLAYPOWER (to which all royalties are being donated) and The MIT Press, the book’s publisher.

Read the book as a pdf (50 MB), provided under a Creative Commons BY-NC-SA 3.0 license.

Read a review from Slate Magazine.

b Add comment    

Leave a Reply