(always subject to change)
School: NYUAD
Program: Interactive Media
Course Number: MDMED-AD 116
Semester: Fall 2016
Class: Tuesday 2:40pm - 3:55pm & Thursday 2:40pm - 5:20pm
Room: Arts Center IM Lab (Rm.029)
Room Access Form
Instructor: Craig Protzel
Email: craig.protzel@nyu.edu
Office: Arts Center Rm.191
Office Hours: TBD
As the World Wide Web continues to grow and permeate our everyday lives, an ever-increasing amount of data and digital services are accessible to us through public web APIs - Application Programming Interfaces. Common to many web sites, including YouTube, Twitter, Google Maps, Wikipedia and more, web APIs offer a means to programmatically request and re-purpose endless troves of information. But how exactly do we access these datasets and services? How can we write code to transfer, store, and display this content on our own web sites? And how might we use these available resources to design unique, creative, and compelling web experiences of our own.
This class is about creating interactive single-page web applications that leverage public data and digital services from a wide range of existing web products. The overall goal of the class will be for each student to have 3 well-designed functional single-page web applications by end of semester. Subscribing to a project-oriented approach, a majority of class time will be spent reviewing and writing code, primarily Javascript, for client-side (front-end) web development. We will use a number of Javascript libraries, including jQuery, Underscore, p5, Popcorn, D3 and more, to help build a diversity of web experiences. Where server-side (back-end) development is required, we will use the Node-Express framework. Students should have some programming experience as well as an exposure to basic client-side web development, specifically HTML and CSS. Experience with Javascript is a plus.
- PART I: Classes 01 - 09 Client-Side Web Development + API Fundamentals
- PART II: Classes 10 - 17 Client-Side Javascript Libraries
- PART III: Classes 18 - 28 Server-Side Web Developmentt
- Develop a clear understanding of client-side (front-end) web development and the roles of client-side web technologies, specifically HTML, CSS, Javascript, and public web APIs
- Develop a basic understanding of the Javascript language as well as the ecosystem of open source client-side Javascript libraries
- Learn how to work with a variety of data-serving public web APIs
- Learn how to create web pages for modern browsers that leverage data and services from public web APIs
- Gain exposure to server-side (back-end) web development and data storage
- Become empowered to produce compelling well-designed single page web experiences
This is a production-based course that involves programming work both inside and outside of the classroom. During class, code examples will be presented, written, and reviewed. Examples will iteratively build off lessons learned in preceding classes and students will be encouraged to write code, ask questions, and engage in both creative and technical discussion. The course embraces a process-oriented philosophy believing that programming, design, and web development are best learned by doing. Thus, much of class time will be spent doing hands-on workshop-style lessons and exercises.
- Learn - skills, tools, processes, techniques, resources
- Explore - challenges, risks, failures, adventures, dreams
- Grow - advance, empower, progress, reflect, repeat
- Share - describe, document, communicate, contribute, participate
10% Attendance
10% Participation
25% Homework Assignments + Online Journal
30% Projects #1 & #2
25% Final Project
Each class there will be homework assignments. Homework may include reading, watching videos, doing code exercises, creating web prototypes, and completing projects. Feel free to collaborate with your classmates and work together on any assignment(s), but everyone must share/submit their own individual work.
Class time will be spent going over assignments. Expect to be asked to show your work every class. Some classes everyone may demonstrate their work, other classes only a few students will share, but always be prepared to do so. All of your work must be completed on time prior to class.
You are expected to keep some form of an online journal or web blog. For each assignment, you must:
- provide a direct hyperlink to the work
- describe the assignment
- discuss what you chose to do and why
- document any resources/research/inspiration
- explain your process
- highlight both successes and failures
The purpose of the journal is twofold. First, it is a valuable way for you to communicate that you are keeping up with the work in the class and that you are grasping the material. I read the journals to see how you are doing.
Second, the journal is a way to document your work for your own use and that of others. You must update the journal each week with the work you have done for class. You should use the journal as an opportunity to write clear, concise thoughts, questions, and analysis based on the class assignments. The writing is expected to be well reasoned and grammatically correct. You should link to any relevant sources, and provide context, such as images, video or audio, when appropriate. Whether this is a tumblr, a Wordpress site, a static HTML page, or even a Google doc does not matter. What does matter is that it is online and publicly accessible.
These two projects can be thought of as mini-mid terms. Both will build off preceding homework assignments thus allowing you to iteratively build towards their completion. Project 1 will involve creating a single page (client-side only) web experience that, upon user input, responds with data from at least 2 public web APIs. Project 2 will involve creating a single page (client-side only) web experience that ideally leverages data from at least one public web API and incorporates the use of at least one Javascript “interaction” library, such as p5, D3, Three, Popcorn, etc. For both projects, you will be expected to present your site, discuss your work, and clearly articulate your creative process.
Your final project will require developing a comprehensive single page web experience that includes:
- client-side and server-side web development
- at least one public web API as a data source
- at least one javascript “interaction” library
- database storage
- a public web API route to serve your stored data
- Attendance is mandatory. Every class builds off the previous one so it is vital to be present for every lesson. Unexcused absences or habitual lateness will negatively impact your final grade for the class. If you are going to be late or absent, please email me in advance. If you have an emergency, please let me know as soon as you can.
- More than two unexcused absences (more than 20 minutes late to class) will result in a lower final grade (i.e. B+ to B). More than five unexcused absences will result in an F.
- Showing up on time, engaging in the class discussion, and offering advice and input during class is a major part of your grade. Participating in class is helpful for me to get to know you as an individual and keep track of your progress, but most importantly, it provides you and your classmates the opportunity to share failures, successes, and insights on the work you are doing.
- Please turn in all assignments on time. For each day an assignment is late, it will result in a lower final grade (i.e. B+ to B).
- You are expected to show work in class. This includes a working web site, a kind-of working web site, a non-working web site, a failed web site, a web site that works but not the way you expected it to work, and so on. Basically, don’t be afraid to volunteer to show what you did do or failed to do. Explaining your work to other people is a great way to better understand the material and answer questions for yourself. Plus, showing work that did not function as expected is not a sign of failure, it is an opportunity to learn.
- Ask questions. If you do not ask questions, I can only assume you understand the material completely.
Laptop use will be expected in class, but should be focused on class-specific material, applications, and research. Whenever classmates are presenting please keep your laptop closed. The quality of the class depends in large part on your attention and active participation, so please respect your fellow classmates and close your lid.
Please put them on vibrate or turn them off before you come to class. If you have an emergency that requires you to answer your phone during class, please let me know me ahead of time or quietly step out of class to take the call.
If you have any questions, would like extra help, or need further instruction, please reach out to me. You can communicate with me via e-mail, sign up for ofice hours, speak with me before class, after class or during break, but please let me know if you have any concerns pertaining to the course.