"He believed in an infinite series of times, in a dizzily growing, ever spreading network of diverging, converging and parallel times. This web of time — the strands of which approach one another, bifurcate, intersect or ignore each other through the centuries - embraces every possibility."

The Garden of Forking Paths,
Jorge Luis Borges (1941)

Overview

Hypertext gives us opportunities to create designs that are non linear, and atomic. Any point in our designs can link to any other point, at any time, and at the user's sole discretion, assuming we build to account for it. A user of a hypertext needs not only start at the beginning and proceed to the end, but can take any number of paths.

In this project we will build a small website in the manner of a zine containing the content of three related articles from Wikipedia. You will be allowed to edit your articles somewhat but we want to preserve their structure as much as possible, sections, images, captions, end notes, etc in our designs.

Your articles need to be meaningfully connected.

We will consider in selecting our articles what conceptual or textual connections exist between them in addition to existing hyperlinks. What order do you imagine presenting them. Does it change the meaning if you present them in a different way?

Your 'zine' should be designed to be 'non linear'.

You might allow a user to choose where to begin and how to proceed through each section or allow them to navigate between the articles, or within each article, at any time as fits your content. Consider how much control do you give to the user in directing their path through the content and how much do you keep for yourself as the designer?

The design's of your zine should be specific to the content you have chosen.

They can be experimental and idiosyncratic, you need not follow conventions of how websites are normally presented if they aren't in service to your design concept.

Specifically, you should design with emphasis on the typographic system that spans across your three topics. How does it bend across the places you use it while still bringing your zine together as one cohesive whole.

Think about how a user will interact with your site.

Do you envision different people will navigate through your site in different ways? Do you try and support all of them, or some specific set? How the site is navigated needs to be considered in your design. Are you trying to reveal something about your content in how you design and structure your zine? or obfuscate and confuse.

Your final outcome will be a formally and materially complete microsite containing the content from your chosen articles. It should be designed in a manner appropriate for the content and with particular regard to the different ways a user can move through it.

Learning Outcomes

Practice using HTML and CSS.
Develop a sensibility for designing for non linearity.
Learn to design typographic systems for the web.

Requirements

A completed zine containing the content of your 3 chosen articles.
Use hyperlinks to allow different routes through your site.
Design and build your site with an appropriate web typeface.

Grading

Your project grade will reflect the quality of your design and concept, as well as the execution of your final zine.

Calendar

Week 3
TH - kick off

Week 4
MO - review content proposals
TH - review sketches for how to present your content

Week 5
MO - review hifi designs for your chosen direction
TH - workday on building our zines

Week 6
MO - 33% build check in
TH - workday on building our zines

Week 7
MO - project due

Project

Step 0

Due Monday February 10

Choose two different sets of articles you are interested in using as content for your eventual zine. The articles should link to one another, either in a chain, A → B → C, or perhaps all connecting to each in a web.

Good articles should have at minimum 2 pages of content when 'printed'. You'll be allow to edit your articles but we will want to preserve as much of their structure as make sense within our eventual designs. Aim to have at least 6-9 'printed' pages of content total.

You can choose a topic that is interesting to you, or perhaps utilize Wikipedia's Random Article function, but the most important aspect of choosing your articles is finding ones with interesting connections that modify their meaning.

We'll talk about your two different sets of articles on Monday February 10 and pick one to proceed with.

Step 1

Due Thursday February 13

Choosing one of our sets of articles, sketch three potential structures for your zine based on those articles. Focus on the connections between them, and the paths a user might take in reading through them. What paths do you want to support or discourage?

Begin to think about the structure of the articles themselves, how will you present the different sorts of content from your articles, images, captions, end notes, titles.

Your proposed structures could take the form of outlines, sketches, or wireframes. Each of your three proposals should be very different approaches to communicating about your topic.

Do you break the content up across multiple pages or present it as a singular one with internal links? How does a user know where to go and what connections are important? At this stage focus less on final design considerations (type, color, absolute sizes) and more about how you envision your zine to be organized, and how it will be navigated.

After considering the pro's and con's of these different approaches, you'll select one with which to proceed with.

Step 2

Due Monday February 17

For your chosen structure, refine your proposed outlines into high fidelity designs. Design your website in the desktop design tool of your choice (Figma, Photoshop, Illustrator, Sketch, etc). Think about how your design decisions, typography, color, visual rhythm and layout, can reinforce the themes of your zine.

Your designs should be specific in the sense that they should fit your content and concept. Avoid designing a generic template that has nothing to say about your content.

Your designs should be high fidelity in the sense that they should look like screenshots of the final built site. They should be comprehensive, in that they should visualize enough of your final site that there is no question about how your final zine will look or work through any of it's states.

That doesn't mean you need to draw every possible state, simply that you need to draw enough that we know what each state will be unambiguously.

We will review these designs in class and proceed to begin building our zines.

Step 3

33% Review, Due Thursday February 24

At the 33% Review, your content should be complete and present in your HTML and CSS, and the links to navigate your site should be in place, even if the layout or visual design of your site is not final.

Step 4

Due for Final Crit Monday March 3

Present your final zine to the class. Remember to have your zine uploaded to your class site before the start of class.

Wikizine