Syllabus
DTC 477: Advanced Web Design & Development
Spring 2026
- Location: VMMC 111
- Class Time: TTH 4:20pm-5:35pm
- Instructor: Will Luers
- Email: wluers@wsu.edu
- Office Hours: M 4:00pm-5:00pm, T 3:00pm-4:00pm in the Digs or on Zoom most days after 12pm
Course Rationale
DTC 477 Advanced Web Design & Development builds on the HTML/CSS skills developed in DTC 355 and provides a foundation in the main programming language for the web: JavaScript. By integrating various tools, design approaches and scripting languages (HTML5, CSS3 andJavascript), students create dynamic multimedia and interactive projects. The CMDC aims to achieve three main goals: to 1) provide students with knowledge and skills for developing their own knowledge-making, 2) facilitate exploration, and 3) prepare students for the field and the world beyond.Learning Goals
| Required Course Activities | University Learning Goals | University Learning Objectives | CMDC Goals & Objectives |
| 1. Interactive Website/E-lit Project/Hangman (Javascript basics) | Critical and Creative Thinking (ULG1) Communication (ULG4) | Combine and synthesize existing ideas, images, or expertise in original ways. Express concepts propositions, and beliefs in coherent, concise, and technically correct form. | Goal 1: Demonstrate competency with computers for designing, distributing, retrieving, and preserving digital works in various mediums for humane and effective human-computer interactions Goal 2: Synthesize media forms for multimedia contexts Goal 3: Employ the principles of visual form for sophisticated image manipulation |
| 2. Weather App Project: Javascript API (introduction to programming and geolocation) | Critical and Creative Thinking (ULG1) Communication (ULG4) Quantitative and Symbolic Reasoning (ULG2) | Combine and synthesize existing ideas, images, or expertise in original ways. Express concepts propositions, and beliefs in coherent, concise, and technically correct form. Understand and apply quantitative, symbolic and computational principles and methods in the solution of problems | Goal 7 Recognize various forms of language processing and their implications for media authoring |
| 3. Canvas Project/P5js: Javascript Animation (program an original interactive object) | Critical and Creative Thinking (ULG1) Communication (ULG4) Quantitative and Symbolic Reasoning (ULG2) | Combine and synthesize existing ideas, images, or expertise in original ways. Express concepts propositions, and beliefs in coherent, concise, and technically correct form. Understand and apply quantitative, symbolic and computational principles and methods in the solution of problems | Goal 7 Recognize various forms of language processing and their implications for media authoring |
| 3. HTML 5 Game | Critical and Creative Thinking (ULG1) Information Literacy (ULG2) Communication (ULG4) Depth, Breadth, and Integration of Learning (ULG7) | Combine and synthesize existing ideas, images, or expertise in original ways. Determine the extent and type of information needed. Express concepts propositions, and beliefs in coherent, concise, and technically correct form.By applying the concepts of the general and specialized studies to personal, academic, service learning, professional, and/or community activities. | Goal 7 Recognize various forms of language processing and their implications for media authoring Goal 5 Know the basics of information architecture and knowledge management along with ways digital information can be structured for retrieval and archival purposes for different audiences |
The assignments and activities for this course reflect these objectives and serve to assist students with reaching program goals.
Course Structure
- Focus on the manual creation of web-based objects and other digital interfaces
- Readings, discussion of concepts, and application of theory
- Multiple assignments and projects
- Conceptual and creative work with ideas explored in this course
Online tools
- Slack - download and sign-up with your wsu account. Once you are invited to the class channel you will see it in the sidebar.
Required Course Texts and other resources
- Codecademy's Learn JavaScript
- Sublime Text or a similar text-editor
- ChatGPT (free is fine for this class, the Plus version is $20 per month)
Course Point-Earning Opportunities
- Javascript Codecademy: 10% x 2 = 20%
- Interactive Website: 5%
- Hangman Game: 5%
- Creative Programming: 15%
- Weather API: 15%
- HTML5 Game Project: 30%
- Participation: 10%
Schedule & Project Due Dates
| Week | Date | Topic | Assignment / Project Due |
|---|---|---|---|
| 1 | Jan 13 & 15 | Introduction to Programming | – |
| 2 | Jan 20 & 22 | Values, Types & Operators | – |
| 3 | Jan 27 & 29 | Functions, Arrays & Loops | - |
| 4 | Feb 3 & 5 | Array Methods and Iterators | JavaScript Codecademy #1 Due (10%) |
| 5 | Feb 10 & 12 | Hangman | Interactive Website Due (5%) |
| 6 | Feb 17 & 19 | Creative Programming | Hangman Game Due (5%) |
| 7 | Feb 24 & 26 | Canvas Drawing & Animation | JavaScript Codecademy #2 Due (10%) |
| 8 | Mar 3 & 5 | Object Literals & JSON | - |
| 9 | Mar 10 & 12 | Weather API | Creative Programming Due (15%) |
| Spring Break (No Class): March 16–20 | |||
| 10 | Mar 24 & 26 | HTML5 Games: Classes | - |
| 11 | Mar 31 & Apr 2 | HTML5 Games: Brainstorm | Weather App Due (20%) |
| 12 | Apr 7 & 9 | GitHub Collaboration | – |
| 13 | Apr 14 & 16 | HTML5 Games: Development | - |
| 14 | Apr 21 & 23 | JS Review & Testing | - |
| 15 | Apr 28 & 30 | Final Presentations | HTML5 Canvas Game Due (30%) |
General Project Guidelines
- Projects should address usability, navigation, and design issues raised in this course and in DTC 355
- Projects should utilize attractive and effective design and layout
- JavaScript coding, HTML/CSS mark-up, site design and content must be your own work. You may use snippets of code and ChatGPT to build your project, but it may not be another's code that you call your own.
- Content should be substantive and should be written/created by you with the assistance of AI tools,
- All images not created by yourself or in collaboration with an AI image generator must be clearly labeled with ownership and copyright information
- Projects should be checked thoroughly for errors. There is no excuse for sloppy writing or error filled code and such mistakes will count against you.
Assessment and Final Grades
Both attendance and participation will be monitored and deficiencies in either/both will result in lower final grades. Participation means being attentive in class, joining in discussions, engaging in informal critiques and completing all in-class and outside assignments.
You are allowed 3 class absences. Each class absence after that will result in a 3-point deduction from the final cumulative points. It is your responsibility to make sure I check your attendance if you arrive after the start of class. Frequent late arrivals, leaving early, or other forms of lack of attendance will also deduct points from the cumulative total. Absent students remain responsible for all course matters during their absence(s). Opportunities to make up missed work may not be available.
| A A- | 93-100 90-92 |
| B+ | 87-89 |
| B | 83-86 |
| B- | 80-82 |
| C+ | 77-79 |
| C | 73-76 |
| C- | 70-72 |
| D | - |
| F | 0-69 |
Notice that the grade of "D" is not offered; reverts to "F."
Submission of Late Work
All work must be submitted as and when required. If you are sick or have an emergency, you must make contact with me (best to use Slack) and arrange a time to submit work.
AI Use Policy
Students are encouraged to use AI tools to amplify their strengths and enhance their learning. AI can be a valuable resource for:
- Learning and research (always fact-checked for accuracy)
- Coding assistance and error checking
- Brainstorming and world-building
- Mood board creation and visual inspiration
- Planning and structuring projects
- Generative media for multimedia art, cinema, sound, and other creative disciplines
However, in this course, ideas and approaches will begin with you. Much of the creative process will be sketching, planning and working out logic steps for your interactive sites. This is designed to slow the process down and help you develop a clear perspective and direction before you turn to AI tools.
AI should be used as a support for thinking — not a shortcut to bypass it.
- Your final submissions must reflect your own style, approach, and aesthetic.
- For most projects, I may require documentation of all AI-assisted work — including transcripts of chats, prompts, and outputs used during development.
- Transparency is essential to your growth in digital media and in working with generative AI. If AI meaningfully shaped your work, you should note where and how you used it (for example: “I used ChatGPT to debug a function, then rewrote the solution in my own style” or “I generated images to explore a visual style and then used my own sketches to refine and complete the scenes”). This documentation helps track your role in a complex creative process.
- Direct, unmodified AI outputs should not be submitted as your own work. This includes copy-pasting code, text, or images without adaptation or acknowledgment.
AI tools — including those for generative media — are powerful learning partners, but they cannot replace the slower, deeper process of design thinking, workshopping, and evolving your own ideas in dialogue with others.