Graphic Design: Link

“In today’s highly commercialized web of multinational corporations, proprietary applications, read-only devices, search algorithms, Content Management Systems, WYSIWYG editors, and digital publishers, it becomes an increasingly radical act to hand-code and self-publish experimental web art and writing projects.”

— J.R. Carpenter, 2015

Overview

In this introductory studio course, participants will explore the world wide web as an opportunity for self-publishing and gathering.

Why? The web is an incredible opportunity for self-publishing creative work on one's own terms: through a personal website. But it's easy to forget this, as much of the web is corporate today — social media, search engines, startups often looking to capture and sell our data & attention. Things have become complicated, and even some professional web developers don’t know how to build a simple website from the ground up today in 2021. In this studio course, we’ll take a hands-on approach to exploring the web’s foundations and what makes the web the web: links made by humans.

In the first part of this course, you will create a web-based “series” that stems from your own interests and curiosities. It will live on a simple, handmade website that you also create. To do this, we will gradually learn the basics of web markup and programming languages HTML, CSS, and a little JavaScript with weekly fun exercises to practice these skills and gain confidence. Through reading, lecture, and in-class discussions, we’ll also learn about a history of the internet and the web and share interesting & relevant projects, people, and themes alive on the web today. Note this course is designed for beginners and no prior programming experience is required — but it should still be relevant to those at other skill levels.

In the second part of the course, you will design and carry out a thoughtful virtual “gathering” or event somehow linked to your "series." We’ll discuss what makes a meaningful gathering, both offline and online, and how to use the web in new and thoughtful ways synchronously with others. What is lost and what is gained when we do everything (birthdays, weddings, funerals, school, etc.) online in the context of a global pandemic? What makes for a “good” online event? We’ll study different types of events — such as virtual readings, workshops, clubs, performances — and the approaches and platforms we use to make them worthwhile.

In this class, design is understood holistically. Your personal, specific point-of-view is vital in determining your projects’ goals. Then these goals inform all other aspects of your project — including its content, its visual look & feel, and its sequence or pacing. When we make websites, we’ll also look at design principles specific to the web, such as navigation and how the site changes for mobile use. And in forming virtual gatherings, we’ll realize creating a meeting of people is also a creative act and type of design.

Eligibility

This course is open to approximately 10 students.

Please note that this course has a wait-list. If for whatever reason you decide to drop this course, please kindly let me know via email (schwulst@princeton.edu) as soon as possible so that I can give others a chance to get in.

Goals

Through hands-on exercises and projects, this course aims to demystify the web, removing barriers to basic web coding and publishing by focusing on the foundational skills. Also, by zooming out, we’ll remember the web has been designed for all, making it an important opportunity for independent publishing & gathering.

By the end of this course, you will:

  • Have a working knowledge of HTML, CSS, and some JavaScript
    (the markup and code building blocks of the web)

  • Understand the basics of web publishing, hosting & domains

  • Know more about histories of the web and its present

  • Feel more confident in self-publishing & gathering on the web

Class & course design

This course meets virtually for 12 classes.

Since limiting screen time is good for health, this class has two aspects:

Synchronous

☀️

“Sync” time is when we meet together as a class on Zoom every Monday, 1:30–4:20pm EST. Sync time might be best used for active sharing & conversation.

During our sync time, we’ll do a combination of:

  • sharing links & interesting examples
  • project sharing, dialogue, & feedback
  • in-class exercises
  • guest visits
  • exercise review with technical troubleshooting

Asynchronous

🌊

“Async” time is on your own time, between classes. It’s important to keep up with asynchronous material, as it will inform our synchronous sessions and make them more fun and worthwhile.

Each week, you'll receive an email from me on Tuesday with the async material for the week.

The async parts of this class include:

  • skill-based technical guide with exercise
  • reading & video content (articles, lectures) with journal prompts
  • project thinking, sketching, and developing
  • documenting all this in your process journal

Projects

Two creative projects comprise this course:

Project 1. Series

Create a web-based series about something most people think is boring but you think is interesting. It could truly be anything … as long as it has at least 5 (or more) parts, comprising a series. Maybe it’s a podcast, a short video series, an interview series, a quiet place for poetry, a blog or a newsletter … it stems from your pre-existing interests and curiosities. Or it’s a combination of those or something else entirely. You’ll create this series and publish it to the web as a simple, hand-coded website.

Project 2. Gathering

Design a gathering (a meeting of three or more people for a specific reason) which is somehow linked to your “Series” that creates a meaningful & memorable experience for its guests. Maybe this gathering is … a live event or performance of some sort, a reading with a Q&A, a participatory workshop or class, a celebration of some kind, or something associated with a holiday or pre-existing event but with your own spin attached. Remember some of the best virtual events you've attended. What made them great? Consider specific design choices such as invitation (Email? Snail mail / postcard? Billboard? Skywriter?), platform (Zoom? Gather.town? Twitch? Phone call? Something else entirely?) and guest list (who is this for?). Carry out the gathering.

Project development

Since much of this course is focused on technical skill-building, there’s a good chance your projects will still be works in progress even when they are “due.” This is natural, as the web is always under construction. says, "treat deadlines as lifelines."

For the above two projects, we’ll meet three separate times as a class to review progress (see below).

Use these sessions as opportunities to ask conceptual or technical questions to push your project further! Besides these sessions, I encourage everyone to regularly share work inside and outside of class.

  • Possible directions share — Come with three or more different ideas for the overall direction or concept for the project.

  • Informal presentation — Share where the project is at … this is a general in-progress check-in. You probably have some of your content and some of your design.

  • Feedback session — The project feels somewhat complete, in a way. It's more developed. There is enough here for a good dialogue. This is a great time for feedback from class & any invited class guest.

Process journal

The web is always under construction and in progress, so naturally process is a large part of this class.

Throughout this course, you will maintain a process journal that exists as a "Bear Blog." (Bear Blog is a simple, stripped-down blogging service. It supports writing in Markdown, which many other blogging platforms use. You can also add your own custom CSS to it, styling it however you like. Note Bear Blog doesn't have image upload support, so I'd suggest uploading your images to an Are.na channel first, finding their URL, and linking them to your post.)

Each week, you'll update your journal weekly with your project progress (showing your iterations and multiple ideas), your response to the reading / video of that week (which will be in writing and drawing format), and anything else (like references or material you discover) that are somehow useful to you in this class.

This journal is really your space to remember your path of learning in this class, so feel free to make it your own and design it to your liking. Note the best results in creative projects often come from periods of exploring and taking risks, so I encourage you to create multiple iterations and experiments for anything you try and document them in your journal. They might be useful to you later.

Exercises

In addition to the overall projects, there will also be exercises (one exercise per tutorial) that will be assigned to help you learn a specific skill. These exercises should be completed in a timely fashion and uploaded to the class portal (see "Portal" section for more info).

Readings & Video

During the first two thirds of this course, most weeks you'll be assigned some content (article and/or video) to spend time with. You'll respond, reply, reflect to this content in your process journal. Most of this content will be available in the class portal (see "Portal" section).

The second half of this course will only have one required reading, the book The Art of the Gathering: How We Meet and Why It Matters by Priya Parker (2018). You'll receive this book in the mail in the first weeks of the course, and we'll start discussing it in the second half (after spring break).

Virtual gathering reviews

To prepare for your own gathering, attend a virtual gathering and write a review. You'll write your review in your journal and present it during the second half of the course. For your review:

Include...

  • Some details about the gathering (title, time, duration, location, platform, audience, etc).
  • A summary of the gathering

Your take...

  • How did the platform affect the gathering? (Zoom, Twitch, etc).
  • What was the mood or tone of the gathering?
  • What do you think the purpose of the gathering was?
  • How was the gathering was successful?
  • What could be improved?

Grading

Participation — 25%
Process — 50%
Execution — 25%

Portal

https://portal.veryinteractive.net

The class "portal" is a password-protected part of this website that is our class's place for materials (tutorials, readings/video) and a place for each participant to upload their web-based work. We'll learn how to upload to the portal in the second week of the class using SFTP with an FTP client such as Cyberduck. Note that since the portal is essentially a server (a computer always connected to the internet) that we're sharing, we should all be very careful not to accidentally delete files or folders, especially if they're not ours.

Academic integrity

Students will become familiar with using pre-existing language, images, and software as raw material while creating entirely new works. While making websites, we will learn which technologies could be appropriated and how to properly credit their inclusion.

From Academic Integrity at MIT: "Writing Code":

“Writing code is similar to academic writing in that when you use or adapt code developed by someone else as part of your project, you must cite your source. However, instead of quoting or paraphrasing a source, you include an inline comment in the code. These comments not only ensure you are giving proper credit, but help with code understanding and debugging.”

“You should not simply re-use code as the solution to an assignment. Like academic writing, your code can incorporate the ideas of others but should reflect your original approach to the problem.”

Attendance

Attendance is important. I understand things will come up, as they do for us all, and you might miss a session or two. Be sure to make a commitment to attend class ("sync" time) regularly.

Materials

Students should be able to connect to Zoom and have a stable internet connection in ideally a quiet place inside. Students are responsible for their own files, making sure to back them up in some way. For editing and updating code, students should download a code editor such as VS Code, Atom, Sublime Text, Brackets, or Nova. For uploading content to the class portal, please have ready or download an FTP program such as Cyberduck. For digital image-making and sketching, Figma and the Adobe Creative Suite (Photoshop, Illustrator, and InDesign), and your smartphone's camera (or any digital camera) are standard tools. (You'll also use Figma for the Process journal, as described above.) Pencil, paper, and your own imagination are also great and should not be under-valued at any point in the process.

Office Hours

If you'd like to meet with me individually, please make an appointment with me via email (schwulst@princeton.edu).

Code of Conduct

Since we all come from different backgrounds and want to create a safe and open environment for learning, I've adapted a code of conduct to set the foundation for us interacting.

Background

Today more than ever, we need individuals rather than corporations to guide the world wide web’s future. The web is called the web because its vitality depends on just that: an interconnected web of individual nodes breathing life into a vast network. When an individual node links to another node, the web becomes stronger. However, nowadays most of the web’s links live on websites and apps powered by large corporations: search engines like Google, social media like Facebook/Instagram and Twitter.

Artists excel at creating worlds. They do this first for themselves and then, when they share their work, for others. World-building means creating everything, not only making things inside the world, but also the surrounding world itself: the language, style, rules, and architecture.

This is why websites are so important. They allow the author to create not only works (the “objects”) but also the world (the rooms, the arrangement of rooms, the architecture!). Ideally, the two would inform each other in a virtuous, self-perfecting loop. This can be incredibly nurturing to an artist’s practice.

But personal websites can feel lonely sometimes, like islands. Blogger Dan Cohen says, “Human beings are social animals and centralized social media like Twitter and Facebook provide a powerful sense of ambient humanity—the feeling that ‘others are here’—that is often missing when one writes on one’s own site.” How can we create online events and places of social gathering that are generative for independent publishing and personal creation?

I excerpted and adapted the above text from my essay about what a website can be.

Acknowledgements

Thanks to Mindy Seu for co-developing the virtual gathering part of this course and offering feedback on class materials.

Thanks to Aidan Quinlan for their thoughtful courses around a handmade web, and to J.R. Carpenter for writing “A Handmande Web” (which is the source of the opening quote) which we both cite in our syllabi.

Thanks to Laura Coombs, who teaches “Graphic Design: Image” in the fall at Princeton. Thanks for your great ideas around class togetherness and general advice.

Thanks to John Provencher for co-developing Fruitful School with me, whose roots should be evident in this class.

Thanks to David Reinfurt, Martha Friedman, and Kristy Seymour for all your support regarding teaching at Princeton.