Variable System

“... ther’s a fuzzy spectrum between graphic design, which might ask: ‘what does the interface look like?’, and software design, which asks: ‘what’s the algorithm beneath the surface that’s organizing the data.’”
– Dan Michaelson

In this project, you will develop a typographic diagram — a system — for a chosen collection of data. Here, “data” is a loose term for a collection of relational content.

Whether on Cargo collective or a static website, your content is organized by a particular logic. As designers, we provide a visual interface into this organizational system; a diagram of sorts. Diagrams can hold intentions — to explain with a particular perspective, to motivate, to question.

Digital systems today are often designed for a general purpose: maximum engagement and data extraction, driven by surveillance capitalism. For our project, however, we will design one with a focused purpose in mind — and curate our visual and interactive palette accordingly. This system may not necessarily be practical or functional; however, it should be driven by a specific context or point of view.

Project Details

Create a website that showcases intentionality in its organizational approach.

Design Questions

  • How does the way you organize your data embody your attitude towards this?
  • How does the typography and interactivity signify the visitor’s relationship to the data?
  • How does the system evolve?
  • Often, real data comes in different shapes and sizes. Do you — or do you not — mold the data into more consistent items?
  • What matters to you? To your visitors?
  • How can you encourage meaningful behavior?
  • What options do we have? What are our defaults? What are our limits?

Technical Learnings

  • How does a system support its controls and variables?
  • How might your data respond to the network conditions it has access to? (Relations to other bodies of data?)
  • How do you iterate through a series of data and respond to the various scenarios it presents?
  • How do you codify your logic?
  • What are formats in which data is stored on the web?

Project Schedule

Week 1: Prepare your data and experiment with its display

Design at least two iterations of your website. What is the hierarchy of information? How is it organized, and how does someone experience it?

Pay close attention to your collection. What meta data is available here, and which of those do you choose to surface?
Provide a structure for your data in a spreadsheet format.

Note, the term “data” may be anything you would like to collect: a narrative through notifications, a calendar of microseasons, a collection of activist resources, an index of links, a curated list of recipes.

You must have at least 30 “points” of data. Your data may be manually collected and stored, or you might hook it up to a live data source.

You may also begin to implement your data containers in code.

Week 2: Develop the site functionality

Choose a direction and further develop your website.

Week 3: Refine

Refine the typography and interactive experience of your website.

Technical Resources