Thursday, 7:00pm - 9:40pm, 66 5th Ave, Room 716, Taught by John Provencher.
Websites are a dynamic and performative medium that are frequently replaced/misplaced by corporate digital frameworks.
Students in this course will analyze why this is — while practicing skills in researching, sketching, graphic design, writing, development (HTML, CSS, JS) and deployment.
By the end of the course, students will have published 2 websites along with a course website and various exercises.
↳ full syllabus
exercise 1—show and tell (09.05)
Set up a simple HTML page to share a past or current project. This exercise requires 2 or more images, header title(s) and simple description(s). don't be afraid to add a lot of content. utilize html's default tag styling to display headers(h1, h2 tags) and body text(p, and listing tags). there is no need to use css.
As a reminder, all exercises and reading responses must be uploaded to your class website
html basics
exercise 2—click (09.12)
Pick an artist, musician, writer (or anyone who has a body of work that inspires you) and create 3 html pages that display their work. Each page should be styled using 1 css stylesheet. each page should include a navigation to get to each individual page.
exercise 3—resize (09.19)
Write a generic bio (100—200 words). Feel free to interpret this anyway you'd like. If you get stuck, start by outlining where you're from, why you’re in new york, what your practice entails, etc...
Design a web page with your name, the bio and the date. use responsive strategies discussed in class to typeset a responsive layout. A successful exercise will work on a mobile device.
media queries
exercise 4—wait (09.26)
Create an abstract graphic clock utilizing css animations and javascript set interval functions. Try to use only graphic shapes and typography created in html and css. This should engage the user for at least 30 seconds.
exercise 5—form/function (10.03)
Create a dynamic "logo" tool using your name. Users should be able to modify the design of your name to create an array of outputs. Utilize the input functions we created in class and experiment with different outputs. What other things can the user change?
⚭ P1: Interface for a Bot
Create a website with an interface that allows the user to interact with a "bot". This "bot" should have at least 10 variants of visual or written outputs triggered by inputs on the interface. The responses can be randomly generated or pre-determined.
⚭ Requirments
weekly requirements will outlined below. Students are expected to bring in progress each week as we will be discussing 1-1 or in groups. Check back to see what will be expected each class.
⚭ Week 1—Presentation (10/10)
Propose the concept of your bot interface in the form of a 5-10 slide presentation. The contents of the presentation answer the following questions:
(1) What is the concept for your bot?
(2) What kind of inputs does the interface have?
(3) What are the outputs (10 minimum) of the bot?
(4) How will the concept of your bot influence the visual style of the interface?
⚭ Week 2—Begin to Sketch With Code (10/17)
We've discussed approaches to plan your site in class. From here, begin to Experiment and iterate with code! You should be creating a lot of options in this week.
Bounce between coding and sketching or writing on paper. What feels right? How can the structure lend itself to the interactions and flow?
⚭ Week 3/4—Rough Draft Prototype (10/24)
Take a first stab at putting all of the pieces together in a rough draft: How does your content, structure, flow and interactions come together? What's the visual language for your interface? The draft doesn't have to be fully functional but you should start to identify what needs to be done.
⚭ Week 5—Produce and Submit (11/07)
Refine and submit your project to your class site. What would the URL be? Does the site have a fav icon?
♲ P2: Website as performance
Create a low-energy (high performing) website that expresses an original text on a mobile device.
♲ The contents of the site should be 100% text-based, ranging anywhere from 50 to 500 words of original text.
♲ The text should be expressed using as little energy as possible: relying primarily on HTML, css and minimal javascript.
♲ Week 1—Presentation (11/14)
Create a concise presentation 3-5 slides answering the following:
(1) What is the content of your text?
(2) How will your text be performed?
(3) Bring 1 website to show and tell
⚭ Week 2—Begin to Sketch With Code (11/21)
We've discussed approaches to plan your site in class. From here, begin to Experiment and iterate with code! You should be creating a lot of options in this week.
⚭ Week 3/4—Rough Draft Prototype (12/05)
Take a first stab at putting all of the pieces together in a rough draft: How does your content, structure, flow and interactions come together?
⚭ Week 5—Produce and Submit (12/12)
Refine and submit your project to your class site. What would the URL be? Does the site have a fav icon?