| Week | Date | Pre-Recorded / Live | Topic | Examples | Resources | Reading |
| Week 1 | 9/2 | Live | Introduction | | | Intro Slides |
| Week 2 | 9/7 | Review slides and download FTP and Text Editing Software | | | Unix Cheat Sheet
FTP Software:
Fetch
Cyberduck
Text Editing Software:
TextWrangler
BBEdit | OS Slides |
| 9/9 | Live | OS & Web Set Up | i6 Website | How Does the internet work? | |
| Week 3 | 9/14 | HTML: Part 1
HTML Demo: Part 2 | Intro to HTML | Tags Page
Assignment 2 Example | W3 Schools – HTML Elements | HTML Slides
Chapters 4 – 8 |
| 9/16 | Live | HTML Structures | Choose Your Own Adventure Example
| HTML Layout | |
| Week 4 | 9/21 | CSS: Part 1
CSS: Demo | Intro to CSS | | W3 Schools – CSS
W3Schools: CSS Color Names | CSS Slides
Chapters 11 – 14 |
| 9/23 | Live | CSS Continued | Assignment 3 Example | Google Fonts
CSS Display
CSS Id and Classes
CSS Box Model | |
| Week 5 | 9/28 | CSS Positioning
CSS Positioning: Demo | Layout: Positioning, Floats and Flexbox | Float Example
Position Example
Flexbox Example | CSS Position
CSS Float
Flexbox | |
| 9/30 | Live | Typography Poster – In Class Activity | |
| |
| Week 6 | 10/5 | Review Available Slides and Resources | Accessibility & The Web | Video: Web Accessibility Perspectives
Web Accessibility Initiative
Contrast Color Checker | Accessibility Slides | Layout Slides
CSS Positioning 101
Chapters 15 – 16 |
| 10/7 | Intro to Digital Imaging | Digital Imaging Basics | | Get Adobe Photoshop
NYU Creative Cloud Subscription | |
| Week 7 | 10/12 | No Class -Monday Schedule | | | | Digital Imaging Slides
Chapters 23 – 24 |
| 10/14 | Live | Intro to Photoshop | Landscape – PSD File
Landscape -JPG | Photoshop Tutorials
Photoshop Alternatives:
Gimp
Pixlr | |
| Week 8 | 10/19 | Intro to Color & Type
Digital Imaging: Part 2 – Photoshop Demo | Advanced Imaging Techniques | Gallery Assets
Rick & Morty Assets | Font Websites:
DaFont
Font Roundup
Color Websites:
ColourLovers
Adobe Kuler
Generate | Color & Type Slides |
| 10/21 | Live | Photoshop Challenge and Critiques | | | |
| Week 9 | 10/26 | Review Materials | SVGs & CSS3 | | SVG Paths
Bezier Curve Game
Adobe Illustrator
Illustrator Tutorials | SVG Slides
Chapters 18 – 19, 25 |
| 10/28 | Live | SVG & Midterm Review | Shapes Example
Paths Example
Custom Illustrator SVG Example | | |
| Week 10 | 11/2 | | Midterm Exam | | | |
| 11/4 | Live | Web Design Process | | | Process Slides |
| Week 11 | 11/9 | Pre-Recorded | Sketch | | Download Sketch
Sketch Tutorials | |
| 11/11 | Live | Guest Speaker – TBD | | | Web Layout Slides |
| Week 12 | 11/16 | Pre-Recorded | Web Layouts & CSS Grids | | Alternative Navigation
Best Wireframing Tools
Great Wireframe Examples
960 Grid
A Complete Guide to CSS Grid | Responsive Design Slides
Read: Beginners Guide to Responsive Design
Watch: 10 Basics of Responsive Design
Chapter 17 |
| 11/18 | Live | Coding Demo | Grid Example
Responsive Grid Example | Grid Garden Game
Grid Examples | |
| Week 13 | 11/23 | Watch & Read Slides and Additional Resources | Responsive Design | | W3 Schools – Responsive Design
W3 Schools – Media Queries
Media Queries Examples
Breakpoints | |
| 11/25 | No Class Thanksgiving | | | | |
| Week 14 | 11/30 | HTML: Forms
HTML: Media | Multi Media & Forms | Form Example
Audio & Video Example | Form Spree
HTML Forms
Styling HTML Forms
HTML – Video
Online Video Compresor | Chapters 9 – 10 |
| 12/2 | Live | Twitter Bootstrap | | Get Bootstrap
Bootstrap Tutorials | Web Inspiration
Awwwards
Typewolf |
| Week 15 | 12/7 | Review Available Slides & Resources | Web Hosting & Domains | | GoDaddy
Google Analytics | Hosting Slides
|
| 12/9 | Live | Guest Speaker: TBD | | | |
| Week 15 | 12/14 | Live | In Class Workshop & Final Review | | | |