Web Design Basics — Fall 2015

Instructor: Ojus Doshi
Email: doshio@newschool.edu
Room: 6 East 16th Street 703

General Schedule:

Wednesdays 7:10–9:40pm

Open Hours

Tuesday 8pm–9:30pm Student Lounge outside of Faculty Resource Center (Room 308 A-D of University Center 63 Fifth Avenue)

Sunday 9pm–10:30pm Skype or Google Hangout by 20-min Appointment Slot via StarFish

Depending on my work schedule, I may not be able to keep these hours consistently. I will let you know if this is the case.

Description

This course is an introduction to web design and development within an overview of current web environments. Projects will cover planning and implementation of websites that offer common (and not-so-common) functionality while learning about the principles of usability, accessibility, and validation. HTML5, CSS3, a wee bit of Javascript and jQuery, as well as information architecture and interactivity will be explored. We will engage with the greater web design community and implications of our digital technology through readings and critical responses. And finally, as we go along, we will cover the basics of effective graphic design, hopefully pairing design and technology such that students begin to appreciate the potential of the web as a multi-faceted communication device.

As Samuel L. Jackson’s character says in the original Jurassic Park, “Hold on to your butts!” We have a lot to cover!

Learning Outcomes

By the successful completion of this course, students will be able to:

  1. produce working prototypes of web pages
  2. have a working knowledge of HTML, CSS and minimal Javascript and jQuery
  3. firmly understand the technology involved in implementing a website
  4. understand how information is distributed online, and how effective design can harness these modes of structuring information
  5. think about the web as a very specific public space, with its own communities, forms of engagement, and modes of communication
  6. implement design principles relating to dynamic media

Assessable Tasks

  • Codecademy tutorials: Codecademy is an online learning platform that has several tutorials on writing code in HTML, CSS, and Javascript. Students will be responsible for completing all necessary tutorials and taking screenshots proving they have done so. Exact specifications for the screen-shot process will be explained in class, will be outlined in the final class documentation instructions, and count toward the “Participation and Effort” section of the final grade.
  • In-class exercises: I believe in learning through constant “doing” in small batches. Exercises will solidify material covered in lecture. At minimum follow the instructions for each exercise, but fun and experimentation are encouraged.
  • Projects: Projects are more in-depth assignments where you put to use technical and design skills you learn from lectures and exercises. This course features 2 projects: a mid-term and a final. They will be graded on the following criteria:

Planning and Preparation — How thorough was research, planning, site sketching and wireframing, etc.?

Content — Did the student meet the minimum requirements for content that must be included in the project as outlined by the assignment instructions? For example, minimum number of images?

Design — How effective were the student’s design choices? Were design principles put to use when creating the website?

Coding — Is the student’s code clean, readable, well-commented, using correct syntax and structure, etc?

Overall — General evaluation of the project outcomes (interesting conceptual exploration, risk taking, craft, striving for originality, etc.)

  • Readings and Responses: Every week this semester, I will assign you readings related to the Internet, web culture, web design, or communication. Read the article and respond in one of two ways: 
    • Written — Generate one open-ended or discussion-type question and then answer it in 1–2 paragraphs. Post the question and your answer to our class website.
    • Visual — Create a visual response using any media. It must include the title of the reading. This is meant to be done quickly (20–30 minutes), not polished and perfect. Consider it the first sketch of something for a title page of a feature article in a magazine. Post your response to our class website. If it is a physical media, post a picture it to the website. When you post, please include 2–3 bullet points explaining your visual.

By the end of the semester, you must post at least 5 responses. You can choose which ones to respond to based on your interest-level in the article and/or amount of other work due that week.

Extra credit for students who generate a response for every article.

Extra Extra credit for students who respond to every article AND have at least 8 visual responses which are in the form of web pages (i.e an HTML document coded from scratch, not merely posting to a blog or existing web infrastructure).

  • Critiques and discussion: Projects will be shared and discussed through a traditional practice in art school — the critique. Expectation is that students will actively engage and comment on their fellow students’ work. Feedback is beneficial for everyone involved and it’s how you get better as a designer.
  • Emailing and Raising Questions: Part of participation is to ask questions if you have them. They benefit everyone, no matter how “stupid” you think the question is. Feel free to stop me during class or jot down some questions and email me immediately after class. Whatever you do, ask until you understand.


    Questions outside of class are another matter. The majority of information we cover in this class is readily available online and can provide answers to many of your immediate questions. Think for yourself, carefully review what you did and what trouble you’re having. Consult Google, consult the recommended books. Ask 2 friends from class. If all else fails, contact me through email, but my work schedule keeps me pretty busy so I may not be able to give you an immediate and detailed answer. Part of being a web designer is learning where to get help on your own.
  • Posting Links to Assignments to Class Website: You will be asked to post reading responses and links to your two projects to the class website. You may be asked to post other materials as I see fit. Additionally, we will use a live document called PiratePad to record class feedback during critique. I expect everyone to be commenting in this way in addition to verbal commentary.

Final Grading Calculation

Attendance, Participation, and Effort: 20%

5 Reading Responses: 5%

Execution of Project 1 (Mid-Term): 20%

Execution of Project 2 (Final): 30%

Execution of Exercises: 25%

TOTAL 100%

*Note: Functionality of all projects and exercises will be evaluated on Google Chrome. Therefore, please use Chrome as your main testing browser.

Students will deliver Project and Exercise files in one digital bundle on the last day of class using USB flash drive or DropBox. A document with a detailed checklist and way to organize this bundle will be posted to the class website before the last week of the course.

Recommended Reading

There is no required reading for the technology and software portion of the class, but the recommended books are:

  1. Duckett, Jon. HTML & CSS: Design and Build John Wiley & Sons, 1st Edition 2011
    ISBN: 9781118008188
  2. Robbins, Jennifer Niederst. Learning Web Design: A Beginner’s Guide to HTML, CSS, JavaScript, and Web Graphics. O’Reilly, 4th Edition 2012
    ISBN: 978-1449319274 

The Duckett book is available for free online though the New School Library’s website. I have also tried to put a physical version on Reserve. The Robbins may be on reserve if my request went through, but otherwise you may have to order it from an online retailer or your local bookstore.

Materials and Supplies

Hardware:

  1. A functioning laptop (Mac or PC) is required*. The newer the model and operating system, the easier it will be for you (and me).
  2. Backup external hard drive. Back up your work every day. EVERY DAY. Multiple times a day is even better. Consider purchasing cloud storage like Crashplan or the paid versions of Dropbox. You are responsible for ensuring all of your work is available throughout the class. I will not accept excuses of “my computer crashed and I lost everything.”

*If you do not have access to a laptop, please see me before class (or send me an email before the first day), and we can make alternate arrangements.

Software:

  1. A Text Editor: Sublime Text (sublimetext.com), TextWrangler, or Brackets are all pretty good and free.
  2. Photo editing and vector illustration software: Standard is Adobe Photoshop and Adobe Illustrator. You should be able to buy student versions through the New School IT website.
  3. User accounts with the following tools and applications:
    1. GitHub
    2. Codecademy
    3. WordPress

Recommended: A sketchbook or notebook for personal use.

Grading Standards

A [4.0; 96–100%] Work of exceptional quality, which often goes beyond the stated goals of the course

A- [3.7; 91 –95%] Work of very high quality

B+ [3.3; 86–90%] Work of high quality that indicates substantially higher than average abilities

B [3.0; 81–85%] Very good work that satisfies the goals of the course

B- [2.7; 76–80%] Good work

C+ [2.3; 71–75%] Above-average work

C [2.0; 66–70%] Average work that indicates an understanding of the course material; passable. Satisfactory completion of a course is considered to be a grade of C or higher.

C- [1.7; 61–65%] Passing work but below good academic standing

D [1.0; 46–60%] Below-average work that indicates a student does not fully understand the assignments; Probation level though passing for credit

F [0.0; 0–45%] Failure, no credit

Grade of W

The grade of W may be issued by the Office of the Registrar to a student who officially withdraws from a course within the applicable deadline. There is no academic penalty, but the grade will appear on the student transcript. A grade of W may also be issued by an instructor to a graduate student (except at Parsons and Mannes) who has not completed course requirements nor arranged for an Incomplete.

Grade of WF

The grade of WF is issued by an instructor to a student (all undergraduates and all graduate students) who has not attended or not completed all required work in a course but did not officially withdraw before the withdrawal deadline. It differs from an “F,” which would indicate that the student technically completed requirements but that the level of work did not qualify for a passing grade. The WF is equivalent to an F in calculating the grade point average (zero grade points), and no credit is awarded.

Grades of Incomplete

The grade of I, or temporary incomplete, may be granted to a student under unusual and extenuating circumstances, such as when the student’s academic life is interrupted by a medical or personal emergency. This mark is not given automatically but only upon the student’s request and at the discretion of the instructor. A Request for Incomplete form must be completed and signed by student and instructor. The time allowed for completion of the work and removal of the “I” mark will be set by the instructor with the following limitations:

Undergraduate students: Work must be completed no later than the seventh week of the following fall semester for spring or summer term incompletes and no later than the seventh week of the following spring semester for fall term incompletes. Grades of “I” not revised in the prescribed time will be recorded as a final grade of “WF” by the Office of the Registrar.

Attendance

  • Two unexcused absences lowers an overall grade one-third letter (i.e., A to A-).
  • Three unexcused absences lowers an overall grade by a full letter (i.e., B to C).
  • More than three absences are grounds for failure or dismissal from class.
  • A lateness that is greater than or equal to 30 mins will be counted as an absence.
  • Three (3) latenesses that are less than 30 mins will be treated as one absence.

Divisional, Program and Class Policies

  • Responsibility
    Students are responsible for all assignments, even if they are absent. Late assignments, failure to complete the assignments for class discussion and/or critique, and lack of preparedness for in-class discussions, presentations and/or critiques will jeopardize your successful completion of this course.
  • Participation
    Class participation is an essential part of class and includes: keeping up with reading, assignments, projects, contributing meaningfully to class discussions, active participation in group work, and coming to class regularly and on time.
  • Attendance
    Parsons’ attendance guidelines were developed to encourage students’ success in all aspects of their academic programs. Full participation is essential to the successful completion of coursework and enhances the quality of the educational experience for all, particularly in courses where group work is integral; thus, Parsons promotes high levels of attendance. Students are expected to attend classes regularly and promptly and in compliance with the standards stated in this course syllabus:

Two unexcused absences lowers an overall grade one-third letter (i.e., A to A-).
Three unexcused absences lowers an overall grade by a full letter (i.e., B to C).
More than three absences are grounds for failure or dismissal from class.
A lateness that is greater than or equal to 30 mins will be counted as an absence.
Three (3) latenesses that are less than 30 mins will be treated as one absence.

Whether the course is a lecture, seminar or studio, faculty will assess each student’s performance against all of the assessment criteria in determining the student’s final grade.

 

  • Blackboard or Canvas
    We will be mainly using this WordPress site. However, depending on how that goes or any feedback from administration, we could switch to using features in Canvas. I will inform you if this is the case.
  • Delays
    In rare instances, I may be delayed arriving to class. If I have not arrived by the time class is scheduled to start, you must wait a minimum of thirty minutes for my arrival. In the event that I will miss class entirely, a sign will be posted at the classroom indicating your assignment for the next class meeting.
  • Electronic Devices
    The use of electronic devices (phones, tablets, laptops, cameras, etc.) is permitted when the device is being used in relation to the course’s work. All other uses are prohibited in the classroom and devices should be turned off before class starts.
  • Academic Honesty and Integrity
    The New School views “academic honesty and integrity” as the duty of every member of an academic community to claim authorship for his or her own work and only for that work, and to recognize the contributions of others accurately and completely. This obligation is fundamental to the integrity of intellectual debate, and creative and academic pursuits. Academic honesty and integrity includes accurate use of quotations, as well as appropriate and explicit citation of sources in instances of paraphrasing and describing ideas, or reporting on research findings or any aspect of the work of others (including that of faculty members and other students). Academic dishonesty results from infractions of this “accurate use”. The standards of academic honesty and integrity, and citation of sources, apply to all forms of academic work, including submissions of drafts of final papers or projects. All members of the University community are expected to conduct themselves in accord with the standards of academic honesty and integrity. Please see the complete policy in the Parsons Catalog.It is the responsibility of students to learn the procedures specific to their discipline for correctly and appropriately differentiating their own work from that of others. Compromising your academic integrity may lead to serious consequences, including (but not limited to) one or more of the following: failure of the assignment, failure of the course, academic warning, disciplinary probation, suspension from the university, or dismissal from the university.
  • Student Disability Services (SDS)
    In keeping with the University’s policy of providing equal access for students with disabilities, any student with a disability who needs academic accommodations is welcome to meet with me privately. All conversations will be kept confidential. Students requesting any accommodations will also need to meet with Jason Luchs in the Office of Student Disability Services, who will conduct an intake, and if appropriate, provide an academic accommodation notification letter to you to bring to me. SDS assists students with disabilities in need of academic and programmatic accommodations as required by the Americans with Disabilities Act of 1990 (ADA) and Section 504 of the Federal Rehabilitation Act of 1973. http://www.newschool.edu/studentservices/disability/.