Project 4: Editorial

The next phase is our final project — the goal is to engage in editorial design on the web, developing a collection of texts as as a publication. Below are several directions on how you might go about doing this.

General requirements:

• Typeset at least 12 longform articles
• Design at least 2 types of article layouts, in addition to the homepage
• Consider what kind of viewing modes are available for
• Consider the relationship between images & words
• Experiment with how we navigate from one article to another
• Develop a robust typographic identity system, paying careful attention to typographic hierarchy and refinements

a) Web Publication / Anthology

Consider a current area of research. Collect at least 12 full-length articles around this topic. Use the website as a way to organize a large amount of content.

• You might also consider a Project 1 as a starting point for this project; consider what additional texts to collect / generate to develop a full publication.

• Considering our limited direct library access, Anastasiia Raina and James Goggin has collected a large library of readings to browse on Google Drive.

• If you are stuck on collecting content, you could go through a Wikipedia chain: follow a series of 12 wikipedia links to typeset within your website. (Random fact: if you keep clicking the first linked word, you’ll end up on “philosophy”)

b) Open Letters

Consider your website as an outlet to the world around you. Create website as a way to document your day-to-day experience admist the current pandemic crisis. What images did you see? What articles did you read? What’s been on your mind? What questions do you have?

Use this project to write HTML as a daily practice: the length of each post might range from just a few sentences to a full-length essay, but there should be at least one entry every day.

As your content grows, develop the design and framework that contains all of your documentation. How does your website evolve over time?

• Possible adaption: consider this as a public exchange between one other student, in which you both are pushing to the same website / Github repository. Alternate between days that you push and publish to the repository to establish a regular schedule.

Adapted from Fisher: Isolation Diary.

c) Propose your own project

Option C is more like an independent study, in which you will develop your own plan and scope of your new website. You must craft a detailed proposal, including a timeline that outlines a schedule of deliverables for each week.

Some examples of independent projects might be:

• Develop a website for a hypothetical festival / events series
• Learn how to develop a theme to customize an existing CMS
• Develop an information visualization project using APIs and JavaScript

Timeline

Week 1: Planning

• Collect content (texts, images, videos, etc.)
• Map out the information architecture
  • Macro-level: what are the overaching sections of your website?
  • Micro-level: what are is the meta-information for each article?
    • i.e. title, author, date, category, template type
• Determine and sketch out different templates (layout formats) in Illustrator / InDesign. It might be something like:
  • Homepage (A list of articles)
  • Layout 1 (Article)
  • Layout 2 (Interview)
  • General Page (About page)
• Sketch out some style palettes to different versions of your typographic identity system
• We will review your proposal document and your sketches next week

Week 2: Develop site prototype

• Translate your PDF mockups into HTML / CSS
  • Using the structure developed in week 1, flesh out the templates / content-type-specific layouts for each.
• Populate and style as much of your content as possible
• Process your other assets — do your images need to be cropped, processed?
• We will review your live prototype of the entire website next week

Week 3: Add interactivity, CSS illustrations

Week 4: Develop into responsive platform

Week 5: Refine

• Final Crit: May 7