Preamble
Description
From CUNYFirst:
This course builds on the programming, media manipulation and presentation skills developed in MMP 210 - Multimedia Programming I. Students will learn the multimedia application design process, from planning through production. Using media creation and programming software tools, students will build user-friendly web and multimedia applications.
Prerequisite
Learning Outcomes
Upon successful completion of this course, you will understand...
- how to author semantic web pages using HTML and CSS;
- how to write object oriented CSS using Sass;
- how to write procedural, functional, and object oriented JavaScript;
- how to revision control your work using Git;
Software Requirements
Whether you use Windows or Mac, all the necessary software for this course is listed below. It’s all free and downloadable from their respective links.
Browsers (Mac and Windows)※
Download all the browsers available at Browse Happy. Some of the students in my more in-depth classes might also want Chrome Canary, Safari Technology Preview, Firefox Developer Edition, and Firefox Nightly. I use Chrome and Firefox in class.
Grid Chrome Extension (Mac and Windows)※
In order to make your web development workflow easier, you’ll need to install The Modular Grid, a Chrome extension that overlays a grid over your web design mocks.
Fonts (Mac, Windows, and Linux)
In addition to the stock issue, monospace/fixed-width fonts included with your OS, here are a few more fonts to explore in your text editors:
Text Editor (Mac and Windows)
The code you write will require a text editor. Although there are many on the market, such as Brackets (open source), Sublime Text (nagware), and Visual Studio Code (open source), Atom (open source) is the only editor supported in class. (I can, however, help if you use Sublime Text.) It’s available for Mac and Windows from atom.io.
Enabling The Root User
The super, or root, user is a special account included with Macs and Linuxes. On Macs, this user is disabled by default. You must enable this user for the work you’ll do in this class. Follow these instructions to do so.
A Compression/Decompression Utility
If you’re using Windows and you don’t have a compression/decompression utility, download 7-Zip, which is free and open source. Mac and Linux/UNIX users already have free compression utilities installed at the command line.
A Command Line Interface
Mac and Linux users do not have to install a Command Line Interface, or CLI, because these operating systems already have The Terminal installed. Windows users, however, might want to install Cygwin.
Mac users must install this set of environment files.
Sass (Mac and Windows)※
You’ll need Sass. Download Koala, which is a GUI for Sass.
A Link Checker
The W3’s Link Checker isn’t software you download, but a utility that verifies links on a web page so you don’t have to. Bookmark it.
Schedule
- Where: The Miles and Shirley Fiterman Hall, Rm 1006
- Day: Monday and Wednesday
- Dates: 27 January 2017 – 24 May 2017
- Time: 5:30 PM – 7:10 PM
Major Dates
- DATE (class 8): Midterm project presentation
- DATE (class 15): Final project presentation
In addition to the schedule below, the master CUNY calendar is available here.
Note: The topics listed below will be covered in the order listed, time permitting. It’s possible that some topics will be overlooked.
Week | Topics | Homework (for following week) |
---|---|---|
1 |
|
|
2 |
|
|
3 |
|
|
4 |
|
|
5 |
|
|
6 |
|
|
7 |
|
|
8 |
|
|
9 |
|
|
10 |
|
|
11 |
|
|
12 |
|
None |
13 |
|
None |
14 | Open lab | None |
15 |
|
None |
Class Policies
- Consuming food in class. There is no eating inside our classroom, either during class or while on break. The smell of food is very distracting, even offensive to some, and can linger in a room. Eat before or after class. Drinks in covered containers, however, are allowed.
- Grading. I do not give grades — students earn them. The grade you earn is based strictly on a formula clearly listed in your online syllabus, under the Grading Standards section. Memorize the simple formula at the beginning of the semester so you always know where you stand, grade wise.
- Extra credit. There may be chances for extra credit. This will be made clear in the syllabus for your class, or via a message to the Google Group, once the semester has started.
- Seating arrangement. You will be seated in clusters, based on whether you use a computer in class or not, or which operating system you use. Students who do not — or rarely — use a computer in class will be grouped together, because they tend to prefer not to be distracted by surrounding computer users when taking written notes. Windows users will be grouped with other Windows users, and Mac users will be grouped with other Mac users. This makes it easy for users to help each other, and for me to help Windows and Mac users as a group. You are welcome to sit anywhere within your cluster.
Grading Standards
Grading Formula
Your grade for this course will be computed entirely on the following formula:
- Surprise Homework (20%)
- Midterm project [submission, presentation, and critique] (25%)
- Final project [submission, presentation, and critique] (40%)
- Attendance (15%, or 100% if unexcused absences exceed 4)
This grading formula is unbending and will be adhered to strictly.
Important Note
Please, please do not try to negotiate a grade with me — before or after — any work due. By asking me to favor you (“I can’t have this class hurt my GPA,” “My student status depends on my doing well in this class,” or, “I need a B or better for my student loans”), you’re asking me to put you above your classmates. It’s a form of extortion, and I will remember your having asked me to treat you better than your peers.
Manage your time well; I do not accept late work.
The A Range
A (“Work of exceptional quality”)
Students who earn an “A” produce work that is impressive, goes beyond what is required of the course, and exemplifies a superb work ethic. Their work is exceptional. “A” students might — or should — share their knowledge with their classmates, and they are active participants in class discussions. “A”-grade students do not spend time distracted by others or digital devices, and are contributing members of the class. Lastly, “A”-level students demonstrate an evolving understanding of the material through iterative efforts of their work.
A- (“Work of high quality”)
In the “A-” range, a student has performed very closely to the level of his or her “A”-level counterpart, but has produced at least one project/homework/component of the grading scheme that was below a grade of “A.” Perhaps the student missed too many classes, showed up to class late too often, or submitted an assignment/homework that was not “A”-level.
The B Range
B+ (“Very good work”)
Students earning grades of “B+” produce very good work, which is close with that of their counterparts earning in the “C” range, but offer a sustained and meaningful structure to a critical user experience and design that is more complex than students earning a grade in the “C” range. “B+” students’ work is logically organized, responds to assignments in thoughtful and distinctive ways, and offers a sound user experience. Although minor coding and layout errors may be present, they are under control and do not impede user experience or content.
B (“Good work; satisfies course requirements”)
Overall, “B” range students produce work with good results. He or she possesses a strong understanding of the course’s content and shows a high level of competence in the skill set taught in the course.
B- (“Below-average work”)
Students in the “B-” range are producing work that is above adequate but below average. Their work shows flashes of very good work, but, overall, is not compelling for a grade of a “B.”
The C Range
C+ (“Less than adequate work”)
“These are average assignments. They will demonstrate some success in engaging with the assigned material. The document will show that the student can identify and work with key frameworks and methods with a particular set of content and apply them to ideas and examples found in other precedents, or other outside interactive experiences. Additionally, the assignment will demonstrate effort in the areas of user experience, interaction design. Typical of a “C/C+” assignment, however, is a disjointed sense of content hierarchy and user experience in connection with the page. Generally these assignments contain general coding errors which create unwanted or negative rendering, however, the assignments still work and an effort to debug and fix errors is present.”
C (“Well below average work”)
In the “C” range, a student has show more than minimal progress to pass, but not quite on the level of a “C+” student.
C- (“Poor work; lowest possible passing grade”)
A student who earns a grade of “C-” has performed the bare minimum to pass the course. He or she has performed very near to that of a student who would typically fail, but has some basic understanding of important concepts related to the course. He or she has also shown some attempt at trying to grasp the material of the course. In essence, the student has produced work that shows evidence of minimal effort expended.
F (“Failure”)
Failing grades are earned by students who do not submit required work, produce incomplete work, and/or do not take examinations (without prior notification and approval). Grades of “F” are also earned by students who show no comprehension of the topics discussed in class and no forthcomingness to attempt to comprehend. Students who fail show no interest in learning, make no effort to remedy problem areas, are continually distracted in class by other students and/or mobile electronic devices, and interrupt class.
Resources
Whether you use Windows or Mac, all the necessary software for this course is listed below. It’s all free and downloadable from their respective links.
HTML
- The Sitepoint HTML Reference is a reference mainly for HTML4.01, but is very helpful, nonetheless.
- HTML5 Doctor is a tutorials/blog about HTML5.
- Web Fundamentals is a set of tutorials and tools from Google.
- The HTML5 Boilerplate provides users with a generic template for web projects, and is configurable online.
CSS
- Eric Meyer’s base/reset CSS is a reliable way of cancelling out browser styles.
- Chris Coyier’s CSS-Tricks provides CSS-based tutorials and — of course — tricks.
- Sitepoint’s CSS Reference provides useful explanations of CSS concepts.
- Can I Use a CSS, HTML, JavaScript, or other web-based syntax in new code?
- A CSS3 gradient generator that helps with the unwieldy CSS3 gradient syntax.
- A specificity calculator that is useful in reinforcing the concepts of specificity.
Git
- The official Git home page.
- The GitHub home page.
- The Atlassian Git tutorials.
- Consider applying for a GitHub Education account.
JavaScript
- The JavaScript reference at the Mozilla Developer Network, or MDN
- The JavaScript DOM API reference at MDN
Sublime Text
- A tool that explains and helps users to create a Sublime Text preferences file.
- The official Sublime Text documentation.
- The unofficial Sublime Text documentation.
Validators and Linters
- The HTML Validation Tool validates your HTML as valid HTML5 code.
- The CSS Validation Service validates your CSS source.
- Keeping in the tradition of C’s lint tool, JSLint is a strict JavaScript syntax linter (checker).
- JSHint is a more lenient JavaScript linter.
Students with Disabilities
Click the following link to read about BMCC’s commitment to students with disabilities: http://www.bmcc.cuny.edu/accessibility/index.jsp.
Contact
My email address is roy dot vanegas at gmail dot com. However, I only communicate with students over email in emergency situations (death, divorce, personal tragedy, pet emergency, etc). For matters related to the class, you’re advised to see me before class, during the break, or after class.
Office Hours
The only time I may be available to meet with students is by appointment at or around 5:00 PM on the BMCC campus. If we cannot meet during office hours, we can arrange a Skype session.