Syllabus

Introduction

About this course

Code and design are not opposite ends of some spectrum, and they share more commonalities than you might expect. Both can be expressions of creativity, require problem-solving strategies and can solve real-world problems.

This class will be a hands-on exploration of the important skills, tools and considerations for modern front end web development. You will create and be evaluated on web projects: how they perform in the browser, on mobile devices and the code you wrote to get those results. You will also work collaboratively with your colleagues to identify project goals and evaluate your success in achieving those goals.

Course Details

Catalog Description

This course will introduce modern and advanced web design technologies, building on the foundations from Graphic Design 2 and Web Design. Students face unique problems when designing for the web, and the course will provide an opportunity to analyze problems and implement appropriate solutions both conceptually and technically, through hands-on exercises and projects using HTML, CSS and JavaScript.

Prerequisite: GD 220 or Graduate Graphic Design student standing
Format: 3 credit studio

Learning Outcomes

As part of this course, you will:

  • Evaluate websites based on inclusive design principles
  • Use and justify semantic markup
  • Identify strategies for writing and organizing your CSS
  • Demonstrate an ability to work as part of a web development team
  • Practice using version control in your web projects, including git commits, branching and pull requests

Format

This studio course will be offered online in a mostly asynchronous format.

👉🏻 This does not mean you’re learning on your own or that there will not be deadlines. We will be connecting via Slack and Zoom throughout the course. I will be providing feedback on all your work.

At the beginning of the course, we will jointly determine the best use of the scheduled course time (Thursdays, 4–10pm) and when and how often to hold any synchronous meetings.

Expectations

Course Communications

  • Zoom will be used for meetings, including small groups, whole class and 1:1.
  • Canvas will be used for posting grades for all assignments, including participation. That’s it. 😬
  • A combination of GitHub and Google Drive will be used for submitting your assignments.
  • All other class communication will occur through the class Slack.
  • 📧 Before these other methods are set up, some communication will occur using your preferred email. Essentially, after week 1, I won’t rely on email unless all other forms of communication fail. 🙈

Assignments & Grading

Coursework will include:

  • Short quizzes about the readings or knowledge and skills you’re building; these will be ungraded and count toward your course participation grade.
  • Activities, including
    • writing in response to course readings;
    • small exercises to demonstrate and experiment with your growing HTML, CSS and JavaScript skills;
    • checkins to prove you’re on schedule with multi-week projects;
    • presentations of your process, designs and finished work;
    • peer review of your colleague’s design and code.
  • 3 major multi-week projects that will showcase your designs and demonstrate your growing coding skills

Activities are graded on scale of 0-3 based on your effort:

  • 0: Didn’t do the assignment.
  • 1: Did the bare minimum.
  • 2: Some effort.
  • 3: Meets expectations.
    This is like a slightly more graduated pass-fail. The intention is that a couple of 1s won’t wreck your grade, but a semester of 1s will prevent you from getting an A.

The multi-week projects are graded on a traditional scale of 0-100 against a rubric (example here) which is shared at project kickoff. Detailed feedback will be provided for each project via GitHub review.

Projects account for the bulk of your semester grade – 60%. The remainder is between activities (25%) and participation (15%).

Deadlines are paramount; missing deadlines almost always results in you receiving feedback and evaluation later than your colleagues. Late activities can be submitted for feedback, but will be ungraded and receive a zero. Barring exceptional circumstances, late projects will receive a grade no higher than a C (79%).

Attendance & Participation

In lieu of a strict attendance policy, you are expected to participate in this course on a weekly basis. Participation will take the form of short, ungraded quizzes on the week’s content; being responsive in the class Slack; completing and submitting assignments on the expected schedule.

If you are unable to participate during a given week of the course, please notify me as early as possible via DM on Slack.

Anticipated Costs

Short answer: $0

This course requires access to a laptop or computer that you can install software on and software to create your designs (e.g., Adobe Illustrator, Sketch). As your instructor, I have zero preference about which software you use for creating your designs or which operating system you use (i.e., you do not need a Mac).

No additional services or purchases are necessary to complete this course. All other materials, including readings and tools, are freely available online.

Schedule

  • WEEK 1: Intro to the course + understanding the Internet, your first git commit 🎉
  • WEEKS 2-3: Review of CSS + HTML, discussion of best practices
  • WEEK 4: CSS box model
  • WEEK 5: Intro to Sass + responsive design
  • WEEK 6: CSS animation
  • WEEKS 7-8: UX evaluations
  • WEEK 9: Mobile-first navigation
  • WEEK 10: Accessibility
  • WEEKS 11-12: Static site generators
  • WEEK 13: No class 🦃
  • WEEKS 14-15: Interaction + JavaScript
  • WEEK 16: Presentation of final projects

More detail about the weekly schedule will be provided on the course web site.

Practical Advice

Be prepared to put in effort in this class and to struggle. Writing code is strange and can be unforgiving. Everyone writes code that either doesn’t work as anticipated or breaks. I cannot teach you to code without these experiences — but I can and will teach you strategies for learning from and resolving broken code.

Back up your work — regularly, often, and in more than one location (i.e., locally and in the cloud). We will discuss and implement strategies for backing up your code, but you should also consider where and how often you back up your design files, notes, etc.

Overcommunicating should be the norm this class, especially when it’s delivered online. Use the class Slack to connect with your colleagues and with me. Don’t be a stranger and please reach out when you’re confused or struggling. My job here is to teach you things; if you’re confused or struggling, give me the opportunity to get it right.

Professor Contact Info

Please default to contacting me via Slack. I generally check the course Slack at least once a day and am far more likely to see your question or request there than in my email inbox.

Email

cswinehart@mica.edu (but, really, use Slack 😬)

Office Hours

During the semester I can occasionally meet for 30 minute sessions to discuss your projects or code. DM me on Slack and we can figure out a mututally agreeable time to chat.

MICA Academic Policies

💡 You may also view this information on the MICA web site

Academic Disability Accommodations

MICA makes reasonable academic accommodations for qualified students with disabilities. All academic accommodations must be approved through the Learning Resource Center (LRC). Students requesting accommodation should schedule an appointment at the LRC (410-225-2416 or e-mail LRC@mica.edu), located in Bunting 110. It is the student’s responsibility to make an accommodation request in a timely manner. Academic accommodations are not retroactive.

Environmental Health and Safety (EHS)

Students are responsible to follow health and safety guidelines relevant to their individual activities, processes, and to review MICA’s Emergency Operations Plan and attend EHS training. Students are required to purchase personal protection equipment appropriate for their major or class. Those students who do not have the proper personal protection equipment will not be permitted to attend class until safe measures and personal protection are in place. Fall 2021: Students are expected to abide by the MICA Social Contract for Students to help prevent the spread of COVID-19.

Plagiarism

Each discipline within the arts has specific and appropriate means for students to cite or acknowledge sources and the ideas and material of others used in their own work. Students have the responsibility to become familiar with such processes and to carefully follow their use in developing original work.

Policy

MICA will not tolerate plagiarism, which is defined as claiming authorship of, or using someone else’s ideas or work without proper acknowledgement. Without proper attribution, a student may NOT replicate another’s work, paraphrase another’s ideas, or appropriate images in a manner that violates the specific rules against plagiarism in the student’s department. In addition, students may not submit the same work for credit in more than one course without the explicit approval of all of the instructors of the courses involved.

Consequences

When an instructor has evidence that a student has plagiarized work submitted for course credit, the instructor will confront the student and impose penalties that may include failing the course. In the case of a serious violation or repeated infractions from the same student, the instructor will report the infractions to the department chair or program director. Depending on the circumstances of the case, the department chair or program director may then report the student to the appropriate dean or provost, who may choose to impose further penalties, including expulsion.

Appeal Process

Students who are penalized by an instructor or department for committing plagiarism have the right to appeal the charge and penalties that ensue. Within three weeks of institutional action, the student must submit a letter of appeal to the department chairperson or program director, or relevant dean or provost related to the course for which actions were taken. The academic officer will assign three members of the relevant department/division to serve on a review panel. The panel will meet with the student and the instructor of record and will review all relevant and available materials. The panel will determine whether or not to confirm the charge and penalties. The findings of the panel are final. The panel will notify the instructor, the chairperson, division, the student, and the Office of Academic Affairs of their findings and any recommendations for change in penalties.

Title IX Notification

Maryland Institute College of Art seeks to provide an educational environment based on mutual respect that is free from discrimination and harassment. There are multiple ways to report sexual harassment/misconduct/assault and reports are encouraged. Students requiring academic adjustments due to an incident involving sexual harassment or discrimination should contact Student Affairs at 410.225.2422 or Human Resources at 410.225.2363. Keeping with institutional commitments to equity and to comply with Title IX of the Education Amendments of 1972 and guidance from the Office for Civil Rights, faculty and staff members are required to report disclosures of gender based discrimination made to them by students. However, nothing in this policy shall abridge academic freedom or MICA’s educational mission. Prohibitions against discrimination and discriminatory harassment do not extend to actions, statements, or written materials that are relevant and appropriately related to course subject matter or academic discussion.

Students with Extended Illness or Absence

In the case of extended illness or other absences that may keep the student from attending a class for more than three meetings, undergraduate students must contact the Student Development Specialist in the Division of Student Affairs or have an official disability accommodation letter issued by the Learning Resource Center that specifically addresses class absences. For students who have not been approved for academic disability accommodations, the Student Development Specialist will work with the student to determine the cause and appropriateness of the absences and subsequently notify instructors as necessary. Graduate students must contact the instructor, director, and Associate Dean of Graduate Studies. Students in professional studies programs must contact the Associate Dean for Open Studies. The appropriate administrator will facilitate a conversation with relevant faculty to determine whether the student can achieve satisfactory academic progress, which is ultimately at the sole discretion of the faculty member.